:root{
    --ink:#0D1526;
    --ink-2:#141F38;
    --ink-3:#1B2846;
    --paper:#EFEDE4;
    --paper-dim: rgba(239,237,228,0.7);
    --marigold:#E8963A;
    --marigold-soft: rgba(232,150,58,0.14);
    --seafoam:#3F8C82;
    --seafoam-soft: rgba(63,140,130,0.14);
    --slate:#454B57;
    --line: rgba(239,237,228,0.10);
    --line-strong: rgba(239,237,228,0.22);
    --shadow: 0 30px 80px -20px rgba(0,0,0,0.55);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--ink);
    color:var(--paper);
    font-family:'Inter', sans-serif;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    overflow-x:hidden;
    font-feature-settings:'ss01' 1, 'cv11' 1;
  }
  a{color:inherit; text-decoration:none;}
  img{max-width:100%; display:block;}
  .mono{font-family:'IBM Plex Mono', monospace;}
  .wrap{max-width:1200px; margin:0 auto; padding:0 32px;}
  ::selection{background:var(--marigold); color:var(--ink);}

  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
  }

  /* film-grain texture overlay */
  .grain{
    position:fixed; inset:0; z-index:2; pointer-events:none; opacity:0.035; mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  /* scroll reveal */
  .reveal{opacity:0; transform:translateY(28px); transition:opacity .8s cubic-bezier(.16,.8,.24,1), transform .8s cubic-bezier(.16,.8,.24,1);}
  .reveal.in{opacity:1; transform:translateY(0);}

  /* ---------- NAV ---------- */
  header{
    position:fixed; top:0; left:0; right:0; z-index:100;
    padding:22px 0;
    transition:background .35s ease, border-color .35s ease, padding .35s ease;
    border-bottom:1px solid transparent;
  }
  header.scrolled{
    background:rgba(13,21,38,0.82);
    backdrop-filter:blur(14px) saturate(140%);
    border-bottom:1px solid var(--line);
    padding:15px 0;
  }
  nav{display:flex; align-items:center; justify-content:space-between;}
  .logo{display:flex; align-items:center; gap:11px; font-weight:700; font-size:1.02rem; letter-spacing:0.01em;}
  .logo-mark{
    width:36px; height:36px; border-radius:9px;
    background:linear-gradient(135deg, var(--marigold), var(--seafoam));
    display:flex; align-items:center; justify-content:center;
    font-family:'Fraunces', serif; font-weight:600; color:var(--ink); font-size:1.1rem;
    box-shadow:0 6px 18px -4px rgba(232,150,58,0.4);
  }
  .nav-links{display:flex; align-items:center; gap:38px; font-size:0.9rem;}
  .nav-links a:not(.nav-cta){opacity:0.8; transition:opacity .2s; position:relative;}
  .nav-links a:not(.nav-cta)::after{
    content:''; position:absolute; left:0; right:0; bottom:-6px; height:1px; background:var(--marigold);
    transform:scaleX(0); transform-origin:right; transition:transform .3s ease;
  }
  .nav-links a:not(.nav-cta):hover{opacity:1;}
  .nav-links a:not(.nav-cta):hover::after{transform:scaleX(1); transform-origin:left;}
  .nav-cta{
    padding:11px 22px; border-radius:100px;
    background:var(--marigold); color:var(--ink); font-weight:600; font-size:0.86rem;
    transition:transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s;
  }
  .nav-cta:hover{transform:translateY(-2px) scale(1.02); box-shadow:0 12px 26px rgba(232,150,58,0.35);}
  .nav-toggle{display:none; background:none; border:none; color:var(--paper); font-size:1.6rem; cursor:pointer;}

  @media (max-width:880px){
    .nav-links{position:fixed; top:0; right:0; height:100vh; width:290px; background:var(--ink-2);
      flex-direction:column; justify-content:center; align-items:flex-start; padding:40px;
      transform:translateX(100%); transition:transform .35s cubic-bezier(.16,.8,.24,1); gap:28px; border-left:1px solid var(--line); z-index:200;}
    .nav-links.open{transform:translateX(0);}
    .nav-toggle{display:block; z-index:201; position:relative;}
  }

  /* ---------- HERO ---------- */
  .hero{
    padding:168px 0 100px;
    position:relative;
    display:grid; grid-template-columns:1.05fr 0.95fr; gap:40px; align-items:center;
  }
  .hero::before{
    content:''; position:absolute; inset:-200px 0 auto -200px; height:900px; z-index:-1;
    background:
      radial-gradient(ellipse 720px 480px at 10% 20%, rgba(232,150,58,0.15), transparent 60%),
      radial-gradient(ellipse 640px 480px at 78% 6%, rgba(63,140,130,0.18), transparent 60%);
  }
  .eyebrow{
    font-size:0.78rem; letter-spacing:0.16em; text-transform:uppercase;
    color:var(--marigold); margin-bottom:24px; display:flex; align-items:center; gap:10px;
  }
  .eyebrow::before{content:''; width:24px; height:1px; background:var(--marigold);}
  h1{
    font-family:'Fraunces', serif; font-weight:500; font-style:normal;
    font-size:clamp(2.5rem, 4.6vw, 4rem); line-height:1.06; letter-spacing:-0.015em;
  }
  h1 em{font-style:italic; font-weight:400; color:var(--seafoam);}
  .hero-sub{
    margin-top:26px; max-width:520px; font-size:1.12rem; line-height:1.65; color:var(--paper-dim);
  }
  .hero-ctas{display:flex; gap:16px; margin-top:42px; flex-wrap:wrap;}
  .btn-primary{
    padding:15px 30px; border-radius:100px; background:var(--marigold); color:var(--ink);
    font-weight:600; font-size:0.95rem; transition:transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s;
    display:inline-block;
  }
  .btn-primary:hover{transform:translateY(-2px) scale(1.015); box-shadow:0 14px 30px rgba(232,150,58,0.32);}
  .btn-ghost{
    padding:15px 30px; border-radius:100px; border:1px solid var(--line-strong);
    font-weight:600; font-size:0.95rem; transition:border-color .25s, background .25s, transform .25s;
    display:inline-block;
  }
  .btn-ghost:hover{border-color:var(--paper); background:rgba(239,237,228,0.06); transform:translateY(-2px);}

  /* hero constellation graphic */
  .hero-graphic{position:relative; height:460px;}
  .hero-graphic svg{width:100%; height:100%; overflow:visible;}
  .node-glow{filter:drop-shadow(0 0 14px currentColor);}
  .constellation-line{stroke-dasharray:4 6; opacity:0.35; animation:dash 40s linear infinite;}
  @keyframes dash{to{stroke-dashoffset:-400;}}
  .node-pulse{animation:pulse 3.4s ease-in-out infinite;}
  @keyframes pulse{0%,100%{opacity:0.55; r:5;} 50%{opacity:1; r:7;}}

  @media (max-width:960px){
    .hero{grid-template-columns:1fr; padding-top:150px;}
    .hero-graphic{height:280px; order:-1;}
  }

  /* metrics strip */
  .metrics-strip{
    border-top:1px solid var(--line); border-bottom:1px solid var(--line);
    display:grid; grid-template-columns:repeat(4, 1fr);
  }
  .metric{padding:36px 32px; border-right:1px solid var(--line);}
  .metric:last-child{border-right:none;}
  .metric .num{font-family:'Fraunces', serif; font-size:2.1rem; font-weight:500; color:var(--paper);}
  .metric .lbl{margin-top:6px; font-size:0.82rem; color:var(--paper-dim);}
  @media (max-width:760px){
    .metrics-strip{grid-template-columns:repeat(2, 1fr);}
    .metric{border-bottom:1px solid var(--line);}
  }

  /* stack marquee */
  .stack-strip{padding:16px 0; overflow:hidden; white-space:nowrap;}
  .stack-track{display:inline-flex; gap:52px; animation:scroll 30s linear infinite;}
  .stack-track span{font-size:0.8rem; color:var(--paper-dim); letter-spacing:0.05em;}
  @keyframes scroll{ from{transform:translateX(0);} to{transform:translateX(-50%);} }

  /* ---------- SECTION HEADS ---------- */
  section{padding:130px 0;}
  .sec-head{max-width:640px; margin-bottom:70px; display:flex; justify-content:space-between; align-items:flex-end; gap:40px;}
  .sec-head .eyebrow{color:var(--seafoam);}
  .sec-head .eyebrow::before{background:var(--seafoam);}
  h2{
    font-family:'Fraunces', serif; font-weight:500; font-size:clamp(2rem, 3.2vw, 2.65rem);
    line-height:1.15; letter-spacing:-0.015em;
  }
  .sec-head p{margin-top:18px; color:var(--paper-dim); font-size:1.05rem; line-height:1.65;}
  .sec-head-full{max-width:100%;}

  /* ---------- PRODUCT SHELF ---------- */
  .shelf-grid{
    display:grid; grid-template-columns:repeat(3, 1fr); gap:22px;
  }
  @media (max-width:980px){ .shelf-grid{grid-template-columns:repeat(2, 1fr);} }
  @media (max-width:640px){ .shelf-grid{grid-template-columns:1fr;} }

  .stamp{
    background:linear-gradient(180deg, var(--ink-3), var(--ink-2));
    border:1px solid var(--line); border-radius:16px; padding:30px;
    position:relative; overflow:hidden;
    transition:transform .35s cubic-bezier(.16,.8,.24,1), border-color .35s, box-shadow .35s;
  }
  .stamp::before{
    content:''; position:absolute; top:-60%; right:-40%; width:220px; height:220px; border-radius:50%;
    background:var(--dot, var(--marigold)); opacity:0.16; filter:blur(50px);
    transition:opacity .35s;
  }
  .stamp:hover{transform:translateY(-6px); border-color:var(--line-strong); box-shadow:var(--shadow);}
  .stamp:hover::before{opacity:0.28;}
  .stamp-mark{
    width:46px; height:46px; border-radius:12px; margin-bottom:24px;
    background:var(--dot, var(--marigold)); color:var(--ink);
    display:flex; align-items:center; justify-content:center;
    font-family:'Fraunces', serif; font-weight:600; font-size:1.2rem;
    position:relative; z-index:1;
  }
  .stamp-tag{
    display:block; font-family:'IBM Plex Mono', monospace; font-size:0.68rem;
    letter-spacing:0.07em; text-transform:uppercase; color:var(--dot, var(--marigold)); margin-bottom:12px;
    position:relative; z-index:1;
  }
  .stamp h3{font-family:'Fraunces', serif; font-size:1.4rem; font-weight:500; margin-bottom:12px; position:relative; z-index:1;}
  .stamp p{font-size:0.92rem; line-height:1.6; color:var(--paper-dim); margin-bottom:24px; position:relative; z-index:1;}
  .stamp a{font-size:0.84rem; font-weight:600; display:inline-flex; align-items:center; gap:6px; position:relative; z-index:1;}
  .stamp a::after{content:'→'; transition:transform .25s;}
  .stamp a:hover::after{transform:translateX(4px);}

  /* ---------- SERVICES ---------- */
  .services-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:18px; overflow:hidden;}
  .service-card{
    display:block; background:var(--ink); padding:48px 44px;
    transition:background .3s ease;
  }
  .service-card:hover{background:var(--ink-2);}
  .service-icon{
    width:44px; height:44px; margin-bottom:24px; color:var(--marigold);
  }
  .service-card h3{font-family:'Fraunces', serif; font-weight:500; font-size:1.42rem; margin-bottom:14px;}
  .service-card p{color:var(--paper-dim); font-size:0.96rem; line-height:1.65;}
  .service-card .learn{margin-top:20px; font-size:0.84rem; font-weight:600; display:inline-flex; align-items:center; gap:6px; color:var(--seafoam);}
  .service-card .learn::after{content:'→'; transition:transform .25s;}
  .service-card:hover .learn::after{transform:translateX(4px);}
  @media (max-width:760px){.services-grid{grid-template-columns:1fr;}}

  /* ---------- PROCESS ---------- */
  .process-list{position:relative; padding-left:2px;}
  .process-list::before{content:''; position:absolute; left:34px; top:14px; bottom:14px; width:1px; background:var(--line-strong);}
  .process-row{
    display:grid; grid-template-columns:70px 1fr 1.4fr; gap:30px;
    padding:36px 0; align-items:baseline; position:relative;
  }
  .process-row .step-num{
    font-family:'IBM Plex Mono', monospace; color:var(--ink); font-size:0.85rem;
    width:32px; height:32px; border-radius:50%; background:var(--seafoam);
    display:flex; align-items:center; justify-content:center; position:relative; z-index:1;
  }
  .process-row h4{font-family:'Fraunces', serif; font-size:1.28rem; font-weight:500;}
  .process-row p{color:var(--paper-dim); font-size:0.95rem; line-height:1.65;}
  @media (max-width:700px){
    .process-row{grid-template-columns:32px 1fr; gap:8px 20px;}
    .process-row h4, .process-row p{grid-column:2;}
    .process-list::before{left:16px;}
  }

  /* ---------- ENTERPRISE CALLOUT ---------- */
  .callout{
    background:var(--paper); color:var(--ink); border-radius:24px;
    padding:64px; display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:center;
    position:relative; overflow:hidden;
  }
  .callout::after{
    content:''; position:absolute; right:-80px; top:-80px; width:280px; height:280px; border-radius:50%;
    background:radial-gradient(circle, rgba(63,140,130,0.22), transparent 70%);
  }
  .callout .eyebrow{color:var(--seafoam);}
  .callout .eyebrow::before{background:var(--seafoam);}
  .callout h2{color:var(--ink);}
  .callout p{color:var(--slate); margin-top:16px; line-height:1.68; font-size:1.03rem;}
  .callout-tags{display:flex; flex-wrap:wrap; gap:10px; position:relative; z-index:1;}
  .callout-tags span{
    font-family:'IBM Plex Mono', monospace; font-size:0.78rem; background:var(--ink); color:var(--paper);
    padding:9px 15px; border-radius:8px;
  }
  @media (max-width:800px){.callout{grid-template-columns:1fr; padding:40px;}}

  /* ---------- CONTACT ---------- */
  .contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:80px;}
  .contact-info p{color:var(--paper-dim); font-size:1.08rem; line-height:1.7; max-width:420px;}
  .info-row{margin-top:36px; padding-top:22px; border-top:1px solid var(--line);}
  .info-row .label{font-family:'IBM Plex Mono', monospace; font-size:0.74rem; color:var(--marigold); text-transform:uppercase; letter-spacing:0.07em;}
  .info-row .value{margin-top:9px; font-size:1.08rem;}
  form{display:flex; flex-direction:column; gap:22px;}
  .field label{font-family:'IBM Plex Mono', monospace; font-size:0.72rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--paper-dim); display:block; margin-bottom:9px;}
  .field input, .field textarea{
    width:100%; background:transparent; border:none; border-bottom:1px solid var(--line-strong);
    color:var(--paper); font-family:'Inter', sans-serif; font-size:1rem; padding:11px 0; outline:none;
    transition:border-color .25s;
  }
  .field input:focus, .field textarea:focus{border-color:var(--marigold);}
  .field textarea{resize:vertical; min-height:72px;}
  .submit-btn{
    align-self:flex-start; margin-top:8px; border:none; cursor:pointer;
    padding:15px 30px; border-radius:100px; background:var(--marigold); color:var(--ink);
    font-weight:600; font-size:0.95rem; font-family:'Inter', sans-serif;
    transition:transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s;
  }
  .submit-btn:hover{transform:translateY(-2px) scale(1.015); box-shadow:0 14px 30px rgba(232,150,58,0.32);}
  @media (max-width:800px){.contact-grid{grid-template-columns:1fr; gap:48px;}}

  /* ---------- FOOTER ---------- */
  footer{border-top:1px solid var(--line); padding:44px 0;}
  .footer-row{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;}
  .footer-row .mono{font-size:0.8rem; color:var(--paper-dim);}
  .footer-links{display:flex; gap:26px; font-size:0.85rem;}
  .footer-links a{opacity:0.62; transition:opacity .2s;}
  .footer-links a:hover{opacity:1;}
