/*
Theme Name: ROI Monitor Landing
Author: Datafanatics / Bart Eichhorn
Version: 1.4.0
Description: Landing theme with ROI Landing page template + per-page fields (desktop/mobile H1, subtitle, embed).
Text Domain: roi-monitor-landing
*/
/* Mobile-only heading text + spacing */
    @media(max-width:768px){
      .form-hero h1.desktop{ display:none; }
      .form-hero h1.mobile{ display:block; margin-bottom:28px; }
    }
    @media(min-width:769px){
      .form-hero h1.mobile{ display:none; }
    }

    :root{
      --bg:#0b0f19;
      --text:rgba(255,255,255,.92);
      --muted:rgba(255,255,255,.80);
      --brand:#1B4079;
      --form-bg:#125C6A;
      --max:1120px;
      --pad:clamp(16px,3vw,28px);
      --header-h:70px;
      --h1: clamp(34px, 4.5vw, 54px);
      --p: 18px;
    }

    *{ box-sizing:border-box; }
    html,body{ margin:0; padding:0; }
    body{
      font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
      background:
        radial-gradient(900px 500px at 20% 10%, rgba(27,64,121,.28), transparent 55%),
        radial-gradient(900px 500px at 80% 20%, rgba(0,175,84,.20), transparent 55%),
        radial-gradient(900px 600px at 60% 90%, rgba(0,175,84,.14), transparent 55%),
        var(--bg);
      color:var(--text);
      line-height:1.5;
    }

    /* Global link styling: prevent default blue/purple */
    a{ color: inherit; }
    a:visited{ color: inherit; }

    /* HEADER */
    header{
      position:sticky;
      top:0;
      z-index:10;
      background:var(--brand);
    }
    .header-inner{
      height:var(--header-h);
      display:flex;
      align-items:center;
      max-width:var(--max);
      margin:0 auto;
      padding:0 var(--pad);
    }
    .header-inner img{ height:48px; display:block; }

    /* HERO (CENTERED) */
    .form-hero{
      background:var(--form-bg);
      color:#fff;
      text-align:center;
    }
    .form-hero-inner{
      max-width:900px;
      margin:0 auto;
      padding:72px var(--pad) 48px;
    }
    .form-hero h1{
      font-size:var(--h1);
      line-height:1.06;
      margin:0 0 18px;
      font-weight:700;
    }
    .form-hero p{
      font-size:var(--p);
      margin:0 auto;
      max-width:720px;
      color:var(--muted);
    }

    /* TYPEFORM (80% WIDTH CENTERED) */
    .form-full{
      width:100%;
      background:var(--form-bg);
      padding:0 0 40px;
      display:flex;
      justify-content:center;
    }
    .form-inner{
      width:80%;
      max-width:1100px;
    }
    .form-inner > div[data-tf-live]{
      width:100%;
      min-height:520px;
      background:var(--form-bg);
    }
    .form-inner iframe{
      background:var(--form-bg) !important;
    }
    @media(max-width:900px){
      .form-inner{ width:100%; }
    }

    /* FOOTER */
    footer{
      background:rgba(0,0,0,.22);
      border-top:1px solid rgba(255,255,255,.10);
      padding:48px 0;
    }
    .footer-inner{
      max-width:var(--max);
      margin:0 auto;
      padding:0 var(--pad);
      display:grid;
      grid-template-columns:1fr auto;
      gap:32px;
      align-items:center;
    }
    .footer-inner img{ height:30px; }
    .links{
      margin-top:12px;
      display:flex;
      gap:14px;
      flex-wrap:wrap;
      font-size:12px;
    }
    /* footer links same color + underline like original */
    .links a{
      color: rgba(255,255,255,.85);
      text-decoration: underline;
      text-underline-offset: 3px;
    }
    .links a:hover{ color:#fff; }

    .fineprint{
      font-size:13px;
      opacity:.75;
      text-align:right;
      line-height:1.4;
    }
    @media(max-width:768px){
      .footer-inner{ grid-template-columns:1fr; }
      .fineprint{ text-align:left; }
      .form-hero-inner{ padding:56px var(--pad) 36px; }
    }

    /* DISCLAIMER (restore full text) */
    .disclaimer{ background:#1B4079; color:#fff; }
    .disclaimer-inner{
      max-width:1100px;
      margin:0 auto;
      padding:40px 20px;
      font-size:12px;
      line-height:1.6;
    }
    .disclaimer p{ margin:0 0 14px; opacity:.95; }
    .disclaimer p:last-child{ margin-bottom:0; }
  
    @media(max-width:768px){
      .form-hero-inner{
        max-width:90%;
      }
    }


/* Theme overrides to guarantee correct desktop/mobile H1 switching */
.roi-h1-mobile { display: none !important; }
@media (max-width: 768px) {
  .roi-h1-desktop { display: none !important; }
  .roi-h1-mobile { display: block !important; }
}