/* Shared stylesheet for the 23 blog articles. Extracted 16 Sept 2026 from the
   identical inline <style> block each page carried. Edit here, not per page. */
:root{
    --white:#ffffff;
    --cream:#f7f1e4;
    --ink:#14120e;
    --ink-soft:rgba(20,18,14,0.6);
    --ink-faint:rgba(20,18,14,0.42);
    --line:rgba(20,18,14,0.1);
    --gold:#c9922f;            /* graphics only - 2.75:1 on white, fails AA for text */
    --gold-text:#946a1a;        /* text-safe gold - 4.84:1 on white */
    --gold-bright:#e8b65c;
    --gold-tint:#fbf0d8;
    --display:'Newsreader',Georgia,'Times New Roman',serif;
    --sans:'Inter',sans-serif;
    --mono:'IBM Plex Mono',monospace;
    --maxw:1200px;
    --radius:20px;
  }
  *{box-sizing:border-box;}
  body{margin:0;background:var(--white);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;}
  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 40px;}
  ::selection{background:var(--gold-bright);color:var(--ink);}
  :focus-visible{outline:2px solid var(--gold);outline-offset:3px;}
  h1,h2,h3{font-family:var(--display);font-weight:600;margin:0;letter-spacing:-0.02em;}

  .chip{display:inline-flex;align-items:center;gap:8px;background:var(--gold-tint);color:var(--gold-text);
    font-size:12px;font-weight:700;letter-spacing:0.02em;padding:8px 16px;border-radius:100px;margin-bottom:22px;}
  .chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);}
  .eyebrow{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:14px;font-weight:500;line-height:1.3;
    letter-spacing:0.16em;text-transform:uppercase;color:var(--gold-text);margin-bottom:18px;}
  .eyebrow::before{content:"";width:26px;height:1px;background:var(--gold);}
  .section-head.center{margin-left:auto;margin-right:auto;text-align:center;}
  .section-head.center .eyebrow{justify-content:center;}

  header.nav{position:relative;z-index:100;padding:18px 12px 0;}
  .navtoggle{display:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);
    background:none;padding:0;cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:4px;}
  .navtoggle span{display:block;width:17px;height:1.5px;background:var(--ink);border-radius:2px;transition:transform .25s ease,opacity .2s ease;}
  .navrow.is-open .navtoggle span:nth-child(1){transform:translateY(5.5px) rotate(45deg);}
  .navrow.is-open .navtoggle span:nth-child(2){opacity:0;}
  .navrow.is-open .navtoggle span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg);}
  .navrow{position:relative;max-width:calc(var(--maxw) + 140px);margin:0 auto;padding:14px 26px;display:flex;align-items:center;justify-content:space-between;
    background:rgba(255,255,255,0.92);backdrop-filter:blur(8px);border-radius:100px;box-shadow:0 10px 30px -18px rgba(20,18,14,0.25);}
  .wordmark{font-family:var(--display);font-weight:700;font-size:23px;line-height:1.25;letter-spacing:0;display:flex;align-items:center;gap:10px;}
  .wordmark b{color:var(--gold);}
  .wordmark .logomark{height:28px;width:auto;display:block;}
  .wordmark .logomark svg{height:100%;width:auto;display:block;}
  nav.links{display:flex;gap:30px;}
  nav.links a{font-size:16px;font-weight:600;color:var(--ink-soft);transition:color .22s ease-out;}
  nav.links a:hover{color:var(--ink);}
  .navicons{display:flex;align-items:center;gap:10px;}
  .navicon{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:14px;flex:none;transition:background .22s ease-out,border-color .22s ease-out;}
  .navicon:hover{background:var(--cream);border-color:var(--ink);}
  .navcta{font-size:16px;line-height:1;font-weight:700;background:var(--ink);color:var(--white);padding:11px 22px;border-radius:100px;transition:background .22s ease-out;}
  .navcta:hover{background:var(--gold-text);}

  .btn{display:inline-flex;align-items:center;gap:8px;font-size:14px;line-height:1;font-weight:700;padding:17px 30px;border-radius:100px;transition:transform .22s ease-out,box-shadow .22s ease-out;}
  .btn-solid{background:var(--ink);color:var(--white);}
  .btn-solid:hover{transform:translateY(-2px);box-shadow:0 14px 26px -10px rgba(20,18,14,0.4);}
  .btn-ghost{background:var(--white);color:var(--ink);border:1.5px solid var(--line);transition:border-color .22s ease-out;}
  .btn-ghost:hover{border-color:var(--ink);}

  /* HERO — full-bleed, oversized headline with two tilted, layered phones */
  .hero{background:linear-gradient(158deg,#b6996c 0%,#8d7a5f 20%,#6b5a42 42%,#453d34 66%,#241d16 88%,var(--ink) 100%);
    border-radius:0 0 40px 40px;margin-top:22px;min-height:880px;
    position:relative;overflow:hidden;display:flex;align-items:center;}
  .hero::before{content:"";position:absolute;inset:0;opacity:0.8;
    background:radial-gradient(circle at 82% 22%,rgba(232,182,92,0.42),transparent 46%),
      radial-gradient(circle at 6% 96%,rgba(232,182,92,0.16),transparent 55%),
      radial-gradient(circle at 58% 105%,rgba(0,0,0,0.4),transparent 58%);}
  .hero-phones{position:absolute;inset:0;z-index:0;pointer-events:none;}
  .hero-phone{position:absolute;width:250px;}
  .hero-phone.phone-a{top:130px;right:160px;width:380px;z-index:2;transform:rotate(8deg);
    filter:drop-shadow(-32px 42px 60px rgba(0,0,0,0.55));animation:heroPhoneFloat 6s ease-in-out infinite;}
  @keyframes heroPhoneFloat{
    0%,100%{transform:rotate(8deg) translateY(0);}
    50%{transform:rotate(9deg) translateY(-16px);}
  }
  @media(prefers-reduced-motion:reduce){
    .hero-phone.phone-a{animation:none;}
  }
  .hero-phone-frame{position:relative;z-index:2;width:100%;display:block;pointer-events:none;}
  .ps-badge-check{background:radial-gradient(circle,#181510 0%,#0a0908 100%);}
  .ps-badge-check svg{width:34px;height:34px;}
  .phone-screen{position:absolute;left:9.78%;top:3.97%;width:77.45%;height:91.91%;
    border-radius:34px 34px 44px 44px;overflow:hidden;background:linear-gradient(160deg,#1c1a16 0%,#0d0c0a 70%);
    z-index:1;display:flex;flex-direction:column;align-items:center;padding:50px 15px 20px;box-sizing:border-box;}
  .ps-tabs{display:flex;gap:7px;align-self:flex-start;margin-left:1px;}
  .ps-tab{font-family:var(--sans);font-size:12px;line-height:1.3;letter-spacing:0;font-weight:600;padding:6px 12px;border-radius:20px;color:rgba(255,255,255,0.55);}
  .ps-tab.active{background:var(--white);color:var(--ink);}
  .ps-label{color:var(--white);font-family:var(--sans);font-size:16px;line-height:1.2;font-weight:600;margin-top:36px;letter-spacing:0;}
  .ps-scan{position:relative;width:152px;height:152px;margin-top:24px;display:flex;align-items:center;justify-content:center;flex:none;}
  .ps-scan-ring{position:absolute;inset:0;border-radius:50%;border:2px solid var(--gold);opacity:0;animation:psPulse 2.4s ease-out infinite;}
  .ps-scan-ring.r2{animation-delay:0.8s;}
  .ps-scan-ring.r3{animation-delay:1.6s;}
  @keyframes psPulse{0%{transform:scale(0.62);opacity:0.7;}100%{transform:scale(1.5);opacity:0;}}
  .ps-scan-badge{position:relative;width:100px;height:100px;border-radius:50%;background:radial-gradient(circle,#181510 0%,#0a0908 100%);
    display:flex;align-items:center;justify-content:center;box-shadow:0 0 22px rgba(217,176,106,0.4);overflow:hidden;}
  .ps-scan-badge svg{width:58px;height:58px;position:relative;z-index:1;}
  .ps-sweep{position:absolute;inset:-2px;border-radius:50%;
    background:conic-gradient(from 0deg, transparent 0%, rgba(217,176,106,0.8) 12%, transparent 26%);
    animation:psSpin 2.2s linear infinite;}
  @keyframes psSpin{to{transform:rotate(360deg);}}
  .ps-card{margin-top:auto;width:100%;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);
    border-radius:14px;padding:11px 14px;box-sizing:border-box;}
  .ps-card b{display:block;color:rgba(255,255,255,0.5);font-size:11px;line-height:1.3;font-weight:600;text-transform:uppercase;letter-spacing:0.16em;}
  .ps-card span{display:block;color:var(--white);font-size:12px;line-height:1.3;letter-spacing:0;font-family:var(--sans);margin-top:3px;}
  .ps-catalog{margin-top:11px;width:100%;text-align:center;background:var(--white);color:var(--ink);font-size:13px;line-height:1;font-weight:600;
    border-radius:20px;padding:11px 0;font-family:var(--sans);box-sizing:border-box;}
  .hero-scrim{position:absolute;inset:0;z-index:1;pointer-events:none;
    background:linear-gradient(102deg,rgba(10,8,5,0.62) 0%,rgba(10,8,5,0.24) 48%,transparent 70%);}
  .hero-content{position:relative;z-index:2;text-align:left;max-width:820px;padding:0 40px 0 100px;}
  .hero-content .eyebrow{margin-bottom:0;}
  .hero h1{color:var(--white);font-family:var(--display);font-weight:600;font-size:116px;line-height:0.94;
    letter-spacing:-0.02em;text-shadow:0 10px 40px rgba(0,0,0,0.55);margin:20px 0 0;max-width:820px;}
  .hero p.lead{margin:26px 0 0;max-width:500px;font-size:18px;line-height:1.6;letter-spacing:0;color:rgba(255,255,255,0.85);text-align:left;
    text-shadow:0 2px 12px rgba(0,0,0,0.4);}
  .hero-stats{display:flex;gap:30px;margin-top:32px;max-width:560px;}
  .hero-stats div{flex:1;padding-left:18px;border-left:1.5px solid rgba(255,255,255,0.25);}
  .hero-stats b{display:block;font-family:var(--display);font-size:34px;line-height:1.1;letter-spacing:-0.01em;font-weight:700;color:var(--gold-bright);}
  .hero-stats span{display:block;margin-top:6px;font-size:12px;line-height:1.4;letter-spacing:0;color:rgba(255,255,255,0.65);}
  .hero-ctas{display:flex;gap:14px;justify-content:flex-start;margin-top:32px;}
  .hero-ctas .btn-ghost{background:transparent;border-color:rgba(255,255,255,0.5);color:var(--white);}
  .hero-ctas .btn-ghost:hover{border-color:var(--white);}
  .hero-ctas .btn-solid{background:var(--white);color:var(--ink);}
  .hero-ctas .btn-solid:hover{background:var(--gold-bright);}


  .statband{margin-top:70px;background:var(--ink);border-radius:28px;padding:44px 48px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
  .statband div{color:var(--white);}
  .statband b{font-family:var(--display);font-size:38px;font-weight:700;color:var(--gold-bright);display:block;}
  .statband span{display:block;margin-top:8px;font-size:13px;color:rgba(255,255,255,0.6);}

  .trustedby{background:var(--white);padding:52px 0;display:flex;align-items:center;justify-content:center;gap:38px;opacity:0;transform:translateY(20px);transition:opacity .3s ease-out,transform .3s ease-out;}
  .trustedby.is-visible{opacity:1;transform:translateY(0);}
  .trustedby span{font-size:34px;font-weight:600;color:var(--ink);font-family:var(--display);}
  .trustedby .logo{display:flex;align-items:center;}
  .trustedby .logo img{height:54px;width:auto;display:block;}

  section{padding:64px 0;}
  .section-head{max-width:860px;margin:0 auto 56px;text-align:center;opacity:0;transform:translateY(20px);transition:opacity .3s ease-out,transform .3s ease-out;}
  .section-head.is-visible{opacity:1;transform:translateY(0);}
  .section-head h2{font-size:52px;line-height:1.15;font-family:var(--display);font-weight:600;letter-spacing:-0.01em;}
  .section-head p{margin-top:18px;color:var(--ink-soft);font-size:16px;line-height:1.6;letter-spacing:0;}

  .wcugrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
  .wcubox{background:var(--cream);border-radius:var(--radius);padding:30px 28px;display:flex;flex-direction:column;gap:16px;transition:transform .2s;}
  .wcubox:hover{transform:translateY(-4px);}
  .wcubox .ic{width:46px;height:46px;border-radius:14px;background:var(--white);display:flex;align-items:center;justify-content:center;}
  .wcubox img{width:26px;height:auto;}
  .wcubox h3{font-size:18px;line-height:1.3;letter-spacing:0;font-weight:700;}
  .wcubox p{margin:0;color:var(--ink-soft);font-size:14px;line-height:1.6;}

  .indgrid{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:4px;scrollbar-width:none;}
  .indgrid::-webkit-scrollbar{display:none;}
  .indcard{position:relative;border-radius:18px;overflow:hidden;flex:0 0 260px;aspect-ratio:3/3.6;scroll-snap-align:start;
    background-size:cover;background-position:center;opacity:0;transform:translateY(20px);transition:opacity .3s ease-out,transform .3s ease-out;}
  .indcard.is-visible{opacity:1;transform:translateY(0);transition-delay:0ms !important;}
  .indcard:hover{transform:translateY(-5px);}
  .indcard:nth-child(1){transition-delay:0ms;}
  .indcard:nth-child(2){transition-delay:60ms;}
  .indcard:nth-child(3){transition-delay:120ms;}
  .indcard:nth-child(4){transition-delay:180ms;}
  .indcard:nth-child(5){transition-delay:240ms;}
  .indcard:nth-child(6){transition-delay:300ms;}
  .indcard::after{content:"";position:absolute;inset:0;
    background:linear-gradient(to top, rgba(10,9,7,0.9) 0%, rgba(10,9,7,0.4) 45%, transparent 72%);}
  .indcard .txt{position:absolute;left:0;right:0;bottom:0;padding:22px 22px 24px;z-index:1;}
  .indcard h3{color:var(--white);font-size:20px;line-height:1.25;letter-spacing:0;font-family:var(--display);font-weight:600;}
  .indcard p{margin:8px 0 0;color:rgba(255,255,255,0.75);font-size:13px;line-height:1.45;letter-spacing:0;}
  .indnav{display:flex;align-items:center;gap:16px;margin-top:22px;}
  .indnav .arrow{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--ink-soft);flex:none;cursor:pointer;transition:background .22s ease-out,border-color .22s ease-out,color .22s ease-out;}
  .indnav .arrow:hover{background:var(--ink);border-color:var(--ink);color:var(--white);}
  .indnav .track{flex:1;height:1px;background:var(--line);position:relative;}

  .blogrow{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;background:var(--white);}
  .blogcard{background:var(--white);padding:28px 0 0;border-top:1px solid var(--line);opacity:0;transform:translateY(20px);transition:opacity .3s ease-out,transform .28s ease-out;}
  .blogcard.is-visible{opacity:1;transform:translateY(0);transition-delay:0ms !important;}
  .blogcard:nth-child(1){transition-delay:0ms;}
  .blogcard:nth-child(2){transition-delay:80ms;}
  .blogcard:nth-child(3){transition-delay:160ms;}
  .blogcard h3{font-size:18px;font-weight:600;line-height:1.3;letter-spacing:0;transition:color .22s ease-out;}
  .blogcard{display:block;cursor:pointer;}
  .blogcard:hover h3{color:var(--gold-text);}
  .blogcard .photo{margin-top:20px;border-radius:3px;overflow:hidden;aspect-ratio:4/3;}
  .blogcard .photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease-out;}
  .blogcard:hover .photo img{transform:scale(1.04);}
  .blogcard .blogdate{margin-top:10px;font-family:var(--mono);font-size:12px;line-height:1.3;letter-spacing:0.16em;text-transform:uppercase;color:var(--ink-soft);}

  .ctaband{position:relative;overflow:hidden;background:var(--ink);border-radius:32px;margin:0 40px;display:flex;align-items:stretch;min-height:380px;opacity:0;transform:translateY(20px);transition:opacity .3s ease-out,transform .3s ease-out;}
  .ctaband.is-visible{opacity:1;transform:translateY(0);}
  .ctaband-icon{position:relative;flex:1 1 42%;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(circle at 30% 50%,#3a352c 0%,#0d0c0a 75%);}
  .ctaband-icon svg{width:105%;height:105%;opacity:0.92;flex:none;}
  .ctaband-card{flex:1 1 58%;background:#161310;padding:40px 48px;display:flex;flex-direction:column;justify-content:center;}
  .cta-tag{display:inline-block;align-self:flex-start;border:1px solid var(--gold);color:var(--gold-bright);font-family:var(--mono);font-size:12px;line-height:1.3;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;padding:6px 14px;border-radius:4px;margin-bottom:16px;}
  .ctaband h2{font-size:52px;max-width:none;margin:0;font-family:var(--display);font-weight:600;letter-spacing:-0.01em;color:var(--white);text-align:left;line-height:1.15;}
  .ctaband p{color:rgba(255,255,255,0.62);max-width:460px;margin:12px 0 20px;font-size:14px;line-height:1.6;letter-spacing:0;text-align:left;}
  .cta-field{display:flex;flex-direction:column;gap:5px;}
  .cta-field label{font-size:12px;line-height:1.3;letter-spacing:0.02em;color:rgba(255,255,255,0.72);}
  .cta-form select{background:rgba(0,0,0,0.5);border:1px solid rgba(255,255,255,0.14);border-radius:9px;
    padding:10px 14px;color:var(--white);font-family:var(--sans);font-size:13.5px;box-sizing:border-box;}
  .cta-form select:focus{outline:none;border-color:var(--gold-bright);}
  .cta-form option{color:var(--ink);}
  .cta-form{display:flex;flex-direction:column;gap:10px;max-width:460px;}
  .cta-form input,.cta-form textarea{background:rgba(0,0,0,0.5);border:1px solid rgba(255,255,255,0.14);border-radius:9px;padding:10px 14px;color:var(--white);font-family:var(--sans);font-size:13.5px;resize:vertical;box-sizing:border-box;}
  .cta-form input::placeholder,.cta-form textarea::placeholder{color:rgba(255,255,255,0.4);}
  .cta-form input:focus,.cta-form textarea:focus{outline:none;border-color:var(--gold-bright);}
  .cta-submit{align-self:flex-start;background:var(--gold-bright);color:var(--ink);border:none;margin-top:4px;cursor:pointer;font-family:var(--sans);}
  .cta-submit:hover{background:var(--gold);}

  footer{padding:70px 0 34px;}
  .footgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-bottom:44px;opacity:0;transform:translateY(20px);transition:opacity .3s ease-out,transform .3s ease-out;}
  .footgrid.is-visible{opacity:1;transform:translateY(0);}
  .footgrid h3{font-size:12px;line-height:1.3;letter-spacing:0;font-weight:700;margin:0 0 16px;}
  .footgrid p,.footgrid li{color:var(--ink-soft);font-size:14px;line-height:1.6;letter-spacing:0;}
  .footgrid ul{list-style:none;padding:0;margin:0;}
  .footgrid ul a{transition:color .22s ease-out;}
  .footgrid ul a:hover{color:var(--ink);}
  .footbottom{padding-top:24px;border-top:1px solid var(--line);font-size:12px;line-height:1.3;letter-spacing:0;color:var(--ink-soft);display:flex;justify-content:space-between;}

  @media(max-width:900px){
    section{padding:48px 0;}
    .hero-grid{grid-template-columns:1fr;}
    .wcugrid,.indgrid,.blogrow,.statband,.footgrid{grid-template-columns:1fr;}
    nav.links{display:none;}
    .navtoggle{display:inline-flex;}
    .navrow.is-open nav.links{display:flex;flex-direction:column;gap:16px;
      position:absolute;top:calc(100% + 10px);left:8px;right:8px;z-index:60;
      background:var(--white);border:1px solid var(--line);border-radius:16px;
      padding:20px 22px;box-shadow:0 24px 48px -24px rgba(20,18,14,0.35);}
    .navcta{font-size:14px;padding:10px 16px;}
    .hero h1{font-size:44px;line-height:1.1;}
    .section-head h2{font-size:32px;}
    .ctaband h2{font-size:32px;}
    .ctaband{margin:0 16px;flex-direction:column;min-height:auto;}
    .ctaband-icon{flex:none;height:140px;}
    .ctaband-card{padding:28px 24px;}
  }

  .wcu-watermark{position:absolute;top:4%;bottom:4%;right:-12%;width:64%;max-width:860px;opacity:0.09;pointer-events:none;z-index:0;}
  .wcu-watermark svg{width:100%;height:100%;display:block;}
  .wcu2-list{padding:6px 0 10px;position:relative;z-index:1;}
  .wcu2-row{padding:28px 0;opacity:0;transform:translateY(20px);transition:opacity .3s ease-out,transform .3s ease-out;}
  .wcu2-row.is-visible{opacity:1;transform:translateY(0);}
  .wcu2-row:nth-child(1){transition-delay:0ms;}
  .wcu2-row:nth-child(2){transition-delay:40ms;}
  .wcu2-row:nth-child(3){transition-delay:80ms;}
  .wcu2-row:nth-child(4){transition-delay:120ms;}
  .wcu2-row:nth-child(5){transition-delay:160ms;}
  .wcu2-row:nth-child(6){transition-delay:200ms;}
  .wcu2-head{all:unset;box-sizing:border-box;display:grid;grid-template-columns:240px 1fr 240px 18px;align-items:center;column-gap:20px;width:100%;padding:8px 20px;border-radius:18px;cursor:pointer;transition:background .3s,box-shadow .3s,padding .3s;}
  .wcu2-row:not(.is-active) .wcu2-head:hover{background:rgba(20,18,14,0.035);}
  .wcu2-row.is-active .wcu2-head{background:var(--white);box-shadow:0 24px 48px -24px rgba(20,18,14,0.28),0 1px 0 rgba(20,18,14,0.04);padding:24px 26px;}
  .wcu2-ic{width:72px;height:72px;border-radius:16px;background:var(--gold-tint);display:flex;align-items:center;justify-content:center;opacity:0;overflow:hidden;transition:opacity .3s;justify-self:end;}
  .wcu2-row.is-active .wcu2-ic{opacity:1;}
  .wcu2-ic img{width:42px;height:auto;flex:none;}
  .wcu2-title{display:flex;align-items:baseline;justify-content:center;gap:14px;}
  .wcu2-num{font-family:var(--display);font-size:12px;line-height:1.3;letter-spacing:0;color:var(--ink-soft);flex:none;}
  .wcu2-row h3{font-family:var(--display);font-size:52px;font-weight:600;color:var(--ink-soft);transition:color .3s;text-align:center;letter-spacing:-0.01em;line-height:1;white-space:nowrap;}
  .wcu2-row.is-active h3{color:var(--ink);}
  .wcu2-desc{text-align:center;color:var(--ink-soft);font-size:14px;line-height:1.5;letter-spacing:0;opacity:0;transition:opacity .3s ease;}
  .wcu2-row.is-active .wcu2-desc{opacity:1;}
  .wcu2-arrow{width:18px;height:18px;color:var(--ink-faint);opacity:0.5;transition:transform .3s,color .3s,opacity .3s;}
  .wcu2-row.is-active .wcu2-arrow{transform:rotate(90deg);color:var(--gold);opacity:1;}
  @media(max-width:900px){
    .wcu2-head{grid-template-columns:48px 1fr;row-gap:10px;padding:14px 10px;}
    .wcu2-row.is-active .wcu2-head{padding:18px 16px;}
    .wcu2-ic{width:48px;height:48px;border-radius:12px;}
    .wcu2-ic img{width:28px;}
    .wcu2-row h3{font-size:28px;white-space:normal;}
    .wcu2-desc{grid-column:1 / -1;}
    .wcu2-arrow{display:none;}
  }
@media(prefers-reduced-motion:reduce){
    .trustedby,.section-head,.indcard,.blogcard,.wcu2-row,.ctaband,.footgrid,.blogpost-hero,.blogpost-body{transition:none!important;opacity:1!important;transform:none!important;}
  }


  /* BLOG POST PAGE */
  .blogpost-head{padding-top:24px;max-width:880px;margin:0 auto;text-align:center;}
  .blogpost-head .eyebrow{justify-content:center;}
  .blogpost-head h1{font-family:var(--display);font-weight:600;font-size:52px;line-height:1.15;letter-spacing:-0.02em;color:var(--ink);margin:20px auto 0;}
  .blogpost-meta{margin-top:22px;font-family:var(--mono);font-size:12px;line-height:1.3;letter-spacing:0.16em;text-transform:uppercase;color:var(--ink-soft);}
  .blogpost-hero{margin:56px auto 0;max-width:960px;border-radius:28px;overflow:hidden;opacity:0;transform:translateY(20px);transition:opacity .3s ease-out,transform .3s ease-out;}
  .blogpost-hero.is-visible{opacity:1;transform:translateY(0);}
  .blogpost-hero img{width:100%;display:block;}
  .blogpost-body{max-width:840px;margin:0 auto;opacity:0;transform:translateY(20px);transition:opacity .3s ease-out,transform .3s ease-out;}
  .blogpost-body.is-visible{opacity:1;transform:translateY(0);}
  .blogpost-body p{margin:0 0 24px;color:var(--ink-soft);font-size:18px;line-height:1.75;letter-spacing:0;}
  .blogpost-body h2{font-family:var(--display);font-weight:600;font-size:28px;line-height:1.25;letter-spacing:-0.01em;color:var(--ink);margin:48px 0 18px;}
  .blogpost-body ul{margin:0 0 24px;padding-left:22px;color:var(--ink-soft);font-size:18px;line-height:1.75;}
  .blogpost-body li{margin-bottom:8px;}
  .blogpost-body ol{margin:0 0 24px;padding-left:22px;color:var(--ink-soft);font-size:18px;line-height:1.75;}
  .blogpost-body ol li{margin-bottom:8px;}
  .blogpost-back{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--ink-soft);margin-bottom:28px;transition:color .2s;}
  .blogpost-back:hover{color:var(--ink);}
  .blogpost-foot{max-width:840px;margin:40px auto 0;padding-top:32px;border-top:1px solid var(--line);}
  @media(max-width:900px){
    .blogpost-head{padding-top:8px;}
    .blogpost-head h1{font-size:30px;}
    .blogpost-hero{border-radius:18px;margin-top:36px;}
    .blogpost-body h2{font-size:22px;margin:36px 0 14px;}
    .blogpost-body p,.blogpost-body ul,.blogpost-body ol{font-size:16px;}
  }

  /* === EDITORIAL TREATMENT ==============================================
     Option D from the corner/button study. Cards lose their boxes and become
     rules on white; buttons become underlined links; corners are square.
     Additive override block - delete marker to marker to revert. */

  /* -- square corners ------------------------------------------------- */
  .btn,.navcta,.navtoggle,.cta-tag,.ctaband,.ctaband-card,.statband,.darkband,
  .closercard,.wcubox,.wcubox .ic,.wcu2-card,.wcu2-head,.wcu2-ic,
  .indcard,.indbadge,.blogcard,.blogcard .photo,.blogcard .pattern,.blogpost-hero,
  .teamcard,.abt-img,.benefititem,.benefititem .bicon,.backer-row img,
  .cta-form input,.cta-form select,.cta-form textarea,
  .indnav .arrow,.teamnav .arrow,.technav .arrow{border-radius:0;}

  /* -- cards become rules on white ------------------------------------ */
  .wcu2-card,.wcubox,.closercard,.benefititem{
    background:none;border:0;border-top:2px solid var(--ink);
    padding:20px 0 28px;align-items:flex-start;text-align:left;box-shadow:none;}
  .wcu2-card:hover,.wcubox:hover,.closercard:hover,.benefititem:hover{
    transform:none;box-shadow:none;}
  .wcu2-ic,.wcubox .ic,.benefititem .bicon{margin-left:0;}
  .wcu2-head{background:none;}

  /* -- photo tiles keep their photograph, lose the lift ---------------- */
  .indcard:hover,.teamcard:hover{transform:none;}

  /* -- buttons become underlined links --------------------------------- */
  .btn,.navcta,.cta-submit{
    display:inline-flex;align-items:center;gap:8px;background:none;border:0;
    border-bottom:1.5px solid currentColor;padding:0 0 6px;
    font-size:14px;line-height:1.2;font-weight:600;letter-spacing:0;
    transition:opacity .22s ease-out,color .22s ease-out;}
  .btn-solid,.btn-ghost{color:var(--ink);}
  .btn-ghost{color:var(--ink-soft);border-bottom-color:var(--line);}
  .btn-solid:hover,.navcta:hover{background:none;transform:none;box-shadow:none;opacity:.55;}
  .btn-ghost:hover{color:var(--ink);border-bottom-color:var(--ink);}
  .navcta{font-size:15px;color:var(--ink);}
  .hero-ctas{gap:30px;}
  .hero-ctas .btn-solid{background:none;color:var(--white);border-bottom-color:var(--white);}
  .hero-ctas .btn-solid:hover{background:none;color:var(--gold-bright);border-bottom-color:var(--gold-bright);opacity:1;}
  .hero-ctas .btn-ghost{background:none;color:rgba(255,255,255,0.68);border:0;border-bottom:1.5px solid rgba(255,255,255,0.4);}
  .hero-ctas .btn-ghost:hover{color:var(--white);border-bottom-color:var(--white);}

  /* -- the form ------------------------------------------------------- */
  .cta-form input,.cta-form select,.cta-form textarea{
    background:none;border:0;border-bottom:1px solid rgba(255,255,255,0.22);
    padding:8px 0;}
  .cta-form select{background-image:none;}
  .cta-form input:focus,.cta-form select:focus,.cta-form textarea:focus{
    border-color:var(--gold-bright);}
  .cta-submit{align-self:flex-start;margin-top:14px;color:var(--gold-bright);
    border-bottom-color:var(--gold-bright);cursor:pointer;}
  .cta-submit:hover{background:none;color:var(--white);border-bottom-color:var(--white);opacity:1;}
  /* -- navigation: full-width bar with a hairline, not a floating pill -- */
  header.nav{padding:0;background:rgba(255,255,255,0.96);border-bottom:1px solid var(--line);}
  .navrow{background:none;border-radius:0;box-shadow:none;backdrop-filter:none;padding:16px 26px;}
  .navrow.is-open nav.links{border-radius:0;box-shadow:none;top:100%;left:0;right:0;border-left:0;border-right:0;}
  /* === END EDITORIAL TREATMENT ========================================== */
  .blogpost-body .tablewrap{margin:0 0 26px;overflow-x:auto;}
  .blogpost-body table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.55;min-width:560px;}
  .blogpost-body th,.blogpost-body td{text-align:left;vertical-align:top;padding:13px 16px;border-bottom:1px solid var(--line);}
  .blogpost-body thead th{font-family:var(--mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;
    color:var(--ink);background:rgba(20,18,14,0.035);border-bottom:1px solid rgba(20,18,14,0.18);}
  .blogpost-body tbody td{color:var(--ink-soft);}
  .blogpost-body tbody td:first-child{color:var(--ink);font-weight:600;}
  .blogpost-body tbody tr:last-child td{border-bottom:0;}
  .blogpost-body h3{font-family:var(--display);font-weight:600;font-size:21px;line-height:1.3;
    letter-spacing:-0.01em;color:var(--ink);margin:36px 0 14px;}

  /* === TYPEFACE: Newsreader display ====================================
     Display face is Newsreader, set at 600. Instrument Serif was tried first
     and read as underweight - it ships a single 400 and nothing heavier.
     Newsreader has a real weight range and an optical-size axis, so headlines
     carry at 116px without the browser faking bold.
     Additive block - delete marker to marker to revert. */

  /* display level */
  .hero h1,.pagehead h1,.abt-txt h1,.blogpost-head h1,
  .section-head h2,.ctaband h2,.abt-txt h2,.backers h2,.closer h2,.blogpost-body h2,
  .hero-stats b,.statband b{
    font-family:var(--display);font-weight:600;}
  .hero h1{letter-spacing:-0.018em;line-height:1.02;}
  .pagehead h1,.abt-txt h1,.blogpost-head h1{letter-spacing:-0.015em;line-height:1.1;}
  .section-head h2,.ctaband h2,.abt-txt h2,.backers h2,.closer h2{letter-spacing:-0.012em;line-height:1.14;}
  .blogpost-body h2{letter-spacing:-0.01em;}
  .hero-stats b,.statband b{font-weight:600;letter-spacing:-0.01em;
    font-variant-numeric:lining-nums tabular-nums;}

  /* subhead level stays on the sans - swap var(--sans) for var(--display) here
     if you want one serif carrying every heading on the site */
  h3,.audrow h3,.blogpost-body h3,.flow-item h3,.indcard h3,.rnote h3,.tcol h3,
  .teamcard h3,.techcard h3,.wcu2-card h3,.wcu2-row h3{
    font-family:var(--sans);font-weight:600;letter-spacing:-0.011em;}

  /* wordmark and labels are lettering, not display type */
  .wordmark{font-family:var(--sans);font-weight:700;letter-spacing:-0.01em;}
  .trustedby span{font-family:var(--sans);font-weight:600;letter-spacing:-0.01em;}
  .wcu2-num{font-family:var(--mono);font-weight:500;}
  /* === END TYPEFACE ==================================================== */

  /* ═══ ACCESSIBILITY ════════════════════════════════════════════════════
     Skip link, visually-hidden utility and 24px minimum hit areas.
     Additive block - delete marker to marker to revert. */
  .skiplink{position:absolute;left:8px;top:-60px;z-index:999;background:var(--ink);
    color:#fff;padding:10px 16px;font-size:14px;font-weight:600;text-decoration:none;
    transition:top .15s ease-out;}
  .skiplink:focus{top:8px;outline:2px solid var(--gold-bright);outline-offset:2px;}
  .vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
    clip:rect(0 0 0 0);white-space:nowrap;border:0;}
  main:focus{outline:none;}
  /* hit areas: the mark stays the same size, the target grows to 24px */
  .footgrid ul a{display:inline-block;padding:4px 0;}
  .blogpost-back{padding:3px 0;}
  .teamli{min-width:24px;min-height:24px;}
  /* ═══ END ACCESSIBILITY ════════════════════════════════════════════════ */

  /* ═══ PRIMARY BUTTON ═══════════════════════════════════════════════════
     The editorial pass turned every button into an underlined link, which
     left the main action with no weight. One solid primary, square corners;
     secondary actions keep the link treatment. */
  .btn-solid,.cta-submit,.navcta{
    background:var(--ink);color:#fff;border:0;border-bottom:0;
    padding:13px 24px;font-size:14px;font-weight:600;letter-spacing:0;
    line-height:1.2;white-space:nowrap;
    transition:background .2s ease-out,color .2s ease-out;}
  .btn-solid:hover,.cta-submit:hover,.navcta:hover{
    background:var(--gold-text);color:#fff;opacity:1;transform:none;box-shadow:none;}
  .navcta{padding:10px 20px;font-size:14px;}
  /* on the dark hero and the dark CTA band the primary inverts */
  .hero-ctas .btn-solid{background:#fff;color:var(--ink);border-bottom:0;}
  .hero-ctas .btn-solid:hover{background:var(--gold-bright);color:var(--ink);border-bottom:0;}
  .cta-submit{background:var(--gold-bright);color:var(--ink);border-bottom:0;cursor:pointer;}
  .cta-submit:hover{background:#fff;color:var(--ink);}
  /* secondary stays a rule-underlined link */
  .btn-ghost{padding:0 0 6px;white-space:nowrap;}
  /* ═══ END PRIMARY BUTTON ═══════════════════════════════════════════════ */

  /* ═══ LAPTOP WIDTHS (900-1200px) ═══════════════════════════════════════
     The review found the layout breaking across small laptops, split screens
     and iPad landscape - the widths most first-time visitors arrive on. */
  .hero h1{font-size:clamp(40px,6.2vw,116px);}
  .hero .lead{max-width:52ch;}
  .btn,.navcta,.cta-tag,.indbadge,.cta-submit{white-space:nowrap;}
  .footbottom{flex-wrap:wrap;gap:10px 24px;}
  h3{line-height:1.3;}
  @media(min-width:901px) and (max-width:1200px){
    .hero{padding-right:0;}
    .hero-content{max-width:58%;}
    .hero-phones{transform:scale(0.78);transform-origin:100% 50%;}
    .hero-stats{gap:20px;max-width:100%;}
    .hero-stats b{font-size:27px;}
    .hero-stats span{font-size:11px;}
    .hero-ctas{flex-wrap:wrap;gap:16px 20px;}
    .wcugrid2{grid-template-columns:repeat(2,1fr);}
    .indgrid.cols-4{grid-template-columns:repeat(2,1fr);}
    .whynow{gap:32px;}
    .cmpx{gap:36px;}
    .backer-row{gap:28px;}
  }
  @media(min-width:901px) and (max-width:1040px){
    .hero-phones{transform:scale(0.66);}
    .hero-content{max-width:64%;}
  }
  /* ═══ END LAPTOP WIDTHS ════════════════════════════════════════════════ */

  /* ═══ OCTOBER P2 ═══════════════════════════════════════════════════════
     Flat hero, one verdict colour scale, type-only cards, no watermark. */

  /* -- hero: flat deep warm neutral, square like everything else -------- */
  .hero{background:#14120e;border-radius:0;}
  .hero-scrim{background:linear-gradient(102deg,rgba(0,0,0,0.45) 0%,rgba(0,0,0,0.18) 46%,transparent 68%);}

  /* -- one verdict scale, used the same way everywhere ------------------
     pass / borderline / mismatch. Gold is a brand colour, not a verdict. */
  .rep-dial svg circle[stroke="#c9922f"]{stroke:var(--v-pass);}

  /* -- cards lose the stock icons; the numeral carries the rhythm ------- */
  .wcu2-ic{display:none;}
  .wcu2-num{font-family:var(--mono);font-size:11px;letter-spacing:0.18em;
    color:var(--gold-text);opacity:1;}
  .wcu2-card{padding-top:18px;}
  .wcu2-card h3{margin-top:10px;}

  /* -- the 9% logo watermark behind "Why choose us" --------------------- */
  .wcu-watermark{display:none;}
  /* ═══ END OCTOBER P2 ═══════════════════════════════════════════════════ */

  /* ═══ HEADER WORDMARK ══════════════════════════════════════════════════
     The header set TRULUX in Inter next to the mark while the footer used
     the official logotype. Both now use the official artwork. */
  .wordmark .wordtype{height:17px;width:auto;display:block;}
  .wordmark .wordtype path{fill:var(--ink);}
  /* ═══ END HEADER WORDMARK ══════════════════════════════════════════════ */

  /* ═══ INNER-PAGE CTA ═══════════════════════════════════════════════════
     The full booking form used to repeat on all seven pages, so Contact
     said nothing new. Inner pages now carry a short CTA that routes there. */
  .ctaband-compact{min-height:0;}
  .ctaband-short{flex:1 1 100%;max-width:none;background:none;
    align-items:center;text-align:center;padding:72px 40px;}
  .ctaband-short .cta-tag{align-self:center;}
  .ctaband-short h2,.ctaband-short p{text-align:center;}
  .ctaband-short p{max-width:46ch;margin:14px auto 0;}
  /* the primary is ink-on-white everywhere else; on the dark band it inverts */
  .ctaband-short .btn-solid{align-self:center;margin-top:30px;
    background:#fff;color:var(--ink);}
  .ctaband-short .btn-solid:hover{background:var(--gold-bright);color:var(--ink);}
  @media(max-width:900px){
    .ctaband-short{padding:52px 24px;}
  }
  /* ═══ END INNER-PAGE CTA ═══════════════════════════════════════════════ */

  /* ═══ MOTION ═══════════════════════════════════════════════════════════
     Everything used to fade up individually, which slows a reader who is
     skimming. Sections animate; their contents arrive with them. */
  /* every element that used to fade in on its own. They are no longer
     observed, so without this they would sit at opacity:0 for ever. */
  .trustedby,.indcard,.blogcard,.wcu2-card,.wcu2-row,.wcu2-ic,.wcu2-desc,
  .step,.audrow,.teamcard,.tcol > div,.abtgroup,.flow-item,.demovideo,
  .techcard,.techcard .desc,.blogpost-hero,.blogpost-body{
    opacity:1 !important;transform:none !important;transition:none !important;}
  .section-head,.ctaband,.footgrid{transition:opacity .34s ease-out,transform .34s ease-out;}
  /* ═══ END MOTION ═══════════════════════════════════════════════════════ */

/* ═══ NARROW PHONES (3.38) ═══════════════════════════════════════════════
   Matches the inline rule on the six core pages: below ~400px the column
   gap stops the two footer lines sharing a row, and at 320px they overflow. */
@media(max-width:420px){
  .footbottom{flex-direction:column;align-items:flex-start;gap:6px;}
}

@media(max-width:359px){
  /* matches the core pages: the header CTA and the burger collide at 320px */
  .navcta{display:none;}
}

/* bg-light-gold: light sand page colour - delete this block to revert to white */
:root{--page:#fdf9f0;}
body,.trustedby,.btn-ghost,.navrow.is-open nav.links,.blogrow,.blogcard{background:var(--page);}
header.nav{background:rgba(253,249,240,0.96);}
  .navrow{gap:32px;}
  .wordmark{flex:none;}
  @media(min-width:901px) and (max-width:1100px){.navrow{gap:20px;}.wordmark img{height:36px !important;}.links{gap:16px !important;}.links a{font-size:13px !important;}}