/* ================= INTERIOR PAGES ================= */

/* page hero (About, Service, Blog, Career, Contact, Quote, Login, Register) */
.page-hero{
  padding:168px 0 80px; position:relative;
}
.page-hero::before{
  content:''; position:absolute; inset:-200px 0 auto -200px; height:700px; z-index:-1;
  background: radial-gradient(ellipse 640px 420px at 12% 10%, rgba(232,150,58,0.14), transparent 60%),
              radial-gradient(ellipse 560px 420px at 85% 0%, rgba(63,140,130,0.16), transparent 60%);
}
.page-hero h1{font-size:clamp(2.2rem, 4.2vw, 3.4rem); max-width:760px;}
.page-hero .hero-sub{max-width:640px;}

/* prose content blocks */
.prose{max-width:720px;}
.prose p{color:var(--paper-dim); font-size:1.05rem; line-height:1.75; margin-bottom:22px;}
.prose h3{font-family:'Fraunces', serif; font-weight:500; font-size:1.5rem; margin:44px 0 16px;}
.prose ul{margin:0 0 22px 22px; color:var(--paper-dim); font-size:1.02rem; line-height:1.8;}

/* two-col about layout */
.about-grid{display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:start;}
@media (max-width:860px){ .about-grid{grid-template-columns:1fr; gap:40px;} }

