/*
Theme Name: SEO Agency Adelaide
Theme URI: https://apexbloggers.com
Author: Innosoftworks
Author URI: https://innosoftworks.com/
Description: Wordpress theme designed for SEO Agency Adelaide.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: seo agency adelaide
Tags: one-column, two-columns, custom-menu, featured-images, left-sidebar, right-sidebar
*/


*{margin: 0;padding: 0;box-sizing: border-box;}
 :root{
    --ink:#16233B;
    --paper:#FBFAF6;
    --panel:#F1EEE6;
    --ochre:#BB5B2A;
    --ochre-dark:#9C4A20;
    --sage:#5F8A72;
    --sage-dark:#436450;
    --slate:#4A5568;
    --line:#DFDACE;
    --white:#FFFFFF;

    --display: 'Space Grotesk', sans-serif;
    --body: 'IBM Plex Sans', sans-serif;
    --mono: 'IBM Plex Mono', monospace;
  }

  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:var(--body);
    color:var(--slate);
    background:var(--paper);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    padding-bottom:0;
  }
  img{max-width:100%; display:block;}
  a{color:inherit;}
  ul{list-style:none;margin-bottom: 0;padding-left: 0;}

  h1,h2,h3,h4{font-family:var(--display); color:var(--ink); line-height:1.15; letter-spacing:-0.01em;}
  h2{font-size:clamp(1.6rem, 1.25rem + 1.7vw, 2.5rem); font-weight:700;}
  h3{font-size:clamp(1.05rem, 1rem + 0.4vw, 1.3rem); font-weight:600;}

  .eyebrow{
    font-family:var(--mono);
    font-size:0.72rem;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:var(--sage-dark);
    display:inline-flex;
    align-items:center;
    gap:0.5em;
    margin-bottom:0.9rem;
  }
  .eyebrow::before{
    content:"";
    width:18px; height:2px;
    background:var(--ochre);
    display:inline-block;
  }

  .wrap{max-width:1180px; margin:0 auto; padding:0 clamp(1.25rem, 4vw, 2.5rem);}
  section{padding:clamp(3.5rem,7vw,6.5rem) 0;}

  :focus-visible{outline:3px solid var(--ochre); outline-offset:3px;}

  .reveal{opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease;}
  .reveal.in{opacity:1; transform:translateY(0);}

  /* ---------- NAV ---------- */
  header.site{
    position:sticky; top:0; z-index:100;
    background:rgba(251,250,246,0.92);
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--line);
  }
  .nav{
    display:flex; align-items:center; justify-content:space-between;
    padding:1.1rem clamp(1.25rem,4vw,2.5rem);
    max-width:1180px; margin:0 auto;
  }
  .logo{
    font-family:var(--display); font-weight:700; font-size:1.1rem; color:var(--ink);
    display:flex; align-items:center; gap:0.5rem; text-decoration:none;
  }
  .logo .dot{width:9px; height:9px; border-radius:50%; background:var(--ochre); display:inline-block;}
  .nav-links{display:flex; gap:2rem; font-size:0.95rem; font-weight:500;}
  .nav-links a{text-decoration:none; color:var(--slate); transition:color .2s;}
  .nav-links a:hover{color:var(--ink);}
  .nav-cta{
    background:var(--ink); color:var(--white); padding:0.65rem 1.3rem; border-radius:6px;
    font-weight:600; font-size:0.88rem; text-decoration:none; white-space:nowrap;
    transition:background .2s;
  }
  .nav-cta:hover{background:var(--ochre-dark);}
  .nav-phone{
    display:flex; align-items:center; gap:0.45rem;
    font-family:var(--mono); font-size:0.86rem; font-weight:500; color:var(--ink);
    text-decoration:none; white-space:nowrap;
  }
  .nav-phone svg{flex-shrink:0;}
  .nav-phone:hover{color:var(--ochre-dark);}
  @media (max-width:1080px){.nav-phone{display:none;}}
  .nav-toggle{display:none; background:none; border:none; cursor:pointer; padding:0.4rem;}
  .nav-toggle span{display:block; width:24px; height:2px; background:var(--ink); margin:5px 0; transition:transform .2s, opacity .2s;}

  @media (max-width:820px){
    .nav-links, .nav-cta{display:none;}
    .nav-toggle{display:block;}
    .nav-links.open{
      display:flex; flex-direction:column; gap:0; position:absolute; top:100%; left:0; right:0;
      background:var(--paper); border-bottom:1px solid var(--line); padding:0.5rem 0;
    
    }
    .nav-links.open a{padding:0.85rem clamp(1.25rem,4vw,2.5rem); border-top:1px solid var(--line);  padding: 25px !important;}
    .nav-cta.open{display:block; margin:0.75rem clamp(1.25rem,4vw,2.5rem) 1rem; text-align:center;}
  }

  /* ---------- HERO ---------- */
  .hero{
    background:var(--ink);
    color:var(--white);
    position:relative;
    overflow:hidden;
    padding:clamp(2.8rem,7vw,4.5rem) 0 clamp(3.2rem,8vw,5rem);
  }
  .hero::before{
    content:"";
    position:absolute; inset:0;
    background-image:
      linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size:44px 44px;
    mask-image:radial-gradient(ellipse 80% 60% at 30% 20%, black 40%, transparent 90%);
    pointer-events:none;
  }
  .hero-grid{
    position:relative; z-index:1;
    display:grid; grid-template-columns:1.05fr 0.95fr; gap:clamp(2.5rem,5vw,4rem);
    align-items:start;
  }
  .hero h1{
    color:var(--white);
    font-size:clamp(1.9rem, 1.3rem + 2.8vw, 3.1rem);
    font-weight:700;
    margin-bottom:1.1rem;
  }
  .hero h1 .accent{
    color:var(--ochre);
    background:linear-gradient(transparent 62%, rgba(187,91,42,0.35) 62%);
  }
  .hero p.lede{
    font-size:clamp(1rem, 0.95rem + 0.3vw, 1.1rem);
    color:#C6CEDD; max-width:48ch; margin-bottom:1.8rem;
  }
  .hero-ctas{display:flex; gap:1rem; flex-wrap:wrap;}
  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:0.5rem;
    padding:0.9rem 1.6rem; border-radius:6px; font-weight:600; font-size:0.95rem;
    text-decoration:none; border:1px solid transparent; cursor:pointer;
    transition:transform .15s ease, background .2s, border-color .2s;
  }
  .btn:hover{transform:translateY(-1px);}
  .btn-primary{background:var(--ochre); color:var(--white);}
  .btn-primary:hover{background:var(--ochre-dark);}
  .btn-ghost{border-color:rgba(255,255,255,0.35); color:var(--white); background:transparent;}
  .btn-ghost:hover{border-color:#fff;}
  .btn-dark{background:var(--ink); color:var(--white);}
  .btn-dark:hover{background:#0e1830;}
  .btn-block{width:100%;}

  .trust-row{
    display:flex; gap:1.6rem; flex-wrap:wrap;
    margin-top:2.2rem; font-family:var(--mono); font-size:0.76rem; color:#9AA6BC;
  }
  .trust-row span{display:flex; align-items:center; gap:0.5rem;}
  .trust-row span::before{content:"✓"; color:var(--sage);}

  /* ---------- HERO FORM (signature element) ---------- */
  .audit-form{
    background:var(--white); border-radius:14px; overflow:hidden;
    box-shadow:0 30px 60px -20px rgba(0,0,0,0.45);
  }
  .audit-form-head{
    background:var(--panel); padding:1.1rem 1.5rem;
    display:flex; align-items:center; gap:0.7rem;
    border-bottom:1px solid var(--line);
  }
  .audit-form-head .pin-ic{flex-shrink:0;}
  .audit-form-head .t{
    font-family:var(--mono); font-size:0.7rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--sage-dark);
  }
  .audit-form-head h3{font-size:1.05rem; margin-top:0.1rem;}
  .audit-form form{padding:1.4rem 1.5rem 1.6rem;}
  .field{margin-bottom:1rem;}
  .field label{
    display:block; font-family:var(--mono); font-size:0.72rem; text-transform:uppercase;
    letter-spacing:0.06em; color:var(--slate); margin-bottom:0.4rem;
  }
  .field input, .field select{
    width:100%; padding:0.75rem 0.9rem; border:1.5px solid var(--line); border-radius:7px;
    font-family:var(--body); font-size:0.94rem; color:var(--ink); background:var(--paper);
    transition:border-color .2s;
  }
  .field input:focus, .field select:focus{border-color:var(--ochre); outline:none;}
  .field-row{display:grid; grid-template-columns:1fr 1fr; gap:0.9rem;}
  .form-note{
    font-size:0.78rem; color:#8A93A3; text-align:center; margin-top:0.9rem;
  }

  @media (max-width:900px){
    .hero-grid{grid-template-columns:1fr;}
    
  }
  @media (max-width:460px){
    .field-row{grid-template-columns:1fr;}
  }

  /* ---------- STATS BAR ---------- */
  .stats-bar{
    background:var(--ink); border-top:1px solid rgba(255,255,255,0.08);
    padding:2.2rem 0;
  }
  .stats-grid{
    display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; text-align:center;
  }
  @media (max-width:820px){.stats-grid{grid-template-columns:repeat(2,1fr);}}
  .stat-num{
    font-family:var(--display); font-weight:700; color:#fff;
    font-size:clamp(1.7rem,1.3rem+1.6vw,2.4rem);
  }
  .stat-num .suffix{color:var(--ochre);}
  .stat-label{
    font-family:var(--mono); font-size:0.72rem; letter-spacing:0.06em; text-transform:uppercase;
    color:#9AA6BC; margin-top:0.3rem;
  }
  .stats-note{
    text-align:center; font-size:0.72rem; color:#6B7690; margin-top:1.4rem; font-family:var(--mono);
  }

  /* ---------- SERVICE NUMBERING ---------- */
  .service-card{position:relative;}
  .service-num{
    position:absolute; top:1.3rem; right:1.4rem;
    font-family:var(--mono); font-size:0.75rem; color:#C9C2B3; font-weight:500;
  }

  /* ---------- TABBED PANEL (signature interactive block) ---------- */
  .tab-panel{
    display:grid; grid-template-columns:280px 1fr; gap:0; border:1px solid var(--line);
    border-radius:14px; overflow:hidden; background:var(--white);
  }
  @media (max-width:780px){.tab-panel{grid-template-columns:1fr;}}
  .tab-nav{background:var(--panel); border-right:1px solid var(--line); display:flex; flex-direction:column;}
  @media (max-width:780px){.tab-nav{flex-direction:row; overflow-x:auto; border-right:none; border-bottom:1px solid var(--line);}}
  .tab-btn{
    text-align:left; background:none; border:none; cursor:pointer; font-family:var(--display);
    font-weight:600; font-size:0.95rem; color:var(--slate); padding:1.1rem 1.5rem;
    border-left:3px solid transparent; transition:background .2s, color .2s, border-color .2s;
    white-space:nowrap;
  }
  .tab-btn:hover{background:rgba(0,0,0,0.03);}
  .tab-btn.active{color:var(--ink); background:var(--white); border-left-color:var(--ochre);}
  @media (max-width:780px){
    .tab-btn{border-left:none; border-bottom:3px solid transparent;}
    .tab-btn.active{border-bottom-color:var(--ochre);}
  }
  .tab-content{padding:2rem clamp(1.4rem,3vw,2.4rem);}
  .tab-pane{display:none;}
  .tab-pane.active{display:block;}
  .tab-pane h3{margin-bottom:0.8rem;}
  .tab-pane ul{margin-top:1rem;}
  .tab-pane ul li{
    display:flex; gap:0.7rem; padding:0.55rem 0; font-size:0.94rem; border-bottom:1px dashed var(--line);
  }
  .tab-pane ul li::before{content:"›"; color:var(--ochre); font-weight:700;}

  /* ---------- TESTIMONIALS ---------- */
  .testimonial-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem;
  }
  @media (max-width:900px){.testimonial-grid{grid-template-columns:1fr;}}
  .testimonial-card{
    background:var(--white); border:1px solid var(--line); border-radius:10px;
    padding:1.7rem; display:flex; flex-direction:column; gap:1rem;
  }
  .testimonial-card .quote-mark{font-family:var(--display); font-size:2rem; color:var(--ochre); line-height:1;}
  .testimonial-card p.quote{font-size:0.93rem; color:var(--slate); font-style:italic;}
  .testimonial-who{font-size:0.85rem; color:var(--ink); font-weight:600;}
  .testimonial-role{font-size:0.78rem; color:#8A93A3;}
  .testimonial-note{
    grid-column:1/-1; font-family:var(--mono); font-size:0.75rem; color:#8A93A3;
    text-align:center; border:1px dashed var(--line); border-radius:8px; padding:1rem;
  }

  /* ---------- SECTION HEADERS ---------- */
  .section-head{max-width:660px; margin-bottom:2.8rem;}
  .section-head p{color:var(--slate); font-size:1.02rem;}
  .section-head.center{margin-left:auto; margin-right:auto; text-align:center;}

  /* ---------- SERVICES ---------- */
  .services{background:var(--panel);}
  .service-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem;
  }
  @media (max-width:900px){.service-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:600px){.service-grid{grid-template-columns:1fr;}.hero-ctas {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    justify-content: center;
}}
  .service-card{
    background:var(--white); border:1px solid var(--line); border-radius:10px;
    padding:1.6rem; transition:border-color .2s, transform .2s;
  }
  .service-card:hover{border-color:var(--ochre); transform:translateY(-3px);}
  .service-icon{
    width:38px; height:38px; border-radius:8px; background:var(--ink);
    display:flex; align-items:center; justify-content:center; margin-bottom:1rem;
  }
  .service-card h3{margin-bottom:0.5rem;}
  .service-card p{font-size:0.92rem;}

  /* ---------- FACTORS / WHY SEO ---------- */
  .factors{display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start;}
  @media (max-width:820px){.factors{grid-template-columns:1fr;}}
  .factor-list{display:flex; flex-direction:column; gap:0; border-top:1px solid var(--line);}
  .factor-list li{
    display:flex; align-items:center; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--line);
    font-family:var(--mono); font-size:0.85rem; color:var(--ink);
  }
  .factor-list li .num{color:var(--ochre); font-weight:600;}
  .callout{
    background:var(--ink); color:#fff; border-radius:12px; padding:2rem;
    font-family:var(--display); font-size:1.15rem; font-weight:600; line-height:1.4;
  }
  .callout span{color:var(--ochre);}

  /* ---------- LOCAL VS GENERAL ---------- */
  .compare{
    display:grid; grid-template-columns:1fr 1fr; gap:0;
    border:1px solid var(--line); border-radius:12px; overflow:hidden;
  }
  @media (max-width:700px){.compare{grid-template-columns:1fr;}}
  .compare > div{padding:2rem;}
  .compare .local{background:var(--ink); color:#fff;}
  .compare .local h3{color:#fff;}
  .compare .general{background:var(--white);}
  .compare p{font-size:0.93rem; margin-top:0.6rem;}
  .compare .local p{color:#C6CEDD;}

  /* ---------- TAG CLOUDS (suburbs / approach) ---------- */
  .tagline-block{display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center;}
  @media (max-width:820px){.tagline-block{grid-template-columns:1fr;}}
  .tag-cloud{display:flex; flex-wrap:wrap; gap:0.6rem;}
  .tag{
    font-family:var(--mono); font-size:0.78rem; padding:0.5rem 0.9rem;
    border:1px solid var(--line); border-radius:20px; background:var(--white); color:var(--slate);
    display:flex; align-items:center; gap:0.4rem;
  }
  .tag::before{content:"📍"; font-size:0.7rem;}
  .tag.hi{border-color:var(--ochre); color:var(--ochre-dark); background:#FBF1EA;}

  /* ---------- PROCESS ---------- */
  .process-list{border-top:1px solid var(--line);}
  .process-item{
    display:grid; grid-template-columns:70px 1fr; gap:1.2rem;
    padding:1.6rem 0; border-bottom:1px solid var(--line);
  }
  .process-item .step-num{
    font-family:var(--mono); font-size:1.6rem; color:var(--ochre); font-weight:600;
  }
  .process-item h3{margin-bottom:0.3rem;}
  .process-item p{font-size:0.93rem;}

  /* ---------- RANKING STAGES ---------- */
  .stage-row{display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem;}
  @media (max-width:820px){.stage-row{grid-template-columns:1fr;}}
  .stage{
    background:var(--white); border:1px solid var(--line); border-radius:10px; padding:1.6rem;
    position:relative;
  }
  .stage .eyebrow{margin-bottom:0.6rem;}
  .stage p{font-size:0.92rem;}
  .stage-row .stage:not(:last-child)::after{
    content:"→"; position:absolute; right:-1.55rem; top:50%; transform:translateY(-50%);
    color:var(--ochre); font-size:1.3rem; display:none;
  }
  @media (min-width:821px){.stage-row .stage:not(:last-child)::after{display:block;}}

  /* ---------- LEADS CHECKLIST ---------- */
  .leads-wrap{display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center;}
  @media (max-width:820px){.leads-wrap{grid-template-columns:1fr;}}
  .check-list li{
    display:flex; gap:0.8rem; padding:0.7rem 0; border-bottom:1px dashed var(--line); font-size:0.95rem;
  }
  .check-list li::before{content:"›"; color:var(--sage); font-weight:700; font-size:1.1rem;}

  /* ---------- WHY US ---------- */
  .whyus-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1.4rem;}
  @media (max-width:700px){.whyus-grid{grid-template-columns:1fr;}}
  .whyus-card{
    border-left:3px solid var(--ochre); padding:1rem 0 1rem 1.4rem;
  }
  .whyus-card h3{margin-bottom:0.4rem;}
  .whyus-card p{font-size:0.93rem;}

  /* ---------- MID-PAGE CTA STRIP ---------- */
  .cta-strip{
    background:var(--sage); color:#fff; border-radius:12px;
    padding:1.6rem 2rem; display:flex; align-items:center; justify-content:space-between;
    flex-wrap:wrap; gap:1.2rem; margin-top:3rem;
  }
  .cta-strip p{font-family:var(--display); font-weight:600; font-size:1.1rem; color:#fff;}
  .cta-strip .btn-primary{background:var(--ink);}
  .cta-strip .btn-primary:hover{background:#0e1830;}

  /* ---------- INDUSTRIES ---------- */
  .industries{background:var(--panel);}
  .industry-grid{
    display:grid; grid-template-columns:repeat(4,1fr); gap:0.8rem;
  }
  @media (max-width:900px){.industry-grid{grid-template-columns:repeat(3,1fr);}}
  @media (max-width:600px){.industry-grid{grid-template-columns:repeat(2,1fr);}}
  .industry-chip{
    background:var(--white); border:1px solid var(--line); border-radius:8px;
    padding:0.9rem 1rem; font-size:0.88rem; font-weight:500; color:var(--ink);
  }

  /* ---------- MISTAKES / MYTHS ---------- */
  .mm-grid{display:grid; grid-template-columns:1fr 1fr; gap:2.5rem;}
  @media (max-width:820px){.mm-grid{grid-template-columns:1fr;}}
  .mm-grid h3{margin-bottom:1rem;}
  .mm-list li{padding:0.8rem 0; border-bottom:1px solid var(--line); font-size:0.93rem;}
  .mm-list li strong{color:var(--ink); font-family:var(--display); font-weight:600;}

  /* ---------- FAQ ---------- */
  .faq-list{max-width:800px; margin:0 auto; border-top:1px solid var(--line);}
  details{border-bottom:1px solid var(--line); padding:1.1rem 0;}
  summary{
    cursor:pointer; font-family:var(--display); font-weight:600; color:var(--ink);
    list-style:none; display:flex; justify-content:space-between; align-items:center; gap:1rem;
    font-size:1.02rem;
  }
  summary::-webkit-details-marker{display:none;}
  summary::after{content:"+"; font-size:1.4rem; color:var(--ochre); flex-shrink:0; font-family:var(--body); font-weight:400;}
  details[open] summary::after{content:"–";}
  details p{margin-top:0.8rem; font-size:0.95rem; max-width:64ch;}

  /* ---------- GET STARTED (final CTA) ---------- */
  .final-cta{
    background:var(--ink); color:#fff; border-radius:16px; padding:clamp(2.5rem,6vw,4rem);
    text-align:center; max-width:1180px; margin:0 auto;
  }
  .final-cta h2{color:#fff; margin-bottom:0.8rem;}
  .final-cta p{color:#C6CEDD; max-width:50ch; margin:0 auto 2rem;}
  .final-cta .hero-ctas{justify-content:center;}

  /* ---------- FOOTER ---------- */
  footer{
    background:var(--ink); color:#C6CEDD; position:relative; overflow:hidden;
    padding:clamp(3rem,6vw,4.5rem) 0 0;
  }
  footer::before{
    content:"";
    position:absolute; inset:0;
    background-image:
      linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
    background-size:44px 44px;
    mask-image:radial-gradient(ellipse 70% 60% at 85% 0%, black 30%, transparent 80%);
    pointer-events:none;
  }
  .footer-top{
    position:relative; z-index:1;
    display:grid; grid-template-columns:1.4fr 0.8fr 0.8fr 1fr; gap:2.5rem;
    padding-bottom:2.8rem; border-bottom:1px solid rgba(255,255,255,0.1);
  }
  @media (max-width:900px){.footer-top{grid-template-columns:1fr 1fr; row-gap:2.2rem;}}
  @media (max-width:560px){.footer-top{grid-template-columns:1fr;}}

  .footer-brand .logo{color:#fff; margin-bottom:0.9rem;}
  .footer-brand p{font-size:0.9rem; color:#9AA6BC; max-width:32ch; margin-bottom:1.3rem;}
  .footer-social{display:flex; gap:0.7rem;}
  .footer-social a{
    width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,0.18);
    display:flex; align-items:center; justify-content:center; transition:border-color .2s, background .2s;
  }
  .footer-social a:hover{border-color:var(--ochre); background:rgba(187,91,42,0.15);}

  .footer-col h4{
    font-family:var(--mono); font-size:0.72rem; text-transform:uppercase; letter-spacing:0.1em;
    color:#7C87A0; margin-bottom:1.1rem; font-weight:500;
  }
  .footer-col ul{display:flex; flex-direction:column; gap:0.65rem;}
  .footer-col a{font-size:0.9rem; color:#C6CEDD; text-decoration:none; transition:color .2s;}
  .footer-col a:hover{color:var(--ochre);}

  .footer-contact li{
    display:flex; gap:0.6rem; align-items:flex-start; font-size:0.9rem; color:#C6CEDD;
  }
  .footer-contact svg{flex-shrink:0; margin-top:0.15rem; color:var(--ochre);}
  .footer-mini-cta{
    margin-top:1.3rem; display:inline-flex; align-items:center; gap:0.5rem;
    background:var(--ochre); color:#fff; padding:0.65rem 1.1rem; border-radius:6px;
    font-size:0.85rem; font-weight:600; text-decoration:none; transition:background .2s;
  }
  .footer-mini-cta:hover{background:var(--ochre-dark);}

  .footer-bottom{
    position:relative; z-index:1;
    display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem;
    padding:1.5rem 0 1.8rem; font-size:0.8rem; color:#7C87A0;
  }
  .footer-bottom-links{display:flex; gap:1.4rem; flex-wrap:wrap;}
  .footer-bottom-links a{color:#7C87A0; text-decoration:none;}
  .footer-bottom-links a:hover{color:#fff;}
  .back-to-top{
    width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,0.18);
    display:flex; align-items:center; justify-content:center; text-decoration:none; color:#fff;
    transition:border-color .2s, background .2s, transform .2s;
  }
  .back-to-top:hover{border-color:var(--ochre); background:rgba(187,91,42,0.15); transform:translateY(-2px);}

  /* ---------- STICKY MOBILE CTA ---------- */
  .sticky-cta{
    display:none; position:fixed; left:0; right:0; bottom:0; z-index:200;
    background:var(--white); border-top:1px solid var(--line);
    padding:0.7rem 1rem; box-shadow:0 -8px 20px rgba(0,0,0,0.08);
  }
  @media (max-width:820px){.sticky-cta{display:block;}}

  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{transition:none !important;}
    .reveal{opacity:1; transform:none;}
  }


 /* ---------- SECTION HEADERS ---------- */
  .section-head{max-width:660px; margin-bottom:2.8rem;}
  .section-head p{color:var(--slate); font-size:1.02rem;}
  .section-head.center{margin-left:auto; margin-right:auto; text-align:center;}

  /* ---------- SERVICES / TAB PANEL ---------- */
  .services{background:var(--panel);}
  .tab-panel{
    display:grid; grid-template-columns:250px 1fr; gap:0; border:1px solid var(--line);
    border-radius:14px; overflow:hidden; background:var(--white);
  }
  @media (max-width:780px){.tab-panel{grid-template-columns:1fr;}}
  .tab-nav{background:var(--panel); border-right:1px solid var(--line); display:flex; flex-direction:column;}
  @media (max-width:780px){.tab-nav{flex-direction:row; overflow-x:auto; border-right:none; border-bottom:1px solid var(--line);}}
  .tab-btn{
    text-align:left; background:none; border:none; cursor:pointer; font-family:var(--display);
    font-weight:600; font-size:0.95rem; color:var(--slate); padding:1.1rem 1.5rem;
    border-left:3px solid transparent; transition:background .2s, color .2s, border-color .2s;
    white-space:nowrap; display:flex; align-items:center; justify-content:space-between; gap:0.6rem;
  }
  .tab-btn .cnt{font-family:var(--mono); font-size:0.7rem; color:#A8A093;}
  .tab-btn:hover{background:rgba(0,0,0,0.03);}
  .tab-btn.active{color:var(--ink); background:var(--white); border-left-color:var(--ochre);}
  .tab-btn.active .cnt{color:var(--ochre);}
  @media (max-width:780px){
    .tab-btn{border-left:none; border-bottom:3px solid transparent;}
    .tab-btn.active{border-bottom-color:var(--ochre);}
  }
  .tab-content{padding:1.8rem clamp(1.2rem,3vw,2rem);}
  .tab-pane{display:none;}
  .tab-pane.active{display:block; animation:fadein .4s ease;}
  @keyframes fadein{from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);}}

  .service-grid{
    display:grid; grid-template-columns:repeat(2,1fr); gap:1.1rem; perspective:1000px;
  }
  @media (max-width:560px){.service-grid{grid-template-columns:1fr;}}
  .service-card{
    background:var(--white); border:1px solid var(--line); border-radius:10px;
    padding:1.4rem; transition:border-color .2s, box-shadow .25s; transform-style:preserve-3d; will-change:transform;
  }
  .service-card:hover{border-color:var(--ochre); box-shadow:0 20px 40px -20px rgba(22,35,59,0.35);}
  .service-icon{
    width:38px; height:38px; border-radius:8px; background:var(--ink);
    display:flex; align-items:center; justify-content:center; margin-bottom:1rem;
    transform:translateZ(20px);
    transition:background .3s ease, transform .35s ease;
  }
  .service-card:hover .service-icon{background:var(--ochre); transform:translateZ(20px) rotate(-8deg) scale(1.08);}
  .service-card h3{margin-bottom:0.4rem; transform:translateZ(12px);}
  .service-card p{font-size:0.9rem;}

  /* Additional services grid (outside tabs) */
  .addl-grid{
    display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; perspective:1000px;
  }
  @media (max-width:900px){.addl-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:560px){.addl-grid{grid-template-columns:1fr;}}

  /* ---------- GALLERY (real work showcase) ---------- */
  .gallery-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem;}
  @media (max-width:820px){.gallery-grid{grid-template-columns:1fr;}}
  .gallery-item{
    position:relative; border-radius:14px; overflow:hidden; aspect-ratio:4/3;
    border:1px solid var(--line); background:var(--panel);
    opacity:0; transform:translateY(26px);
    transition:opacity .6s ease, transform .6s ease, box-shadow .35s ease;
  }
  .gallery-grid.in .gallery-item{opacity:1; transform:translateY(0);}
  .gallery-grid .gallery-item:nth-child(1){transition-delay:.05s;}
  .gallery-grid .gallery-item:nth-child(2){transition-delay:.18s;}
  .gallery-grid .gallery-item:nth-child(3){transition-delay:.31s;}
  .gallery-item:hover{box-shadow:0 26px 50px -24px rgba(22,35,59,0.4);}
  .gallery-item img{
    width:100%; height:100%; object-fit:cover; display:block;
    transition:transform .7s cubic-bezier(.2,.8,.2,1), filter .4s ease;
    filter:saturate(0.94);
  }
  .gallery-item:hover img{transform:scale(1.09); filter:saturate(1.05);}
  .gallery-item figcaption{
    position:absolute; left:0; right:0; bottom:0; padding:1.1rem 1.2rem 1rem;
    background:linear-gradient(0deg, rgba(22,35,59,0.92) 0%, rgba(22,35,59,0.5) 55%, transparent 100%);
    color:#fff; transform:translateY(8px); transition:transform .35s ease;
  }
  .gallery-item .gcat{
    display:block; font-family:var(--mono); font-size:0.68rem; text-transform:uppercase;
    letter-spacing:0.1em; color:#F2B08C; margin-bottom:0.25rem;
  }
  .gallery-item figcaption strong{font-family:var(--display); font-weight:600; font-size:0.95rem; display:block; color:#fff;}
  .gallery-item:hover figcaption{transform:translateY(0);}
  .whyus-grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem;}
  @media (max-width:820px){.whyus-grid3{grid-template-columns:1fr;}}
  .whyus-card3{
    background:var(--white); border:1px solid var(--line); border-radius:12px; padding:1.8rem;
    position:relative; overflow:hidden;
    opacity:0; transform:translateY(28px);
    transition:opacity .6s ease, transform .6s ease, border-color .3s ease, box-shadow .35s ease;
  }
  .whyus-card3.in{opacity:1; transform:translateY(0);}
  .whyus-grid3 .whyus-card3:nth-child(1){transition-delay:.05s;}
  .whyus-grid3 .whyus-card3:nth-child(2){transition-delay:.18s;}
  .whyus-grid3 .whyus-card3:nth-child(3){transition-delay:.31s;}
  .whyus-card3:hover{
    border-color:var(--ochre); box-shadow:0 24px 48px -22px rgba(22,35,59,0.28); transform:translateY(-6px);
  }
  .whyus-card3::before{
    content:""; position:absolute; top:-30px; right:-30px; width:90px; height:90px;
    background:var(--ochre); opacity:0.08; border-radius:50%;
    transition:transform .5s ease, opacity .5s ease;
  }
  .whyus-card3:hover::before{transform:scale(1.35); opacity:0.14;}
  .whyus-card3 .wnum{font-family:var(--mono); font-size:0.78rem; color:var(--ochre); margin-bottom:0.9rem; display:block; position:relative; z-index:1;}
  .whyus-card3 h3{margin-bottom:0.6rem; position:relative; z-index:1;}
  .whyus-card3 p{font-size:0.93rem; position:relative; z-index:1;}

  .whyus-icon{
    width:52px; height:52px; border-radius:12px; background:var(--ink);
    display:flex; align-items:center; justify-content:center; margin-bottom:1.2rem;
    position:relative; z-index:1;
    animation:whyfloat 5s ease-in-out infinite;
    transition:background .3s ease, transform .35s ease;
  }
  .whyus-card3:nth-child(1) .whyus-icon{animation-delay:0s;}
  .whyus-card3:nth-child(2) .whyus-icon{animation-delay:.6s;}
  .whyus-card3:nth-child(3) .whyus-icon{animation-delay:1.2s;}
  @keyframes whyfloat{
    0%,100%{transform:translateY(0) rotate(0deg);}
    50%{transform:translateY(-5px) rotate(-3deg);}
  }
  .whyus-card3:hover .whyus-icon{background:var(--ochre); transform:scale(1.12) rotate(6deg); animation-play-state:paused;}

  .whyus-illus{
    position:absolute; right:-6px; bottom:-6px; width:118px; height:88px; opacity:0.9;
    transition:transform .5s ease, opacity .4s ease;
    pointer-events:none;
  }
  .whyus-card3:hover .whyus-illus{transform:translateY(-4px) scale(1.04); opacity:1;}
  .whyus-illus .draw{
    stroke-dasharray:220; stroke-dashoffset:220;
    animation:drawline 1.8s ease forwards;
    animation-play-state:paused;
  }
  .whyus-card3.in .whyus-illus .draw{animation-play-state:running;}
  .whyus-grid3 .whyus-card3:nth-child(1).in .whyus-illus .draw{animation-delay:.4s;}
  .whyus-grid3 .whyus-card3:nth-child(2).in .whyus-illus .draw{animation-delay:.55s;}
  .whyus-grid3 .whyus-card3:nth-child(3).in .whyus-illus .draw{animation-delay:.7s;}
  @keyframes drawline{to{stroke-dashoffset:0;}}
  .whyus-illus .dot-pulse{animation:dotpulse 2.4s ease-in-out infinite;}
  @keyframes dotpulse{0%,100%{opacity:0.35; r:3;} 50%{opacity:1; r:4;}}

  /* ---------- INDUSTRIES ---------- */
  .industries{background:var(--panel);}
  .industry-grid{
    display:grid; grid-template-columns:repeat(4,1fr); gap:0.8rem;
  }
  @media (max-width:900px){.industry-grid{grid-template-columns:repeat(3,1fr);}}
  @media (max-width:600px){.industry-grid{grid-template-columns:repeat(2,1fr);}}
  .industry-chip{
    background:var(--white); border:1px solid var(--line); border-radius:8px;
    padding:0.9rem 1rem; font-size:0.88rem; font-weight:500; color:var(--ink);
    transition:transform .2s, border-color .2s, box-shadow .2s;
    opacity:0; transform:translateY(14px);
    animation:chipin .5s ease forwards;
    animation-play-state:paused;
  }
  .industry-grid.in .industry-chip{animation-play-state:running;}
  .industry-grid .industry-chip:nth-child(1){animation-delay:.02s;}
  .industry-grid .industry-chip:nth-child(2){animation-delay:.08s;}
  .industry-grid .industry-chip:nth-child(3){animation-delay:.14s;}
  .industry-grid .industry-chip:nth-child(4){animation-delay:.2s;}
  .industry-grid .industry-chip:nth-child(5){animation-delay:.26s;}
  .industry-grid .industry-chip:nth-child(6){animation-delay:.32s;}
  .industry-grid .industry-chip:nth-child(7){animation-delay:.38s;}
  .industry-grid .industry-chip:nth-child(8){animation-delay:.44s;}
  @keyframes chipin{to{opacity:1; transform:translateY(0);}}
  .industry-chip:hover{transform:translateY(-4px) scale(1.03); border-color:var(--ochre); box-shadow:0 14px 26px -16px rgba(22,35,59,0.3);}

  /* ---------- FAQ ---------- */
  .faq-list{max-width:800px; margin:0 auto; border-top:1px solid var(--line);}
  details{border-bottom:1px solid var(--line); padding:1.1rem 0;}
  summary{
    cursor:pointer; font-family:var(--display); font-weight:600; color:var(--ink);
    list-style:none; display:flex; justify-content:space-between; align-items:center; gap:1rem;
    font-size:1.02rem;
  }
  summary::-webkit-details-marker{display:none;}
  summary::after{content:"+"; font-size:1.4rem; color:var(--ochre); flex-shrink:0; font-family:var(--body); font-weight:400;}
  details[open] summary::after{content:"–";}
  details p{margin-top:0.8rem; font-size:0.95rem; max-width:64ch;}

  /* ---------- FINAL CTA ---------- */
  .final-cta{
    background:var(--ink); color:#fff; border-radius:16px; padding:clamp(2.5rem,6vw,4rem);
    text-align:center; max-width:1180px; margin:0 auto; position:relative; overflow:hidden;
  }
  .final-cta::before{
    content:"";
    position:absolute; inset:0;
    background-image:
      linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size:40px 40px;
    mask-image:radial-gradient(ellipse 70% 70% at 50% 0%, black 30%, transparent 85%);
    pointer-events:none;
  }
  .final-cta > *{position:relative; z-index:1;}
  .final-cta h2{color:#fff; margin-bottom:0.8rem;}
  .final-cta p{color:#C6CEDD; max-width:50ch; margin:0 auto 2rem;}
  .final-cta .hero-ctas{justify-content:center;}

  /* ---------- FOOTER ---------- */
  footer{
    background:var(--ink); color:#C6CEDD; position:relative; overflow:hidden;
    padding:clamp(3rem,6vw,4.5rem) 0 0;
  }
  footer::before{
    content:"";
    position:absolute; inset:0;
    background-image:
      linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
    background-size:44px 44px;
    mask-image:radial-gradient(ellipse 70% 60% at 85% 0%, black 30%, transparent 80%);
    pointer-events:none;
  }
  .footer-top{
    position:relative; z-index:1;
    display:grid; grid-template-columns:1.4fr 0.8fr 0.8fr 1fr; gap:2.5rem;
    padding-bottom:2.8rem; border-bottom:1px solid rgba(255,255,255,0.1);
  }
  @media (max-width:900px){.footer-top{grid-template-columns:1fr 1fr; row-gap:2.2rem;}}
  @media (max-width:560px){.footer-top{grid-template-columns:1fr;}}

  .footer-brand .logo{color:#fff; margin-bottom:0.9rem;}
  .footer-brand p{font-size:0.9rem; color:#9AA6BC; max-width:32ch; margin-bottom:1.3rem;}
  .footer-social{display:flex; gap:0.7rem;}
  .footer-social a{
    width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,0.18);
    display:flex; align-items:center; justify-content:center; transition:border-color .2s, background .2s;
  }
  .footer-social a:hover{border-color:var(--ochre); background:rgba(187,91,42,0.15);}

  .footer-col h4{
    font-family:var(--mono); font-size:0.72rem; text-transform:uppercase; letter-spacing:0.1em;
    color:#7C87A0; margin-bottom:1.1rem; font-weight:500;
  }
  .footer-col ul{display:flex; flex-direction:column; gap:0.65rem;}
  .footer-col a{font-size:0.9rem; color:#C6CEDD; text-decoration:none; transition:color .2s;}
  .footer-col a:hover{color:var(--ochre);}

  .footer-contact li{
    display:flex; gap:0.6rem; align-items:flex-start; font-size:0.9rem; color:#C6CEDD;
  }
  .footer-contact svg{flex-shrink:0; margin-top:0.15rem; color:var(--ochre);}
  .footer-mini-cta{
    margin-top:1.3rem; display:inline-flex; align-items:center; gap:0.5rem;
    background:var(--ochre); color:#fff; padding:0.65rem 1.1rem; border-radius:6px;
    font-size:0.85rem; font-weight:600; text-decoration:none; transition:background .2s;
  }
  .footer-mini-cta:hover{background:var(--ochre-dark);}

  .footer-bottom{
    position:relative; z-index:1;
    display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem;
    padding:1.5rem 0 1.8rem; font-size:0.8rem; color:#7C87A0;
  }
  .footer-bottom-links{display:flex; gap:1.4rem; flex-wrap:wrap;}
  .footer-bottom-links a{color:#7C87A0; text-decoration:none;}
  .footer-bottom-links a:hover{color:#fff;}
  .back-to-top{
    width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,0.18);
    display:flex; align-items:center; justify-content:center; text-decoration:none; color:#fff;
    transition:border-color .2s, background .2s, transform .2s;
  }
  .back-to-top:hover{border-color:var(--ochre); background:rgba(187,91,42,0.15); transform:translateY(-2px);}

  /* ---------- STICKY MOBILE CTA ---------- */
  .sticky-cta{
    display:none; position:fixed; left:0; right:0; bottom:0; z-index:200;
    background:var(--white); border-top:1px solid var(--line);
    padding:0.7rem 1rem; box-shadow:0 -8px 20px rgba(0,0,0,0.08);
  }
  @media (max-width:820px){.sticky-cta{display:block;}}

  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{transition:none !important; animation:none !important;}
    .reveal{opacity:1; transform:none;}
    .service-card{transform:none !important;}
  }

.why-strip{background:var(--panel);}
  .why-grid{display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center;}
  @media (max-width:860px){.why-grid{grid-template-columns:1fr;}}
  .why-check{display:flex; flex-direction:column; gap:0; border-top:1px solid var(--line); margin-top:1.4rem;}
  .why-check li{display:flex; align-items:center; gap:0.9rem; padding:0.85rem 0; border-bottom:1px solid var(--line); font-family:var(--mono); font-size:0.88rem; color:var(--ink);}
  .why-check li svg{flex-shrink:0; color:var(--ochre);}
  .why-callout{background:var(--ink); color:#fff; border-radius:14px; padding:2.2rem; position:relative; overflow:hidden;}
  .why-callout::before{content:""; position:absolute; top:-40px; right:-40px; width:140px; height:140px; background:var(--sage); opacity:0.15; border-radius:50%;}
  .why-callout p{position:relative; z-index:1; font-family:var(--display); font-size:1.15rem; font-weight:600; line-height:1.45; color:#fff;}
  .why-callout p span{color:var(--ochre);}
  .why-callout .wc-list{margin-top:1.3rem; display:flex; flex-wrap:wrap; gap:0.5rem; position:relative; z-index:1;}
  .why-callout .wc-list span{font-family:var(--mono); font-size:0.72rem; color:#C6CEDD; border:1px solid rgba(255,255,255,0.2); border-radius:20px; padding:0.35rem 0.75rem;}

  /* ---------- INDUSTRY TAG GRID ---------- */
  .industries{background:var(--white);}
  .industry-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:0.8rem;}
  @media (max-width:900px){.industry-grid{grid-template-columns:repeat(3,1fr);}}
  @media (max-width:600px){.industry-grid{grid-template-columns:repeat(2,1fr);}}
  .industry-chip{
    background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:0.9rem 1rem;
    font-size:0.86rem; font-weight:500; color:var(--ink); text-align:center;
    transition:transform .2s, border-color .2s, box-shadow .2s, background .2s;
    opacity:0; transform:translateY(14px); animation:chipin .5s ease forwards; animation-play-state:paused;
  }
  .industry-grid.in .industry-chip{animation-play-state:running;}
  .industry-grid .industry-chip:nth-child(1){animation-delay:.02s;} .industry-grid .industry-chip:nth-child(2){animation-delay:.07s;}
  .industry-grid .industry-chip:nth-child(3){animation-delay:.12s;} .industry-grid .industry-chip:nth-child(4){animation-delay:.17s;}
  .industry-grid .industry-chip:nth-child(5){animation-delay:.22s;} .industry-grid .industry-chip:nth-child(6){animation-delay:.27s;}
  .industry-grid .industry-chip:nth-child(7){animation-delay:.32s;} .industry-grid .industry-chip:nth-child(8){animation-delay:.37s;}
  .industry-grid .industry-chip:nth-child(9){animation-delay:.42s;} .industry-grid .industry-chip:nth-child(10){animation-delay:.47s;}
  @keyframes chipin{to{opacity:1; transform:translateY(0);}}
  .industry-chip:hover{transform:translateY(-4px) scale(1.03); border-color:var(--ochre); background:var(--white); box-shadow:0 14px 26px -16px rgba(22,35,59,0.3);}

  /* ---------- FINAL CTA ---------- */
  .final-cta{background:var(--ink); color:#fff; border-radius:16px; padding:clamp(2.5rem,6vw,4rem); text-align:center; max-width:1180px; margin:0 auto; position:relative; overflow:hidden;}
  .final-cta::before{content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px); background-size:40px 40px; mask-image:radial-gradient(ellipse 70% 70% at 50% 0%, black 30%, transparent 85%); pointer-events:none;}
  .final-cta > *{position:relative; z-index:1;}
  .final-cta h2{color:#fff; margin-bottom:0.6rem;}
  .final-cta .fc-sub{font-family:var(--display); font-weight:600; color:var(--ochre); font-size:1.05rem; margin-bottom:0.9rem;}
  .final-cta p.desc{color:#C6CEDD; max-width:52ch; margin:0 auto 2rem;}
  .final-cta .hero-ctas{justify-content:center;}

  /* ---------- FOOTER ---------- */
  footer{background:var(--ink); color:#C6CEDD; position:relative; overflow:hidden; padding:clamp(3rem,6vw,4.5rem) 0 0;}
  footer::before{content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px); background-size:44px 44px; mask-image:radial-gradient(ellipse 70% 60% at 85% 0%, black 30%, transparent 80%); pointer-events:none;}
  .footer-top{position:relative; z-index:1; display:grid; grid-template-columns:1.4fr 0.8fr 0.8fr 1fr; gap:2.5rem; padding-bottom:2.8rem; border-bottom:1px solid rgba(255,255,255,0.1);}
  @media (max-width:900px){.footer-top{grid-template-columns:1fr 1fr; row-gap:2.2rem;}}
  @media (max-width:560px){.footer-top{grid-template-columns:1fr;}}
  .footer-brand .logo{color:#fff; margin-bottom:0.9rem;}
  .footer-brand p{font-size:0.9rem; color:#9AA6BC; max-width:32ch; margin-bottom:1.3rem;}
  .footer-social{display:flex; gap:0.7rem;}
  .footer-social a{width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,0.18); display:flex; align-items:center; justify-content:center; transition:border-color .2s, background .2s;}
  .footer-social a:hover{border-color:var(--ochre); background:rgba(187,91,42,0.15);}
  .footer-col h4{font-family:var(--mono); font-size:0.72rem; text-transform:uppercase; letter-spacing:0.1em; color:#7C87A0; margin-bottom:1.1rem; font-weight:500;}
  .footer-col ul{display:flex; flex-direction:column; gap:0.65rem;}
  .footer-col a{font-size:0.9rem; color:#C6CEDD; text-decoration:none; transition:color .2s;}
  .footer-col a:hover{color:var(--ochre);}
  .footer-contact li{display:flex; gap:0.6rem; align-items:flex-start; font-size:0.9rem; color:#C6CEDD;}
  .footer-contact svg{flex-shrink:0; margin-top:0.15rem; color:var(--ochre);}
  .footer-mini-cta{margin-top:1.3rem; display:inline-flex; align-items:center; gap:0.5rem; background:var(--ochre); color:#fff; padding:0.65rem 1.1rem; border-radius:6px; font-size:0.85rem; font-weight:600; text-decoration:none; transition:background .2s;}
  .footer-mini-cta:hover{background:var(--ochre-dark);}
  .footer-bottom{position:relative; z-index:1; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; padding:1.5rem 0 1.8rem; font-size:0.8rem; color:#7C87A0;}
  .footer-bottom-links{display:flex; gap:1.4rem; flex-wrap:wrap;}
  .footer-bottom-links a{color:#7C87A0; text-decoration:none;}
  .footer-bottom-links a:hover{color:#fff;}
  .back-to-top{width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,0.18); display:flex; align-items:center; justify-content:center; text-decoration:none; color:#fff; transition:border-color .2s, background .2s, transform .2s;}
  .back-to-top:hover{border-color:var(--ochre); background:rgba(187,91,42,0.15); transform:translateY(-2px);}

  /* ---------- STICKY MOBILE CTA ---------- */
  .sticky-cta{display:none; position:fixed; left:0; right:0; bottom:0; z-index:200; background:var(--white); border-top:1px solid var(--line); padding:0.7rem 1rem; box-shadow:0 -8px 20px rgba(0,0,0,0.08);}
  @media (max-width:820px){.sticky-cta{display:block;}}
  .btn-block{width:100%;}

  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{transition:none !important; animation:none !important;}
    .reveal{opacity:1; transform:none;}
    .marquee-track{animation:none;}
  }




    /* HERO + RANK GAUGE */
  .hero{background:var(--ink); color:#fff; position:relative; overflow:hidden; padding:clamp(2.4rem,6vw,3.6rem) 0 clamp(3.2rem,7vw,4.6rem);}
  .hero::before{content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.05) 1px,transparent 1px); background-size:44px 44px; mask-image:radial-gradient(ellipse 80% 60% at 25% 15%, black 40%, transparent 90%); pointer-events:none;}
  .hero-grid{position:relative; z-index:1; display:grid; grid-template-columns:1.05fr 0.95fr; gap:clamp(2.4rem,5vw,4rem); align-items:center;}
  @media (max-width:900px){.hero-grid{grid-template-columns:1fr;}}
  .hero h1{color:#fff; font-size:clamp(1.85rem,1.2rem+2.8vw,3rem); font-weight:700; margin-bottom:1.1rem;}
  .hero h1 .accent{color:var(--ochre); background:linear-gradient(transparent 62%, rgba(187,91,42,0.35) 62%);}
  .hero p.lede{font-size:clamp(0.98rem,0.94rem+0.3vw,1.08rem); color:#C6CEDD; max-width:54ch; margin-bottom:1rem;}
  .hero p.lede2{font-size:0.95rem; color:#9AA6BC; max-width:54ch; margin-bottom:1.8rem;}

  .rank-card{background:var(--white); border-radius:16px; padding:1.8rem; box-shadow:0 30px 60px -20px rgba(0,0,0,0.45); color:var(--ink);}
  .rank-card-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:1.4rem;}
  .rank-card-head .t{font-family:var(--mono); font-size:0.7rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--sage-dark);}
  .rank-badge{font-family:var(--mono); font-size:0.7rem; background:rgba(95,138,114,0.14); color:var(--sage-dark); padding:0.3rem 0.65rem; border-radius:20px; display:inline-flex; align-items:center; gap:0.4rem;}
  .rank-badge::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--sage); display:inline-block; animation:blink 1.6s ease-in-out infinite;}
  @keyframes blink{0%,100%{opacity:1;} 50%{opacity:0.3;}}
  .rank-numbers{display:flex; align-items:flex-end; gap:1rem; margin-bottom:1.3rem;}
  .rank-num{font-family:var(--display); font-weight:700; font-size:2.6rem; line-height:1;}
  .rank-from{color:#B7B0A2; text-decoration:line-through; font-size:1.4rem;}
  .rank-to{color:var(--ochre);}
  .rank-arrow{color:var(--sage); margin:0 0.2rem;}
  .rank-sub{font-size:0.85rem; color:var(--slate); margin-bottom:1.4rem;}
  .rank-chart{width:100%; height:80px; margin-bottom:1.2rem;}
  .rank-chart .draw{stroke-dasharray:260; stroke-dashoffset:260; animation:drawchart 1.8s ease .3s forwards;}
  @keyframes drawchart{to{stroke-dashoffset:0;}}
  .rank-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:0.8rem; border-top:1px solid var(--line); padding-top:1.1rem;}
  .rank-stats div{text-align:center;}
  .rank-stats .v{font-family:var(--display); font-weight:700; color:var(--ink); font-size:1.05rem;}
  .rank-stats .l{font-family:var(--mono); font-size:0.65rem; text-transform:uppercase; letter-spacing:0.05em; color:#9AA6BC;}

  /* GROWTH PLAN */
  .growth{background:var(--panel);}
  .growth-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem;}
  @media (max-width:900px){.growth-grid{grid-template-columns:1fr 1fr;}}
  @media (max-width:560px){.growth-grid{grid-template-columns:1fr;}}
  .growth-card{background:var(--white); border:1px solid var(--line); border-radius:12px; padding:1.5rem; position:relative; overflow:hidden;
    opacity:0; transform:translateY(24px); transition:opacity .55s ease, transform .55s ease, border-color .25s, box-shadow .3s;}
  .growth-grid.in .growth-card{opacity:1; transform:translateY(0);}
  .growth-grid .growth-card:nth-child(1){transition-delay:.04s;} .growth-grid .growth-card:nth-child(2){transition-delay:.14s;}
  .growth-grid .growth-card:nth-child(3){transition-delay:.24s;} .growth-grid .growth-card:nth-child(4){transition-delay:.34s;}
  .growth-card:hover{border-color:var(--ochre); box-shadow:0 20px 40px -22px rgba(22,35,59,0.3); transform:translateY(-5px);}
  .growth-icon{width:42px; height:42px; border-radius:10px; background:var(--ink); display:flex; align-items:center; justify-content:center; margin-bottom:1rem; transition:background .3s, transform .3s;}
  .growth-card:hover .growth-icon{background:var(--ochre); transform:rotate(-6deg) scale(1.08);}
  .growth-card h3{font-size:1rem; margin-bottom:0.5rem;}
  .growth-card p{font-size:0.88rem;}
  .growth-cta{margin-top:2.4rem; text-align:center;}

  /* SERVICE GRID (shared pattern) */
  .service-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; perspective:1000px;}
  @media (max-width:900px){.service-grid{grid-template-columns:1fr 1fr;}}
  @media (max-width:560px){.service-grid{grid-template-columns:1fr;}}
  .service-card{background:var(--white); border:1px solid var(--line); border-radius:10px; padding:1.4rem; transition:border-color .2s, box-shadow .25s; transform-style:preserve-3d; will-change:transform;}
  .service-card:hover{border-color:var(--ochre); box-shadow:0 20px 40px -20px rgba(22,35,59,0.35);}
  .service-icon{width:38px; height:38px; border-radius:8px; background:var(--ink); display:flex; align-items:center; justify-content:center; margin-bottom:1rem; transform:translateZ(20px); transition:background .3s, transform .35s;}
  .service-card:hover .service-icon{background:var(--ochre); transform:translateZ(20px) rotate(-8deg) scale(1.08);}
  .service-card h3{margin-bottom:0.4rem; transform:translateZ(12px);}
  .service-card p{font-size:0.89rem;}
  .explore-link{display:inline-flex; align-items:center; gap:0.4rem; margin-top:2rem; font-weight:600; color:var(--ochre-dark); text-decoration:none; font-size:0.95rem;}
  .explore-link svg{transition:transform .2s;}
  .explore-link:hover svg{transform:translateX(4px);}

  /* GALLERY / PROOF SHOWCASE */
  .gallery-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem;}
  @media (max-width:820px){.gallery-grid{grid-template-columns:1fr;}}
  .gallery-item{
    position:relative; border-radius:14px; overflow:hidden; aspect-ratio:4/3;
    border:1px solid var(--line); background:var(--panel);
    opacity:0; transform:translateY(26px);
    transition:opacity .6s ease, transform .6s ease, box-shadow .35s ease;
  }
  .gallery-grid.in .gallery-item{opacity:1; transform:translateY(0);}
  .gallery-grid .gallery-item:nth-child(1){transition-delay:.05s;}
  .gallery-grid .gallery-item:nth-child(2){transition-delay:.18s;}
  .gallery-grid .gallery-item:nth-child(3){transition-delay:.31s;}
  .gallery-item:hover{box-shadow:0 26px 50px -24px rgba(22,35,59,0.4);}
  .gallery-item img{
    width:100%; height:100%; object-fit:cover; display:block;
    transition:transform .7s cubic-bezier(.2,.8,.2,1), filter .4s ease;
    filter:saturate(0.94);
  }
  .gallery-item:hover img{transform:scale(1.09); filter:saturate(1.05);}
  .gallery-item figcaption{
    position:absolute; left:0; right:0; bottom:0; padding:1.1rem 1.2rem 1rem;
    background:linear-gradient(0deg, rgba(22,35,59,0.92) 0%, rgba(22,35,59,0.5) 55%, transparent 100%);
    color:#fff; transform:translateY(8px); transition:transform .35s ease;
  }
  .gallery-item .gcat{display:block; font-family:var(--mono); font-size:0.68rem; text-transform:uppercase; letter-spacing:0.1em; color:#F2B08C; margin-bottom:0.25rem;}
  .gallery-item figcaption strong{font-family:var(--display); font-weight:600; font-size:0.92rem; display:block; color:#fff;}
  .gallery-item:hover figcaption{transform:translateY(0);}

  /* WHY US split */
  .why-strip{background:var(--white);}
  .why-grid{display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center;}
  @media (max-width:860px){.why-grid{grid-template-columns:1fr;}}
  .why-check{display:flex; flex-direction:column; border-top:1px solid var(--line); margin-top:1.4rem;}
  .why-check li{display:flex; gap:0.9rem; padding:0.95rem 0; border-bottom:1px solid var(--line);}
  .why-check li svg{flex-shrink:0; color:var(--sage); margin-top:0.15rem;}
  .why-check li div b{display:block; font-family:var(--display); font-size:0.95rem; color:var(--ink); margin-bottom:0.15rem;}
  .why-check li div span{font-size:0.87rem; color:var(--slate);}
  .why-callout{
    background:linear-gradient(160deg, rgba(22,35,59,0.94) 10%, rgba(22,35,59,0.75) 55%, rgba(22,35,59,0.92) 100%),
      url('https://images.unsplash.com/photo-1556742049-0cfed4f6a45d?auto=format&fit=crop&w=900&q=80') center/cover no-repeat;
    color:#fff; border-radius:14px; padding:2.2rem; min-height:340px; display:flex; flex-direction:column; justify-content:flex-end;
    position:relative; overflow:hidden;
  }
  .why-callout::before{content:""; position:absolute; top:-40px; right:-40px; width:150px; height:150px; background:var(--sage); opacity:0.15; border-radius:50%;}
  .why-callout p.q{position:relative; z-index:1; font-family:var(--display); font-size:1.1rem; font-weight:600; line-height:1.45;}
  .why-callout p.q span{color:var(--ochre);}
  .why-callout .cta-row{position:relative; z-index:1; margin-top:1.6rem;}

  /* PROCESS RAIL */
  .process-rail{display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; position:relative;}
  @media (max-width:900px){.process-rail{grid-template-columns:1fr 1fr;}}
  @media (max-width:560px){.process-rail{grid-template-columns:1fr;}}
  .process-rail::before{content:""; position:absolute; top:26px; left:12.5%; right:12.5%; height:2px; background:repeating-linear-gradient(90deg, var(--line) 0 8px, transparent 8px 16px); z-index:0;}
  @media (max-width:900px){.process-rail::before{display:none;}}
  .proc-step{position:relative; z-index:1;}
  .proc-num{width:52px; height:52px; border-radius:50%; background:var(--white); border:2px solid var(--ochre); display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:700; color:var(--ochre); margin-bottom:1.1rem; transition:background .3s, color .3s;}
  .proc-step:hover .proc-num{background:var(--ochre); color:#fff;}
  .proc-step h3{margin-bottom:0.5rem; font-size:1.02rem;}
  .proc-step p{font-size:0.88rem;}
  .process-cta{text-align:center; margin-top:2.4rem;}

  /* PLATFORM GRID */
  .platform-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1rem;}
  @media (max-width:820px){.platform-grid{grid-template-columns:1fr 1fr;}}
  @media (max-width:480px){.platform-grid{grid-template-columns:1fr;}}
  .platform-card{background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:1.3rem; display:flex; gap:0.9rem; align-items:flex-start; transition:transform .2s, border-color .2s, background .2s;}
  .platform-card:hover{transform:translateY(-4px); border-color:var(--ochre); background:var(--white);}
  .platform-icon{width:38px; height:38px; border-radius:8px; background:var(--white); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
  .platform-card h3{font-size:0.95rem; margin-bottom:0.25rem;}
  .platform-card p{font-size:0.83rem;}
  .platform-cta{text-align:center; margin-top:2.2rem;}

  /* PROBLEM BANNER */
  .problem-band{background:var(--ink); color:#fff; border-radius:16px; padding:clamp(2rem,5vw,3rem); text-align:center; position:relative; overflow:hidden;}
  .problem-band::before{content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.05) 1px,transparent 1px); background-size:40px 40px; mask-image:radial-gradient(ellipse 70% 90% at 50% 0%, black 30%, transparent 85%);}
  .problem-band > *{position:relative; z-index:1;}
  .problem-band h2{color:#fff; margin-bottom:0.8rem;}
  .problem-band p{color:#C6CEDD; max-width:60ch; margin:0 auto 1.6rem;}

  /* MYTH / FACT */
  .myth-list{display:flex; flex-direction:column; gap:0.9rem;}
  .myth-item{background:var(--white); border:1px solid var(--line); border-radius:10px; padding:1.2rem 1.4rem; display:grid; grid-template-columns:auto 1fr; gap:0.9rem; align-items:start; transition:border-color .2s, box-shadow .2s;}
  .myth-item:hover{border-color:var(--ochre); box-shadow:0 16px 30px -20px rgba(22,35,59,0.3);}
  .myth-mark{width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-family:var(--display); font-weight:700; font-size:0.85rem;}
  .myth-item .myth-line{font-size:0.87rem; color:#B37A5A; text-decoration:line-through; margin-bottom:0.35rem;}
  .myth-item .fact-line{font-size:0.93rem; color:var(--ink); font-weight:500;}
  .myth-item .fact-line b{color:var(--sage-dark);}

  /* FAQ (shared pattern) */
  .faq-list{max-width:800px; margin:0 auto; border-top:1px solid var(--line);}
  details{border-bottom:1px solid var(--line); padding:1.1rem 0;}
  summary{cursor:pointer; font-family:var(--display); font-weight:600; color:var(--ink); list-style:none; display:flex; justify-content:space-between; align-items:center; gap:1rem; font-size:1rem;}
  summary::-webkit-details-marker{display:none;}
  summary::after{content:"+"; font-size:1.4rem; color:var(--ochre); flex-shrink:0; font-family:var(--body); font-weight:400;}
  details[open] summary::after{content:"–";}
  details p{margin-top:0.8rem; font-size:0.94rem; max-width:64ch;}

  /* FINAL CTA */
  .final-cta{
    background:linear-gradient(160deg, rgba(22,35,59,0.93) 0%, rgba(22,35,59,0.88) 60%, rgba(22,35,59,0.96) 100%),
      url('https://images.unsplash.com/photo-1441986300917-64674bd600d8?auto=format&fit=crop&w=1400&q=80') center 35%/cover no-repeat;
    color:#fff; border-radius:16px; padding:clamp(2.4rem,6vw,4rem); text-align:center; max-width:1180px; margin:0 auto; position:relative; overflow:hidden;
  }
  .final-cta::before{content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.05) 1px,transparent 1px); background-size:40px 40px; mask-image:radial-gradient(ellipse 70% 70% at 50% 0%, black 30%, transparent 85%);}
  .final-cta > *{position:relative; z-index:1;}
  .final-cta h2{color:#fff; margin-bottom:0.8rem;}
  .final-cta p{color:#C6CEDD; max-width:56ch; margin:0 auto 2rem;}
  .final-cta .cta-row{justify-content:center;}

  /* FOOTER */
  footer{background:var(--ink); color:#C6CEDD; position:relative; overflow:hidden; padding:clamp(3rem,6vw,4.5rem) 0 0;}
  footer::before{content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.04) 1px,transparent 1px); background-size:44px 44px; mask-image:radial-gradient(ellipse 70% 60% at 85% 0%, black 30%, transparent 80%);}
  .footer-top{position:relative; z-index:1; display:grid; grid-template-columns:1.4fr 0.8fr 0.8fr 1fr; gap:2.5rem; padding-bottom:2.8rem; border-bottom:1px solid rgba(255,255,255,0.1);}
  @media (max-width:900px){.footer-top{grid-template-columns:1fr 1fr; row-gap:2.2rem;}}
  @media (max-width:560px){.footer-top{grid-template-columns:1fr;}}
  .footer-brand .logo{color:#fff; margin-bottom:0.9rem;}
  .footer-brand p{font-size:0.9rem; color:#9AA6BC; max-width:32ch; margin-bottom:1.3rem;}
  .footer-social{display:flex; gap:0.7rem;}
  .footer-social a{width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,0.18); display:flex; align-items:center; justify-content:center; transition:border-color .2s, background .2s;}
  .footer-social a:hover{border-color:var(--ochre); background:rgba(187,91,42,0.15);}
  .footer-col h4{font-family:var(--mono); font-size:0.72rem; text-transform:uppercase; letter-spacing:0.1em; color:#7C87A0; margin-bottom:1.1rem; font-weight:500;}
  .footer-col ul{display:flex; flex-direction:column; gap:0.65rem;}
  .footer-col a{font-size:0.9rem; color:#C6CEDD; text-decoration:none; transition:color .2s;}
  .footer-col a:hover{color:var(--ochre);}
  .footer-contact li{display:flex; gap:0.6rem; align-items:flex-start; font-size:0.9rem; color:#C6CEDD;}
  .footer-contact svg{flex-shrink:0; margin-top:0.15rem; color:var(--ochre);}
  .footer-mini-cta{margin-top:1.3rem; display:inline-flex; align-items:center; gap:0.5rem; background:var(--ochre); color:#fff; padding:0.65rem 1.1rem; border-radius:6px; font-size:0.85rem; font-weight:600; text-decoration:none; transition:background .2s;}
  .footer-mini-cta:hover{background:var(--ochre-dark);}
  .footer-bottom{position:relative; z-index:1; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; padding:1.5rem 0 1.8rem; font-size:0.8rem; color:#7C87A0;}
  .footer-bottom-links{display:flex; gap:1.4rem; flex-wrap:wrap;}
  .footer-bottom-links a{color:#7C87A0; text-decoration:none;} .footer-bottom-links a:hover{color:#fff;}
  .back-to-top{width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,0.18); display:flex; align-items:center; justify-content:center; text-decoration:none; color:#fff; transition:border-color .2s, background .2s, transform .2s;}
  .back-to-top:hover{border-color:var(--ochre); background:rgba(187,91,42,0.15); transform:translateY(-2px);}

  .sticky-cta{display:none; position:fixed; left:0; right:0; bottom:0; z-index:200; background:var(--white); border-top:1px solid var(--line); padding:0.6rem 1rem; box-shadow:0 -8px 20px rgba(0,0,0,0.08); gap:0.6rem;}
  .sticky-cta .row{display:flex; gap:0.6rem;}
  @media (max-width:820px){.sticky-cta{display:block;}}

  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;} *{transition:none !important; animation:none !important;}
    .reveal,.growth-card{opacity:1; transform:none;}
  }

  /* HERO + DEVICE MOCK */
  .hero{background:var(--ink); color:#fff; position:relative; overflow:hidden; padding:clamp(2.6rem,6vw,3.8rem) 0 clamp(3.4rem,7vw,4.8rem);}
  .hero::before{content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.05) 1px,transparent 1px); background-size:44px 44px; mask-image:radial-gradient(ellipse 80% 60% at 25% 15%, black 40%, transparent 90%); pointer-events:none;}
  .hero-grid{position:relative; z-index:1; display:grid; grid-template-columns:1.05fr 0.95fr; gap:clamp(2.6rem,5vw,4.5rem); align-items:center;}
  @media (max-width:940px){.hero-grid{grid-template-columns:1fr;}}
  .hero h1{color:#fff; font-size:clamp(1.85rem,1.2rem+2.8vw,2.9rem); font-weight:700; margin-bottom:1.1rem;}
  .hero h1 .accent{color:var(--ochre); background:linear-gradient(transparent 62%, rgba(187,91,42,0.35) 62%);}
  .hero p.lede{font-size:clamp(0.98rem,0.94rem+0.3vw,1.08rem); color:#C6CEDD; max-width:56ch; margin-bottom:1.8rem;}
  .trust-row{display:flex; gap:1.6rem; flex-wrap:wrap; margin-top:2.1rem; font-family:var(--mono); font-size:0.76rem; color:#9AA6BC;}
  .trust-row span{display:flex; align-items:center; gap:0.5rem;}
  .trust-row span::before{content:"✓"; color:var(--sage);}

  .device-stage{position:relative; perspective:1400px; padding:1.5rem 1.2rem 0.5rem;}
  .device-mock{
    background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 40px 70px -25px rgba(0,0,0,0.55);
    transform:perspective(1400px) rotateY(-8deg) rotateX(4deg); transform-style:preserve-3d;
    transition:transform .4s cubic-bezier(.2,.8,.2,1);
  }
  .device-stage:hover .device-mock{transform:perspective(1400px) rotateY(-3deg) rotateX(1.5deg) scale(1.01);}
  .device-bar{background:#EDEAE1; padding:0.6rem 0.9rem; display:flex; align-items:center; gap:0.5rem; border-bottom:1px solid var(--line);}
  .device-bar span{width:9px; height:9px; border-radius:50%; background:#D8D2C3;}
  .device-bar span:nth-child(1){background:#E0A08A;} .device-bar span:nth-child(2){background:#E8CC9A;} .device-bar span:nth-child(3){background:#A9C6AE;}
  .device-url{margin-left:0.6rem; background:#fff; border-radius:5px; padding:0.25rem 0.7rem; font-family:var(--mono); font-size:0.68rem; color:#8A93A3; flex:1;}
  .device-screen{padding:1.1rem 1.1rem 1.4rem; background:var(--paper);}
  .ds-nav{display:flex; justify-content:space-between; align-items:center; margin-bottom:1rem;}
  .ds-logo{width:60px; height:9px; background:var(--ink); border-radius:3px;}
  .ds-menu{display:flex; gap:0.4rem;}
  .ds-menu span{width:24px; height:6px; background:var(--line); border-radius:3px;}
  .ds-hero{background:var(--ink); border-radius:8px; padding:1.2rem; margin-bottom:0.9rem;}
  .ds-hero .line{height:8px; background:rgba(255,255,255,0.85); border-radius:3px; margin-bottom:0.5rem;}
  .ds-hero .line.w1{width:70%;} .ds-hero .line.w2{width:50%; background:rgba(255,255,255,0.4); margin-bottom:0.85rem;}
  .ds-hero .btn-mini{display:inline-block; background:var(--ochre); width:64px; height:16px; border-radius:4px;}
  .ds-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:0.5rem;}
  .ds-card{background:#fff; border:1px solid var(--line); border-radius:6px; height:44px; padding:0.4rem;}
  .ds-card .dot{width:12px; height:12px; border-radius:3px; background:var(--sage); margin-bottom:0.3rem;}
  .ds-card .l{height:4px; width:70%; background:var(--line); border-radius:2px;}

  .float-badge{
    position:absolute; background:#fff; border-radius:10px; padding:0.6rem 0.9rem; display:flex; align-items:center; gap:0.55rem;
    box-shadow:0 16px 30px -14px rgba(0,0,0,0.35); font-family:var(--display); font-weight:700; font-size:0.85rem; color:var(--ink);
    animation:badgefloat 5s ease-in-out infinite;
  }
  .float-badge small{display:block; font-family:var(--mono); font-weight:500; font-size:0.62rem; color:#9AA6BC; text-transform:uppercase; letter-spacing:.04em;}
  .float-badge .fb-dot{width:8px; height:8px; border-radius:50%; background:var(--sage); flex-shrink:0;}
  .fb-speed{top:-14px; right:6%; animation-delay:0s;}
  .fb-mobile{bottom:14%; left:-6%; animation-delay:1.2s;}
  .fb-seo{bottom:-16px; right:16%; animation-delay:2.4s;}
  @keyframes badgefloat{0%,100%{transform:translateY(0);} 50%{transform:translateY(-8px);}}
  @media (max-width:940px){.float-badge{display:none;}}
  @media (max-width:600px){.device-mock{transform:none;} .device-stage:hover .device-mock{transform:none;}}

  /* TRUST BAND (Built Right Built to Rank) */
  .trustband{background:var(--panel);}
  .tb-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:3rem; align-items:center;}
  @media (max-width:900px){.tb-grid{grid-template-columns:1fr;}}
  .tb-grid p{margin-bottom:1rem; font-size:0.98rem;}
  .tb-photo{
    border-radius:14px; overflow:hidden; position:relative; min-height:280px;
    background:linear-gradient(160deg, rgba(22,35,59,0.15) 0%, rgba(22,35,59,0.55) 100%), url('https://images.unsplash.com/photo-1522071820081-009f0129c71c?auto=format&fit=crop&w=900&q=80') center/cover no-repeat;
  }
  .tb-photo .tb-quote{position:absolute; left:0; right:0; bottom:0; padding:1.4rem; color:#fff; font-family:var(--display); font-weight:600; font-size:1.02rem; line-height:1.4;
    background:linear-gradient(0deg, rgba(22,35,59,0.9) 10%, transparent 100%);}
  .tb-quote span{color:var(--ochre);}

  /* SERVICE GRID (shared pattern) */
  .service-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; perspective:1000px;}
  @media (max-width:900px){.service-grid{grid-template-columns:1fr 1fr;}}
  @media (max-width:560px){.service-grid{grid-template-columns:1fr;}}
  .service-card{background:var(--white); border:1px solid var(--line); border-radius:10px; padding:1.4rem; transition:border-color .2s, box-shadow .25s; transform-style:preserve-3d; will-change:transform;}
  .service-card:hover{border-color:var(--ochre); box-shadow:0 20px 40px -20px rgba(22,35,59,0.35);}
  .service-icon{width:38px; height:38px; border-radius:8px; background:var(--ink); display:flex; align-items:center; justify-content:center; margin-bottom:1rem; transform:translateZ(20px); transition:background .3s, transform .35s;}
  .service-card:hover .service-icon{background:var(--ochre); transform:translateZ(20px) rotate(-8deg) scale(1.08);}
  .service-card h3{margin-bottom:0.4rem; transform:translateZ(12px);}
  .service-card p{font-size:0.89rem;}
  .explore-link{display:inline-flex; align-items:center; gap:0.4rem; margin-top:2rem; font-weight:600; color:var(--ochre-dark); text-decoration:none; font-size:0.95rem;}
  .explore-link svg{transition:transform .2s;}
  .explore-link:hover svg{transform:translateX(4px);}

  /* TYPES OF WEBSITES */
  .types-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:1rem;}
  @media (max-width:980px){.types-grid{grid-template-columns:repeat(3,1fr);}}
  @media (max-width:640px){.types-grid{grid-template-columns:1fr 1fr;}}
  @media (max-width:420px){.types-grid{grid-template-columns:1fr;}}
  .type-card{background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:1.2rem 1rem; text-align:center; transition:transform .2s, border-color .2s, background .2s;}
  .type-card:hover{transform:translateY(-4px); border-color:var(--ochre); background:var(--white);}
  .type-icon{width:36px; height:36px; border-radius:8px; background:var(--ink); display:flex; align-items:center; justify-content:center; margin:0 auto 0.8rem; transition:background .3s;}
  .type-card:hover .type-icon{background:var(--ochre);}
  .type-card h3{font-size:0.88rem; margin-bottom:0.35rem;}
  .type-card p{font-size:0.78rem;}

  /* REDESIGN / BEFORE-AFTER SLIDER */
  .redesign{background:var(--white);}
  .rd-grid{display:grid; grid-template-columns:0.95fr 1.05fr; gap:3rem; align-items:center;}
  @media (max-width:900px){.rd-grid{grid-template-columns:1fr;}}
  .rd-list{display:flex; flex-direction:column; gap:0.9rem; margin:1.3rem 0 1.6rem;}
  .rd-list li{display:flex; gap:0.7rem; align-items:flex-start; font-size:0.93rem; color:var(--ink);}
  .rd-list li svg{flex-shrink:0; color:var(--sage); margin-top:0.2rem;}

  .ba-wrap{position:relative; aspect-ratio:16/11; border-radius:14px; overflow:hidden; border:1px solid var(--line); box-shadow:0 20px 40px -22px rgba(22,35,59,0.35); user-select:none;}
  .ba-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
  .ba-before{clip-path:inset(0 50% 0 0); transition:clip-path .05s linear;}
  .ba-tag{position:absolute; top:12px; font-family:var(--mono); font-size:0.68rem; text-transform:uppercase; letter-spacing:0.06em; padding:0.35rem 0.7rem; border-radius:20px; color:#fff; background:rgba(22,35,59,0.75); backdrop-filter:blur(3px);}
  .ba-tag.before{left:12px;} .ba-tag.after{right:12px; background:rgba(95,138,114,0.85);}
  .ba-handle{position:absolute; top:0; bottom:0; left:50%; width:0; border-left:2px solid #fff; transform:translateX(-1px); pointer-events:none; box-shadow:0 0 0 1px rgba(0,0,0,0.15);}
  .ba-grip{position:absolute; top:50%; left:0; transform:translate(-50%,-50%); width:38px; height:38px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 18px rgba(0,0,0,0.25); pointer-events:none;}
  .ba-range{position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:ew-resize; -webkit-appearance:none;}
  .ba-range::-webkit-slider-thumb{-webkit-appearance:none; width:38px; height:38px;}
  .ba-range::-moz-range-thumb{width:38px; height:38px; border:none; background:transparent;}
  .ba-range::-moz-range-track{background:transparent; border:none;}
  .ba-caption{text-align:center; font-family:var(--mono); font-size:0.76rem; color:#9AA6BC; margin-top:0.8rem;}

  /* WHY FIT grid */
  .whyus-grid4{display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem;}
  @media (max-width:900px){.whyus-grid4{grid-template-columns:1fr 1fr;}}
  @media (max-width:560px){.whyus-grid4{grid-template-columns:1fr;}}
  .whyus-card4{background:var(--white); border:1px solid var(--line); border-radius:12px; padding:1.5rem; position:relative; overflow:hidden;
    opacity:0; transform:translateY(24px); transition:opacity .55s ease, transform .55s ease, border-color .25s, box-shadow .3s;}
  .whyus-grid4.in .whyus-card4{opacity:1; transform:translateY(0);}
  .whyus-grid4 .whyus-card4:nth-child(1){transition-delay:.04s;} .whyus-grid4 .whyus-card4:nth-child(2){transition-delay:.14s;}
  .whyus-grid4 .whyus-card4:nth-child(3){transition-delay:.24s;} .whyus-grid4 .whyus-card4:nth-child(4){transition-delay:.34s;}
  .whyus-card4:hover{border-color:var(--ochre); box-shadow:0 20px 40px -22px rgba(22,35,59,0.3); transform:translateY(-5px);}
  .whyus-card4 .wicon{width:40px; height:40px; border-radius:10px; background:var(--ink); display:flex; align-items:center; justify-content:center; margin-bottom:1rem; transition:background .3s, transform .3s;}
  .whyus-card4:hover .wicon{background:var(--ochre); transform:rotate(-6deg) scale(1.08);}
  .whyus-card4 h3{font-size:0.98rem; margin-bottom:0.5rem;}
  .whyus-card4 p{font-size:0.87rem;}

  /* PACKAGE HIGHLIGHT */
  .package-card{
    background:var(--ink); color:#fff; border-radius:18px; padding:clamp(2rem,5vw,3rem);
    display:grid; grid-template-columns:1fr auto; gap:2.5rem; align-items:center; position:relative; overflow:hidden;
    border:1px solid rgba(187,91,42,0.4);
  }
  @media (max-width:800px){.package-card{grid-template-columns:1fr; text-align:left;}}
  .package-card::before{content:""; position:absolute; top:-60px; left:-60px; width:200px; height:200px; background:var(--ochre); opacity:0.18; border-radius:50%;}
  .package-card > *{position:relative; z-index:1;}
  .package-card h2{color:#fff;}
  .package-card p{color:#C6CEDD; max-width:52ch; margin:0.8rem 0 1.3rem;}
  .package-list{display:grid; grid-template-columns:1fr 1fr; gap:0.6rem 1.4rem;}
  @media (max-width:520px){.package-list{grid-template-columns:1fr;}}
  .package-list li{display:flex; gap:0.55rem; align-items:center; font-size:0.9rem; color:#fff;}
  .package-list li svg{flex-shrink:0; color:var(--ochre);}
  .package-cta{display:flex; flex-direction:column; gap:0.7rem; align-items:center;}
  .package-cta .pill{font-family:var(--mono); font-size:0.7rem; color:#9AA6BC; text-align:center;}

  /* PROCESS RAIL */
  .process-rail{display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; position:relative;}
  @media (max-width:900px){.process-rail{grid-template-columns:1fr 1fr;}}
  @media (max-width:560px){.process-rail{grid-template-columns:1fr;}}
  .process-rail::before{content:""; position:absolute; top:26px; left:12.5%; right:12.5%; height:2px; background:repeating-linear-gradient(90deg, var(--line) 0 8px, transparent 8px 16px); z-index:0;}
  @media (max-width:900px){.process-rail::before{display:none;}}
  .proc-step{position:relative; z-index:1;}
  .proc-num{width:52px; height:52px; border-radius:50%; background:var(--white); border:2px solid var(--ochre); display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:700; color:var(--ochre); margin-bottom:1.1rem; transition:background .3s, color .3s;}
  .proc-step:hover .proc-num{background:var(--ochre); color:#fff;}
  .proc-step h3{margin-bottom:0.5rem; font-size:1.02rem;}
  .proc-step p{font-size:0.88rem;}

  /* FAQ */
  .faq-list{max-width:800px; margin:0 auto; border-top:1px solid var(--line);}
  details{border-bottom:1px solid var(--line); padding:1.1rem 0;}
  summary{cursor:pointer; font-family:var(--display); font-weight:600; color:var(--ink); list-style:none; display:flex; justify-content:space-between; align-items:center; gap:1rem; font-size:1rem;}
  summary::-webkit-details-marker{display:none;}
  summary::after{content:"+"; font-size:1.4rem; color:var(--ochre); flex-shrink:0; font-family:var(--body); font-weight:400;}
  details[open] summary::after{content:"–";}
  details p{margin-top:0.8rem; font-size:0.94rem; max-width:64ch;}

  /* FINAL CTA */
  .final-cta{
    background:linear-gradient(160deg, rgba(22,35,59,0.93) 0%, rgba(22,35,59,0.88) 60%, rgba(22,35,59,0.96) 100%),
      url('https://images.unsplash.com/photo-1517180102446-f3ece451e9d8?auto=format&fit=crop&w=1400&q=80') center 40%/cover no-repeat;
    color:#fff; border-radius:16px; padding:clamp(2.4rem,6vw,4rem); text-align:center; max-width:1180px; margin:0 auto; position:relative; overflow:hidden;
  }
  .final-cta > *{position:relative; z-index:1;}
  .final-cta h2{color:#fff; margin-bottom:0.8rem;}
  .final-cta p{color:#C6CEDD; max-width:58ch; margin:0 auto 1.4rem;}
  .final-cta p.desc2{margin-bottom:2rem;}
  .final-cta .cta-row{justify-content:center;}

  /* FOOTER */
  footer{background:var(--ink); color:#C6CEDD; position:relative; overflow:hidden; padding:clamp(3rem,6vw,4.5rem) 0 0;}
  footer::before{content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.04) 1px,transparent 1px); background-size:44px 44px; mask-image:radial-gradient(ellipse 70% 60% at 85% 0%, black 30%, transparent 80%);}
  .footer-top{position:relative; z-index:1; display:grid; grid-template-columns:1.4fr 0.8fr 0.8fr 1fr; gap:2.5rem; padding-bottom:2.8rem; border-bottom:1px solid rgba(255,255,255,0.1);}
  @media (max-width:900px){.footer-top{grid-template-columns:1fr 1fr; row-gap:2.2rem;}    .consult-form {max-width: unset !important;}}
  @media (max-width:560px){.footer-top{grid-template-columns:1fr;}}
  .footer-brand .logo{color:#fff; margin-bottom:0.9rem;}
  .footer-brand p{font-size:0.9rem; color:#9AA6BC; max-width:32ch; margin-bottom:1.3rem;}
  .footer-social{display:flex; gap:0.7rem;}
  .footer-social a{width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,0.18); display:flex; align-items:center; justify-content:center; transition:border-color .2s, background .2s;}
  .footer-social a:hover{border-color:var(--ochre); background:rgba(187,91,42,0.15);}
  .footer-col h4{font-family:var(--mono); font-size:0.72rem; text-transform:uppercase; letter-spacing:0.1em; color:#7C87A0; margin-bottom:1.1rem; font-weight:500;}
  .footer-col ul{display:flex; flex-direction:column; gap:0.65rem;}
  .footer-col a{font-size:0.9rem; color:#C6CEDD; text-decoration:none; transition:color .2s;}
  .footer-col a:hover{color:var(--ochre);}
  .footer-contact li{display:flex; gap:0.6rem; align-items:flex-start; font-size:0.9rem; color:#C6CEDD;}
  .footer-contact svg{flex-shrink:0; margin-top:0.15rem; color:var(--ochre);}
  .footer-mini-cta{margin-top:1.3rem; display:inline-flex; align-items:center; gap:0.5rem; background:var(--ochre); color:#fff; padding:0.65rem 1.1rem; border-radius:6px; font-size:0.85rem; font-weight:600; text-decoration:none; transition:background .2s;}
  .footer-mini-cta:hover{background:var(--ochre-dark);}
  .footer-bottom{position:relative; z-index:1; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; padding:1.5rem 0 1.8rem; font-size:0.8rem; color:#7C87A0;text-align: center;padding: 30px !important;}
  .footer-bottom-links{display:flex; gap:1.4rem; flex-wrap:wrap;}
  .footer-bottom-links a{color:#7C87A0; text-decoration:none;} .footer-bottom-links a:hover{color:#fff;}
  .back-to-top{width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,0.18); display:flex; align-items:center; justify-content:center; text-decoration:none; color:#fff; transition:border-color .2s, background .2s, transform .2s;}
  .back-to-top:hover{border-color:var(--ochre); background:rgba(187,91,42,0.15); transform:translateY(-2px);}

  .sticky-cta{display:none; position:fixed; left:0; right:0; bottom:0; z-index:200; background:var(--white); border-top:1px solid var(--line); padding:0.6rem 1rem; box-shadow:0 -8px 20px rgba(0,0,0,0.08);}
  .sticky-cta .row{display:flex; gap:0.6rem;}
  @media (max-width:820px){.sticky-cta{display:block;}}

  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;} *{transition:none !important; animation:none !important;}
    .reveal,.whyus-card4{opacity:1; transform:none;}
    .device-mock{transform:none;}
  }




    @media (max-width:600px){ .cta-row {
    justify-content: center;
    gap: 20px;
    display: flex;
    flex-direction: column;
} 

.copyright{text-align: center;width: 100%;}
}

@media (max-width: 760px) {
    .vs-badge {
        top: auto;
        bottom: 40%;
        left: 50%;
        display: none !important;
    }

    .cta-strip{text-align: center;}
     .cta-strip .btn{margin-inline: auto;}
     .why-callout{min-height: unset !important;}
     .why-callout .wc-list {
    margin-top: 1.3rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    position: relative;
    z-index: 1;
    align-items: center;
    justify-content: center;
}

}

  
  header.site{
    position:sticky; top:0; z-index:100;
    background:rgba(251,250,246,0.92);
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--line);
  }
  .nav{
    display:flex; align-items:center; justify-content:space-between;
    padding:1.1rem clamp(1.25rem,4vw,2.5rem);
    max-width:1180px; margin:0 auto;
  }
  .logo{
    font-family:var(--display); font-weight:700; font-size:1.1rem; color:var(--ink);
    display:flex; align-items:center; gap:0.5rem; text-decoration:none;
  }
  .logo .logo-mark{flex-shrink:0;}
  .nav-links{display:flex; gap:2rem; font-size:0.95rem; font-weight:500;}
  .nav-links a{text-decoration:none; color:var(--slate); transition:color .2s;}
  .nav-links a:hover{color:var(--ink);}
  .nav-cta{
    background:var(--ink); color:var(--white); padding:0.65rem 1.3rem; border-radius:6px;
    font-weight:600; font-size:0.88rem; text-decoration:none; white-space:nowrap;
    transition:background .2s;
  }
  .nav-cta:hover{background:var(--ochre-dark);}
  .nav-phone{
    display:flex; align-items:center; gap:0.45rem;
    font-family:var(--mono); font-size:0.86rem; font-weight:500; color:var(--ink);
    text-decoration:none; white-space:nowrap;
  }
  .nav-phone svg{flex-shrink:0;}
  .nav-phone:hover{color:var(--ochre-dark);}
  @media (max-width:1080px){.nav-phone{display:none;}}
  .nav-toggle{display:none; background:none; border:none; cursor:pointer; padding:0.4rem; position:relative; z-index:110;}
  .nav-toggle span{display:block; width:24px; height:2px; background:var(--ink); margin:5px 0; transition:transform .25s ease, opacity .2s ease;}
  .nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .nav-toggle.open span:nth-child(2){opacity:0;}
  .nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

  @media (max-width:820px){
    .nav-links, .nav-cta{display:none;}
    .nav-toggle{display:block;}
    .nav-links.open{display:flex; flex-direction:column; gap:0; position:absolute; top:100%; left:0; right:0; background:var(--paper); border-bottom:1px solid var(--line); border-top:1px solid var(--line); padding:0.5rem 0; box-shadow:0 20px 40px -12px rgba(22,35,59,0.25); z-index:90; max-height:calc(100vh - 100%); overflow-y:auto;}
    .nav-links.open a{padding:0.95rem clamp(1.25rem,4vw,2.5rem); border-bottom:1px solid var(--line); font-size:1rem;}
  .nav-links.open a:last-child{border-bottom:none;}
    .nav-cta.open{display:block; margin:0.75rem clamp(1.25rem,4vw,2.5rem) 1rem; text-align:center;}
  .nav-backdrop{display:none; position:fixed; inset:0; background:rgba(22,35,59,0.45); z-index:85;}
  .nav-backdrop.open{display:block;}
  body.menu-open{overflow:hidden;}
  }

  .owl-nav .owl-prev,
.owl-nav .owl-next{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #fff !important;
  border: 1px solid rgba(0,0,0,0.15);
  font-size: 20px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.owl-nav .owl-prev{ left: -50px; }
.owl-nav .owl-next{ right: -50px; }



.owl-nav .owl-prev:hover,
.owl-nav .owl-next:hover{
   background-color: var(--ochre) !important;  /* dark background on hover */
  color: #fff !important;         /* icon white on hover */
}

.owl-carousel .owl-dots{
  text-align: center; 
  margin-top: 20px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;


}
.owl-carousel button.owl-dot span{
  width: 10px !important;
  height: 10px !important;
  margin: 0 4px;
  border-radius: 50% !important;
  background: var(--ink) !important;
    display: block !important;
}
.owl-carousel button.owl-dot.active span{
  background:var(--ochre) !important;
  width: 10px !important;
  display: block !important;
  height: 10px !important;
 
}

.owl-carousel .owl-dots.disabled, .owl-carousel .owl-nav.disabled {
    display: block !important; 
}

    @media (max-width:991px) {
   .owl-carousel .owl-nav.disabled 
    {display: none !important;}
    
}
    

.owl-carousel .owl-stage {
  display: flex;
}

.owl-carousel .owl-item {
  display: flex;
  height: auto;
}

.owl-carousel .item {
  display: flex;
  flex: 1;
  height: auto;
}

.owl-carousel .card {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}


#auditModal .wpcf7-submit {
  background: #E8A33D;
  color: #0E2A47;
  font-weight: 600;
  padding: 12px;
  border: none;
}
#auditModal .wpcf7-submit:hover {
  background: #CE8A28;
}

#auditModal .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}
#auditModal .wpcf7 form.wpcf7-form p {
  margin: 0;
}


/* CF7 ke wrapper span ko invisible/inline bana do */
.field .wpcf7-form-control-wrap,
.field-row .field .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

/* CF7 input ko full width aur original style dena */
.field input.wpcf7-form-control {
  width: 100%;
  box-sizing: border-box;
}

/* CF7 apne aap ek response <p> ya <div> add karta hai submit button ke baad - usko style mein rakho */
.wpcf7-response-output {
  margin-top: 10px;
  font-size: 13px;
}

/* Agar .field ka original CSS "> input" (direct child) selector use kar raha tha */
.field {
  display: flex;
  flex-direction: column;
}

.field br,
.field-row br {
  display: none;
}