.value-list{display:flex; flex-direction:column; gap:0;}
.value-row{padding:26px 0; border-top:1px solid var(--line);}
.value-row:last-child{border-bottom:1px solid var(--line);}
.value-row .v-label{font-family:'IBM Plex Mono', monospace; font-size:0.74rem; color:var(--marigold); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:8px;}
.value-row h4{font-family:'Fraunces', serif; font-weight:500; font-size:1.2rem; margin-bottom:8px;}
.value-row p{color:var(--paper-dim); font-size:0.95rem; line-height:1.6;}

/* service detail list */
.service-detail-list{display:flex; flex-direction:column;}
.service-detail-row{
  display:grid; grid-template-columns:90px 1fr auto; gap:30px; align-items:center;
  padding:34px 0; border-top:1px solid var(--line); transition:padding-left .3s ease;
}
.service-detail-row:last-child{border-bottom:1px solid var(--line);}
.service-detail-row:hover{padding-left:12px;}
.service-detail-row .sd-num{font-family:'IBM Plex Mono', monospace; color:var(--seafoam); font-size:0.85rem;}
.service-detail-row h3{font-family:'Fraunces', serif; font-weight:500; font-size:1.35rem; margin-bottom:8px;}
.service-detail-row p{color:var(--paper-dim); font-size:0.94rem; line-height:1.6; max-width:520px;}
.service-detail-row .sd-arrow{font-size:1.3rem; color:var(--paper-dim); transition:transform .25s, color .25s;}
.service-detail-row:hover .sd-arrow{transform:translateX(6px); color:var(--marigold);}
@media (max-width:700px){
  .service-detail-row{grid-template-columns:1fr; gap:10px;}
  .service-detail-row .sd-arrow{display:none;}
}

/* empty states (Blog, Career) */
.empty-state{
  text-align:center; padding:90px 40px; border:1px dashed var(--line-strong); border-radius:20px;
}
.empty-state .es-icon{
  width:56px; height:56px; margin:0 auto 26px; color:var(--seafoam);
}
.empty-state h3{font-family:'Fraunces', serif; font-weight:500; font-size:1.5rem; margin-bottom:12px;}
.empty-state p{color:var(--paper-dim); font-size:1rem; max-width:420px; margin:0 auto;}

/* auth cards (Login / Register) */
.auth-wrap{
  min-height:100vh; display:flex; align-items:center; justify-content:center; padding:140px 24px 80px;
}
.auth-card{
  width:100%; max-width:420px; background:var(--ink-3); border:1px solid var(--line);
  border-radius:18px; padding:44px; box-shadow:var(--shadow);
}
.auth-card .logo{margin-bottom:32px;}
.auth-card h1{font-size:1.7rem; margin-bottom:10px;}
.auth-card .hero-sub{font-size:0.96rem; margin-top:0; margin-bottom:32px;}
.auth-card form{gap:20px;}
.auth-switch{margin-top:28px; text-align:center; font-size:0.9rem; color:var(--paper-dim);}
.auth-switch a{color:var(--marigold); font-weight:600;}

/* quote form page */
.quote-grid{display:grid; grid-template-columns:1fr 1fr; gap:70px;}
@media (max-width:860px){ .quote-grid{grid-template-columns:1fr; gap:44px;} }
.select-field select{
  width:100%; background:var(--ink); border:1px solid var(--line-strong); border-radius:10px;
  color:var(--paper); font-family:'Inter', sans-serif; font-size:0.95rem; padding:13px 14px; outline:none;
  transition:border-color .25s;
}
.select-field select:focus{border-color:var(--marigold);}
.quote-benefits{display:flex; flex-direction:column; gap:24px;}
.quote-benefit{display:flex; gap:16px;}
.quote-benefit .qb-num{
  font-family:'IBM Plex Mono', monospace; font-size:0.85rem; color:var(--ink); background:var(--marigold);
  width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.quote-benefit h4{font-family:'Fraunces', serif; font-weight:500; font-size:1.1rem; margin-bottom:4px;}
.quote-benefit p{color:var(--paper-dim); font-size:0.9rem; line-height:1.55;}

body.no-grain .grain{display:none;}

/* ================= INTERNATIONAL-LEVEL POLISH ================= */

/* cursor-reactive hero glow */
.hero{ position:relative; }
.hero-glow{
  position:absolute; inset:0; z-index:-1; pointer-events:none;
  background: radial-gradient(480px circle at var(--mx,50%) var(--my,20%), rgba(232,150,58,0.14), transparent 60%);
  transition:background .3s ease;
}

/* magnetic buttons */
.btn-primary, .btn-ghost, .submit-btn, .nav-cta{ will-change:transform; }

/* refined hero subhead kerning */
.hero-sub{ letter-spacing:0.005em; }

/* ---------- AI AUTOMATION SECTION ---------- */
.automation-flow{
  display:grid; grid-template-columns:repeat(4, 1fr); gap:0; margin-bottom:64px;
  border:1px solid var(--line); border-radius:18px; overflow:hidden;
}
.flow-step{
  padding:36px 28px; border-right:1px solid var(--line); position:relative;
  background:linear-gradient(180deg, var(--ink-3), var(--ink-2));
}
.flow-step:last-child{border-right:none;}
.flow-step::after{
  content:'→'; position:absolute; right:-13px; top:50%; transform:translateY(-50%);
  width:26px; height:26px; border-radius:50%; background:var(--ink); border:1px solid var(--line-strong);
  display:flex; align-items:center; justify-content:center; font-size:0.8rem; color:var(--marigold); z-index:2;
}
.flow-step:last-child::after{display:none;}
.flow-icon{width:36px; height:36px; color:var(--seafoam); margin-bottom:18px;}
.flow-step h4{font-family:'Fraunces', serif; font-weight:500; font-size:1.08rem; margin-bottom:8px;}
.flow-step p{font-size:0.85rem; color:var(--paper-dim); line-height:1.55;}
@media (max-width:860px){
  .automation-flow{grid-template-columns:1fr;}
  .flow-step{border-right:none; border-bottom:1px solid var(--line);}
  .flow-step::after{content:'↓'; right:50%; top:auto; bottom:-13px; transform:translateX(50%);}
}

.automation-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:22px;}
@media (max-width:760px){ .automation-grid{grid-template-columns:1fr;} }
.automation-card{
  display:flex; gap:22px; padding:32px; border:1px solid var(--line); border-radius:16px;
  background:var(--ink-2); transition:border-color .3s, transform .3s;
}
.automation-card:hover{ border-color:var(--line-strong); transform:translateY(-4px); }
.automation-card .ac-icon{
  flex-shrink:0; width:48px; height:48px; border-radius:12px; background:var(--seafoam-soft);
  color:var(--seafoam); display:flex; align-items:center; justify-content:center;
}
.automation-card .ac-icon svg{width:24px; height:24px;}
.automation-card h4{font-family:'Fraunces', serif; font-weight:500; font-size:1.18rem; margin-bottom:8px;}
.automation-card p{font-size:0.92rem; color:var(--paper-dim); line-height:1.6;}

/* ================= PROFESSIONAL LANDING PAGE UPGRADES ================= */

/* three-column value props */
.three-col{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:32px;
}
@media (max-width:860px){ .three-col{grid-template-columns:1fr; gap:24px;} }
.prop-card{
  padding:32px; border:1px solid var(--line); border-radius:16px; background:var(--ink-2);
  transition:border-color .3s, transform .3s;
}
.prop-card:hover{border-color:var(--line-strong); transform:translateY(-4px);}
.prop-icon{
  font-size:1.8rem; color:var(--marigold); margin-bottom:16px; display:block;
}
.prop-card h3{font-family:'Fraunces', serif; font-weight:500; font-size:1.22rem; margin-bottom:12px;}
.prop-card p{font-size:0.92rem; color:var(--paper-dim); line-height:1.65;}

/* logo grid (client proof) */
.logos-grid{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:20px;
}
@media (max-width:860px){ .logos-grid{grid-template-columns:repeat(2, 1fr);} }
@media (max-width:560px){ .logos-grid{grid-template-columns:1fr;} }
.logo-item{
  padding:24px; border:1px solid var(--line); border-radius:14px; background:var(--ink-2);
  text-align:center;
}
.logo-placeholder{
  display:block; font-family:'Fraunces', serif; font-weight:500; font-size:1.05rem;
  color:var(--paper); margin-bottom:8px; letter-spacing:0.02em;
}
.logo-desc{
  font-size:0.8rem; color:var(--paper-dim); mono;
}

/* ================= AI SEARCH OPTIMIZATION SECTION ================= */

.ai-search-grid{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; margin-bottom:60px;
}
@media (max-width:860px){ .ai-search-grid{grid-template-columns:1fr; gap:18px;} }

.ai-search-card{
  padding:36px 28px; border:1px solid var(--line); border-radius:16px;
  background:linear-gradient(180deg, var(--ink-3), var(--ink-2));
  transition:border-color .3s, transform .3s;
}
.ai-search-card:hover{ border-color:var(--line-strong); transform:translateY(-4px); }
.ai-search-card .asc-num{
  display:inline-block; width:36px; height:36px; border-radius:50%;
  background:var(--marigold); color:var(--ink); font-weight:600; font-size:1.1rem;
  text-align:center; line-height:36px; margin-bottom:16px;
}
.ai-search-card h3{font-family:'Fraunces', serif; font-weight:500; font-size:1.22rem; margin-bottom:12px;}
.ai-search-card p{font-size:0.92rem; color:var(--paper-dim); line-height:1.65;}

.ai-search-pitch{
  display:grid; grid-template-columns:1.1fr 0.9fr; gap:50px; align-items:start;
  padding:44px; border:1px solid var(--line); border-radius:18px; background:var(--ink-2);
}
@media (max-width:800px){ .ai-search-pitch{grid-template-columns:1fr; gap:32px;} }
.ai-search-pitch h3{font-family:'Fraunces', serif; font-weight:500; font-size:1.35rem; margin-bottom:16px;}
.ai-search-pitch p{color:var(--paper-dim); font-size:0.98rem; line-height:1.7;}
.ai-search-pitch a{ color:var(--marigold); font-weight:600; }

.ai-search-stats{
  display:flex; flex-direction:column; gap:20px;
}
.stat-block{
  padding:22px; border-left:2px solid var(--marigold); background:rgba(232,150,58,0.06);
  border-radius:8px;
}
.stat-num{
  display:block; font-family:'Fraunces', serif; font-weight:500; font-size:1.6rem;
  color:var(--marigold); margin-bottom:6px;
}
.stat-label{
  display:block; font-size:0.85rem; color:var(--paper-dim); line-height:1.55;
}

/* ================= PRODUCTS SECTION ================= */

.products-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
  margin-bottom: 60px;
}
@media (max-width: 960px) {
  .products-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }
}

.product-card {
  padding: 32px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(180deg, var(--ink-3), var(--ink-2));
  transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.product-card:hover {
  border-color: var(--line-strong);
  transform: translateY(-6px);
  box-shadow: 0 12px 32px rgba(232, 150, 58, 0.15);
}

.product-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.product-header h3 {
  font-family: 'Fraunces', serif;
  font-weight: 500;
  font-size: 1.35rem;
  margin: 0;
  color: var(--paper);
}

.badge {
  display: inline-block;
  background: var(--marigold);
  color: var(--ink);
  font-size: 0.75rem;
  font-weight: 600;
  padding: 6px 12px;
  border-radius: 20px;
  white-space: nowrap;
  font-family: 'Inter', sans-serif;
  letter-spacing: 0.5px;
}

.product-desc {
  font-size: 0.95rem;
  line-height: 1.7;
  color: var(--paper-dim);
  margin: 0;
}

.product-meta {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  padding: 16px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

@media (max-width: 480px) {
  .product-meta {
    grid-template-columns: 1fr;
  }
}

.meta-item {
  font-size: 0.85rem;
  color: var(--paper-dim);
}

.meta-item strong {
  display: block;
  font-weight: 600;
  color: var(--marigold);
  font-size: 1.1rem;
  margin-bottom: 2px;
}

.product-link {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--marigold);
  text-decoration: none;
  transition: transform 0.2s;
  display: inline-block;
}

.product-link:hover {
  transform: translateX(4px);
}

.products-cta {
  padding: 48px 40px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(232, 150, 58, 0.08), rgba(63, 140, 130, 0.06));
  text-align: center;
  margin-top: 40px;
}

.products-cta h3 {
  font-family: 'Fraunces', serif;
  font-weight: 500;
  font-size: 1.4rem;
  margin-bottom: 12px;
  color: var(--paper);
}

.products-cta p {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--paper-dim);
  margin-bottom: 24px;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 600px) {
  .products-cta {
    padding: 32px 24px;
  }
  
  .products-cta h3 {
    font-size: 1.2rem;
  }
  
  .products-cta p {
    font-size: 0.95rem;
  }
}

/* ================= SERVICES CARD GRID ================= */

.services-card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-bottom: 60px;
}

@media (max-width: 1200px) {
  .services-card-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
}

@media (max-width: 768px) {
  .services-card-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.service-card-item {
  padding: 32px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(232, 150, 58, 0.05), rgba(63, 140, 130, 0.03));
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  flex-direction: column;
  gap: 20px;
  text-decoration: none;
  color: inherit;
  position: relative;
  overflow: hidden;
}

.service-card-item::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(232, 150, 58, 0.1), transparent);
  transition: left 0.4s ease;
}

.service-card-item:hover {
  border-color: var(--marigold);
  background: linear-gradient(135deg, rgba(232, 150, 58, 0.12), rgba(63, 140, 130, 0.08));
  transform: translateY(-8px);
  box-shadow: 0 16px 40px rgba(232, 150, 58, 0.15);
}

.service-card-item:hover::before {
  left: 100%;
}

.sci-header {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.sci-num {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 2rem;
  font-weight: 600;
  color: var(--marigold);
  min-width: 50px;
  line-height: 1;
}

.sci-header h3 {
  font-family: 'Fraunces', serif;
  font-weight: 500;
  font-size: 1.3rem;
  color: var(--paper);
  margin: 0;
  line-height: 1.3;
}

.sci-desc {
  font-size: 0.95rem;
  line-height: 1.7;
  color: var(--paper-dim);
  margin: 0;
  flex-grow: 1;
}

.sci-arrow {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--marigold);
  display: flex;
  align-items: center;
  gap: 8px;
  transition: transform 0.3s ease;
}

.service-card-item:hover .sci-arrow {
  transform: translateX(4px);
}

/* Callout CTA styling */
.callout {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 40px;
  align-items: center;
  padding: 48px 40px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(135deg, var(--ink-3), var(--ink-2));
  margin-top: 40px;
}

.callout > div:first-child .eyebrow {
  color: var(--seafoam);
}

.callout > div:first-child .eyebrow::before {
  background: var(--seafoam);
}

.callout h2 {
  color: var(--paper);
  font-family: 'Fraunces', serif;
  font-weight: 500;
  font-size: 1.8rem;
  margin-bottom: 12px;
}

.callout p {
  color: var(--paper-dim);
  font-size: 1rem;
  line-height: 1.7;
  margin: 16px 0 0 0;
}

.callout-tags {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

@media (max-width: 900px) {
  .callout {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .callout-tags {
    justify-content: flex-start;
  }

  .callout h2 {
    font-size: 1.5rem;
  }
}

@media (max-width: 600px) {
  .service-card-item {
    padding: 24px;
    gap: 16px;
  }

  .sci-num {
    font-size: 1.6rem;
    min-width: 40px;
  }

  .sci-header h3 {
    font-size: 1.1rem;
  }

  .sci-desc {
    font-size: 0.9rem;
  }

  .callout {
    padding: 32px 24px;
  }

  .callout h2 {
    font-size: 1.3rem;
  }

  .callout p {
    font-size: 0.95rem;
  }
}

/* ===================================================
   HOMEPAGE REDESIGN — clean layout
   =================================================== */

/* Section spacing */
.home-section {
  padding: 100px 0;
}
.home-section--alt {
  background: var(--ink-2);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
@media (max-width:768px) {
  .home-section { padding: 64px 0; }
}

/* Hero text column */
.hero-text { max-width: 580px; }
.hero h1 em { font-style: italic; color: var(--marigold); }

/* ---- PRODUCT CARDS (2-col) ---- */
.products-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-bottom: 0;
}
@media (max-width: 900px) { .products-grid { grid-template-columns: 1fr; } }

.product-card {
  padding: 32px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--ink-2);
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: border-color .3s, transform .3s, box-shadow .3s;
}
.product-card:hover {
  border-color: var(--line-strong);
  transform: translateY(-5px);
  box-shadow: 0 16px 48px rgba(0,0,0,0.3);
}

.pc-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.pc-tag {
  font-size: 0.75rem;
  font-weight: 600;
  padding: 5px 12px;
  border-radius: 20px;
  letter-spacing: 0.4px;
}
.pc-link {
  font-size: 0.82rem;
  color: var(--paper-dim);
  font-family: 'IBM Plex Mono', monospace;
  transition: color .2s;
}
.pc-link:hover { color: var(--marigold); }

.product-card h3 {
  font-family: 'Fraunces', serif;
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--paper);
}
.product-card p {
  font-size: 0.94rem;
  line-height: 1.7;
  color: var(--paper-dim);
  flex-grow: 1;
}
.pc-stats {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  margin-top: 4px;
}
.pc-stats span {
  font-size: 0.83rem;
  color: var(--paper-dim);
}
.pc-stats strong {
  display: block;
  font-size: 1rem;
  font-weight: 600;
  color: var(--paper);
  margin-bottom: 2px;
}

/* ---- AI SEARCH STEPS ---- */
.ai-search-steps {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 40px;
}
.ai-step {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 0;
  padding: 32px 36px;
  border-bottom: 1px solid var(--line);
  align-items: flex-start;
  transition: background .25s;
}
.ai-step:last-child { border-bottom: none; }
.ai-step:hover { background: rgba(232,150,58,0.05); }

.ai-step-num {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 2.2rem;
  font-weight: 600;
  color: var(--marigold);
  opacity: 0.5;
  line-height: 1;
  padding-top: 4px;
}
.ai-step h3 {
  font-family: 'Fraunces', serif;
  font-size: 1.2rem;
  font-weight: 500;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.ai-price {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.8rem;
  font-weight: 400;
  color: var(--marigold);
  background: var(--marigold-soft);
  padding: 3px 10px;
  border-radius: 20px;
}
.ai-step p {
  font-size: 0.95rem;
  line-height: 1.7;
  color: var(--paper-dim);
}
@media (max-width: 600px) {
  .ai-step { grid-template-columns: 50px 1fr; padding: 24px 20px; }
  .ai-step-num { font-size: 1.6rem; }
}

.ai-search-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
  padding: 36px 40px;
  border: 1px solid var(--marigold);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(232,150,58,0.08), transparent);
}
.ai-stat-row {
  display: flex;
  gap: 40px;
  flex-wrap: wrap;
}
.ai-stat {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ai-stat-num {
  font-family: 'Fraunces', serif;
  font-size: 1.7rem;
  font-weight: 500;
  color: var(--marigold);
  line-height: 1;
}
.ai-stat-lbl {
  font-size: 0.82rem;
  color: var(--paper-dim);
  max-width: 120px;
  line-height: 1.4;
}
@media (max-width: 768px) {
  .ai-search-cta { flex-direction: column; align-items: flex-start; padding: 24px; }
  .ai-stat-row { gap: 24px; }
}

/* ---- SERVICES INLINE CTA ---- */
.home-cta-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  margin-top: 48px;
  padding: 36px 40px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--ink-2);
  flex-wrap: wrap;
}
.home-cta-bar h3 {
  font-family: 'Fraunces', serif;
  font-weight: 500;
  font-size: 1.3rem;
  margin-bottom: 6px;
}
.home-cta-bar p {
  font-size: 0.95rem;
  color: var(--paper-dim);
  line-height: 1.6;
}
@media (max-width: 768px) {
  .home-cta-bar { flex-direction: column; align-items: flex-start; padding: 24px; }
}

/* ---- FINAL CTA ---- */
.final-cta {
  text-align: center;
  max-width: 620px;
  margin: 0 auto;
}
.final-cta h2 {
  font-family: 'Fraunces', serif;
  font-size: 2.8rem;
  font-weight: 400;
  margin: 16px 0 20px;
  line-height: 1.2;
}
.final-cta p {
  font-size: 1.05rem;
  color: var(--paper-dim);
  line-height: 1.7;
  margin-bottom: 36px;
}
@media (max-width: 600px) { .final-cta h2 { font-size: 2rem; } }

/* Service card grid — already defined, just reuse */
.services-card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 0;
}
@media (max-width: 1100px) { .services-card-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 680px)  { .services-card-grid { grid-template-columns: 1fr; } }

/* ===================================================
   SERVICE PAGE
   =================================================== */

/* Quick-jump pills */
.svc-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 32px 32px 0;
  margin-bottom: 0;
}
.svc-pill {
  font-size: 0.82rem;
  font-family: 'IBM Plex Mono', monospace;
  padding: 8px 16px;
  border: 1px solid var(--line);
  border-radius: 24px;
  color: var(--paper-dim);
  transition: border-color .2s, color .2s, background .2s;
  white-space: nowrap;
}
.svc-pill:hover {
  border-color: var(--marigold);
  color: var(--marigold);
  background: var(--marigold-soft);
}

/* Service section — two-col layout */
.svc-section {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 56px;
  padding: 80px 32px;
  border-top: 1px solid var(--line);
  max-width: 1200px;
  margin: 0 auto;
}
.svc-section--alt { background: var(--ink-2); max-width: 100%; padding: 80px 0; }
.svc-section--alt.wrap { max-width: 1200px; background: transparent; }
/* target alt sections properly */
section.svc-section--alt > .wrap { max-width:1200px; margin:0 auto; padding:0 32px; }

@media (max-width: 860px) {
  .svc-section { grid-template-columns: 1fr; gap: 24px; }
  .svc-num-col { display: none; }
}

.svc-big-num {
  font-size: 4rem;
  font-weight: 600;
  color: var(--marigold);
  opacity: 0.2;
  line-height: 1;
  padding-top: 8px;
}

.svc-tag {
  display: inline-block;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  padding: 6px 14px;
  border-radius: 20px;
  background: var(--seafoam-soft);
  color: var(--seafoam);
  margin-bottom: 20px;
}

.svc-content-col h2 {
  font-family: 'Fraunces', serif;
  font-size: 2rem;
  font-weight: 400;
  line-height: 1.25;
  margin-bottom: 20px;
  color: var(--paper);
}
@media (max-width: 600px) { .svc-content-col h2 { font-size: 1.5rem; } }

.svc-lead {
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--paper-dim);
  margin-bottom: 36px;
  max-width: 640px;
}

.svc-what h3 {
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--paper-dim);
  margin-bottom: 16px;
}

.svc-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 32px;
}
.svc-list li {
  font-size: 0.96rem;
  line-height: 1.6;
  color: var(--paper-dim);
  padding-left: 20px;
  position: relative;
}
.svc-list li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--marigold);
  font-size: 0.85rem;
}
.svc-list li strong { color: var(--paper); }

/* Proof cards */
.svc-proof-cards { margin-bottom: 28px; }
.svc-proof {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 24px;
  background: var(--ink-3);
}
.svc-proof-label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--seafoam);
  margin-bottom: 14px;
}
.svc-proof-list {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 8px 16px;
  align-items: baseline;
  padding: 8px 0;
  border-top: 1px solid var(--line);
  font-size: 0.9rem;
}
.svc-proof-list:first-of-type { border-top: none; padding-top: 0; }
.svc-proof-list a {
  color: var(--marigold);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.85rem;
  font-weight: 500;
  transition: opacity .2s;
}
.svc-proof-list a:hover { opacity: 0.75; }
.svc-proof-list span { color: var(--paper-dim); line-height: 1.5; }

/* Tech stack tags */
.svc-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 32px;
}
.svc-stack span {
  font-size: 0.78rem;
  padding: 5px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--paper-dim);
  background: var(--ink-3);
}

/* AI stats row on service 06 */
.svc-ai-stats {
  display: flex;
  gap: 32px;
  flex-wrap: wrap;
  margin-bottom: 28px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(232,150,58,0.06);
}

.svc-cta { margin-top: 8px; display: inline-block; }

/* ===================================================
   WHATSAPP BUTTON + FLOATING BUBBLE
   =================================================== */

.btn-whatsapp {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 13px 22px;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 600;
  background: #25D366;
  color: #fff;
  text-decoration: none;
  transition: background .2s, transform .2s, box-shadow .2s;
  white-space: nowrap;
}
.btn-whatsapp:hover {
  background: #1ebe5d;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(37, 211, 102, 0.35);
}
.btn-whatsapp svg { flex-shrink: 0; }

/* Floating WhatsApp bubble — always visible */
.wa-float {
  position: fixed;
  bottom: 28px;
  right: 28px;
  z-index: 999;
  display: flex;
  align-items: center;
  gap: 10px;
  background: #25D366;
  color: #fff;
  padding: 14px 20px;
  border-radius: 50px;
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 6px 24px rgba(37,211,102,0.45);
  transition: all .25s cubic-bezier(.4,0,.2,1);
  max-width: 200px;
  overflow: hidden;
}
.wa-float:hover {
  background: #1ebe5d;
  box-shadow: 0 10px 32px rgba(37,211,102,0.55);
  transform: translateY(-3px);
}
.wa-float svg { flex-shrink: 0; }
.wa-float-text { white-space: nowrap; }

@media (max-width: 600px) {
  .wa-float { bottom: 20px; right: 16px; padding: 13px 16px; }
  .wa-float-text { display: none; }
  .wa-float { border-radius: 50%; width: 52px; height: 52px; padding: 0; justify-content: center; max-width: 52px; }
}

/* ===================================================
   SITEMAP PAGE
   =================================================== */
.sitemap-body {
  padding: 40px 32px 100px;
  display: flex;
  flex-direction: column;
  gap: 56px;
}
.sm-group h2 {
  font-family: 'Fraunces', serif;
  font-size: 1.3rem;
  font-weight: 500;
  color: var(--paper);
  margin-bottom: 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.sm-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.sm-list li {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 16px;
  align-items: baseline;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  font-size: 0.95rem;
}
.sm-list li:last-child { border-bottom: none; }
.sm-list a {
  color: var(--marigold);
  font-weight: 500;
  transition: opacity .2s;
}
.sm-list a:hover { opacity: 0.75; }
.sm-list span { color: var(--paper-dim); line-height: 1.6; }
@media (max-width: 600px) {
  .sm-list li { grid-template-columns: 1fr; gap: 4px; }
}

/* ===================================================
   FAQ PAGE
   =================================================== */
.faq-body {
  padding: 20px 32px 100px;
  display: flex;
  flex-direction: column;
  gap: 64px;
}

.faq-group-title {
  font-family: 'Fraunces', serif;
  font-size: 1.1rem;
  font-weight: 500;
  color: var(--seafoam);
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 0.85rem;
  margin-bottom: 8px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.faq-item {
  border-bottom: 1px solid var(--line);
}

.faq-q {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding: 22px 0;
  background: none;
  border: none;
  color: var(--paper);
  font-family: 'Inter', sans-serif;
  font-size: 1.05rem;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  transition: color .2s;
  line-height: 1.4;
}
.faq-q:hover { color: var(--marigold); }
.faq-item.open .faq-q { color: var(--marigold); }

.faq-icon {
  font-size: 1.4rem;
  font-weight: 300;
  color: var(--marigold);
  flex-shrink: 0;
  line-height: 1;
  width: 24px;
  text-align: center;
  transition: transform .25s;
}
.faq-item.open .faq-icon { transform: rotate(45deg); }

.faq-a {
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s cubic-bezier(.4,0,.2,1);
}
.faq-a p, .faq-a ul {
  padding-bottom: 24px;
  font-size: 0.97rem;
  line-height: 1.75;
  color: var(--paper-dim);
}
.faq-a p + p { padding-top: 0; padding-bottom: 16px; }
.faq-a ul {
  list-style: none;
  padding-left: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-bottom: 16px;
}
.faq-a ul li {
  padding-left: 18px;
  position: relative;
}
.faq-a ul li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--marigold);
  font-size: 0.85rem;
}
.faq-a a { color: var(--marigold); }
.faq-a strong { color: var(--paper); font-weight: 600; }

.faq-cta {
  padding: 48px 40px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--ink-2);
  text-align: center;
}
.faq-cta h2 {
  font-family: 'Fraunces', serif;
  font-size: 1.8rem;
  font-weight: 400;
  margin-bottom: 12px;
}
.faq-cta p {
  color: var(--paper-dim);
  font-size: 1rem;
  margin-bottom: 28px;
}
.faq-cta .hero-ctas { justify-content: center; }
@media (max-width: 600px) {
  .faq-cta { padding: 32px 24px; }
  .faq-cta h2 { font-size: 1.4rem; }
}
