/* ACG Digital site. Mirrors the ACG site design system (web/acg-site/static on the ACG site branch):
   same tokens, chrome, pills, buttons, dark/cream grounds, graph-paper grid, device frames and footer.
   Fonts: Playfair Display (display) + DM Sans (functional), self-hosted, OFL. */
@font-face{font-family:"Playfair Display";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/playfair-700.woff2) format("woff2")}
@font-face{font-family:"Playfair Display";font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/playfair-800.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/dm-sans-400.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/dm-sans-500.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/dm-sans-700.woff2) format("woff2")}
/* metric-matched fallbacks so text does not jump when the web fonts arrive */
@font-face{font-family:"Playfair Fallback";src:local("Georgia"),local("Liberation Serif"),local("Times New Roman");size-adjust:108%;ascent-override:100%;descent-override:24%;line-gap-override:0%}
@font-face{font-family:"DM Sans Fallback";src:local("Arial"),local("Liberation Sans"),local("Helvetica");size-adjust:100%;ascent-override:96%;descent-override:30%;line-gap-override:0%}

:root{
  --navy:#213E65;--navy-d:#0D1E35;--navy-x:#07111F;--panel:#16233C;--panel-2:#1A2B3C;--line-d:#22344E;
  --cream:#F7F5F0;--cream-2:#EFEBE2;--divider:#DED8CC;--grid:rgba(241,154,8,.13);--grid-d:rgba(255,255,255,.035);
  --orange:#F19A08;--orange-ink:#8F5600;--green:#8BD46A;--teal:#24D4C3;
  --ink:#1F2A36;--body:#333333;--muted:#5F6773;--white:#FFFFFF;--mist:rgba(255,255,255,.74);--mist-2:#9AA7B6;
  --rn:linear-gradient(90deg,#F19A08 0%,#8BD46A 55%,#24D4C3 100%);
  --display:"Playfair Display","Playfair Fallback",Georgia,"Times New Roman",serif;
  --sans:"DM Sans","DM Sans Fallback",system-ui,-apple-system,"Segoe UI",sans-serif;
  --gut:clamp(16px,4vw,40px);--wrap:calc(1280px + 2 * var(--gut));
  --hd:64px;--ease:cubic-bezier(.2,.7,.2,1);
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hd) + 8px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--body);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--display);color:var(--ink);text-wrap:balance;margin:0;letter-spacing:-.01em;font-weight:700}
p{margin:0;text-wrap:pretty}
ul,ol{margin:0;padding:0}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--orange);color:var(--navy-x);padding:10px 14px;border-radius:6px;font-weight:700}
.skip:focus{left:8px}

/* ---------- atoms (ACG) ---------- */
.pill{display:inline-flex;align-items:center;gap:8px;padding:5px 14px;border-radius:20px;background:rgba(241,154,8,.15);border:1px solid rgba(241,154,8,.3);color:var(--orange);font:700 12px/1.4 var(--sans);letter-spacing:.06em;text-transform:uppercase}
.pill.on-cream{background:rgba(241,154,8,.12);border-color:rgba(241,154,8,.38);color:var(--orange-ink)}
.accent{color:var(--orange)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;background:var(--orange);color:var(--navy-x);font:700 15px/1 var(--sans);padding:16px 26px;border:0;border-radius:8px;text-decoration:none;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background-color .2s}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px -10px rgba(241,154,8,.7)}
.btn:active{transform:translateY(0);box-shadow:none;background:#E08E05}
.btn .ar{transition:transform .2s var(--ease)}
.btn:hover .ar{transform:translateX(3px)}
.btn-sm{min-height:44px;padding:11px 16px;font-size:14px;border-radius:7px;white-space:nowrap}
.btn-navy{background:var(--navy);color:var(--white)}
.btn-navy:hover{background:var(--navy-d);box-shadow:0 10px 24px -12px rgba(13,30,53,.8)}
.link-light{display:inline-flex;align-items:center;min-height:44px;color:var(--white);font-weight:700;text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(241,154,8,.8)}
.link-light:hover{color:var(--orange)}
.link{font-weight:700;color:var(--navy);text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(241,154,8,.7)}
.link:hover{color:#B86F00}
.rnbar{height:4px;border-radius:2px;background:var(--rn)}
.grid-bg{background-color:var(--cream);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:44px 44px}
.white{background:var(--white)}
.sec{padding-block:clamp(88px,10vw,144px)}
.h2{font-size:clamp(32px,4.2vw,52px);line-height:1.06}
.lede{font-size:clamp(17px,1.4vw,18.5px);line-height:1.65;max-width:58ch;color:var(--body)}
.eyebrow-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:20px}
.sec-hd{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:20px 56px;align-items:end}
.sec-hd .lede{justify-self:start}
@media (max-width:860px){.sec-hd{grid-template-columns:minmax(0,1fr)}}
.dark{background:var(--navy-x);color:var(--mist);position:relative;overflow:hidden}
.dark::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 70% at 100% 0%,rgba(36,212,195,.08),transparent 60%),radial-gradient(60% 70% at 0% 100%,rgba(241,154,8,.08),transparent 60%)}
.dark .wrap{position:relative}
.dark h2,.dark h3{color:var(--white)}
.dark .lede{color:var(--mist)}
.dark-grid{background-image:linear-gradient(var(--grid-d) 1px,transparent 1px),linear-gradient(90deg,var(--grid-d) 1px,transparent 1px);background-size:44px 44px}
.ico{display:inline-flex;width:18px;height:18px;flex:none}
.ico svg{width:100%;height:100%;display:block}

/* ---------- header (ACG chrome) ---------- */
.topbar{position:sticky;top:0;z-index:40;background:var(--navy);border-bottom:1px solid rgba(255,255,255,.08)}
.topbar .wrap{position:relative;display:flex;align-items:center;gap:20px;height:var(--hd)}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--white);min-height:44px;flex:none}
.logo img{height:33px;width:auto}
.logo .lk-div{width:1px;height:26px;background:rgba(255,255,255,.28)}
.logo b{font:700 13px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--white)}
.parent-link{font:500 12.5px/1.2 var(--sans);color:var(--mist);text-decoration:none;display:inline-flex;align-items:center;gap:6px;min-height:44px;white-space:nowrap}
.parent-link:hover{color:var(--orange)}
.parent-link svg{width:11px;height:11px}
.site-nav{margin-left:auto;display:flex;align-items:center;gap:12px}
.site-nav>a{color:var(--white);text-decoration:none;font:700 14.5px/1 var(--sans);opacity:.92;padding:15px 8px;min-width:44px;text-align:center;transition:color .2s}
.site-nav>a:hover{color:var(--orange);opacity:1}
.site-nav>a[aria-current=true]{color:var(--orange);opacity:1}
.site-nav .nav-extra{display:none}
.burger{display:none;flex:none;background:none;border:0;width:44px;min-width:44px;height:44px;padding:0;margin-right:-8px;cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:4px}
.burger span{display:block;width:22px;height:2px;background:var(--white);border-radius:2px;transition:transform .2s,opacity .2s}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.hd-cta{flex:none}
@media (max-width:1240px){.topbar .parent-link{display:none}}
@media (max-width:1023px){
  .site-nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--navy-d);border-top:1px solid rgba(255,255,255,.08);padding:6px var(--gut) 22px;max-height:calc(100vh - var(--hd));overflow-y:auto;box-shadow:0 24px 40px -24px rgba(0,0,0,.7)}
  .site-nav.open{display:flex}
  .site-nav>a{padding:15px 0;font-size:17px;text-align:left;border-bottom:1px solid rgba(255,255,255,.08)}
  .site-nav .nav-extra{display:flex;border-bottom:0;font:500 15px/1.3 var(--sans);color:var(--mist);padding:12px 0}
  .hd-cta{margin-left:auto}
  .burger{display:inline-flex}
}
@media (max-width:420px){.logo img{height:25px}.logo{gap:9px}.logo b{font-size:11.5px;letter-spacing:.2em}.logo .lk-div{height:22px}.hd-cta{padding:10px 12px;font-size:13px}.topbar .wrap{gap:10px}}
@media (max-width:340px){.topbar .wrap{gap:6px}.hd-cta{padding:9px 10px;font-size:12.5px}.logo{gap:7px}}
@media (max-width:359px){.hd-cta .ar{display:none}.logo b{letter-spacing:.14em}}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--navy-d) url(../img/hero-brickell.webp) center 40%/cover no-repeat;overflow:hidden;color:var(--mist)}
@media (max-width:760px){.hero{background-image:url(../img/hero-brickell-m.webp)}}
/* same treatment as the ACG hero-art: the engraving reads as texture under a navy wash */
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(50% 60% at 0% 100%,rgba(241,154,8,.10),transparent 60%),linear-gradient(145deg,rgba(7,17,31,.96) 0%,rgba(13,30,53,.91) 50%,rgba(33,62,101,.78) 100%)}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:44px 44px;-webkit-mask:linear-gradient(180deg,#000 0%,rgba(0,0,0,.6) 70%,transparent 100%);mask:linear-gradient(180deg,#000 0%,rgba(0,0,0,.6) 70%,transparent 100%)}
.hero>.wrap{position:relative;z-index:2}
.hero-main{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:clamp(32px,5vw,72px);align-items:center;padding-block:clamp(56px,8vw,104px) clamp(48px,6vw,72px)}
.hero h1{color:var(--white);font-size:clamp(40px,5.6vw,72px);line-height:1.03;font-weight:800;margin-top:22px;max-width:13ch}
.hero h1 .accent{font-weight:800}
.hero .sub{color:var(--mist);font-size:clamp(17px,1.45vw,19px);max-width:46ch;margin-top:24px}
.hero .cta{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;margin-top:34px}
.hero .trust{margin-top:26px;display:flex;align-items:center;gap:12px;font:500 14px/1.4 var(--sans);color:var(--mist-2)}
.hero .trust a{color:var(--mist);text-decoration:none;border-bottom:1px solid rgba(241,154,8,.5)}
.hero .trust a:hover{color:var(--orange)}
.hero .trust .rnbar{width:36px;flex:none}
@media (max-width:900px){.hero-main{grid-template-columns:minmax(0,1fr);gap:44px;padding-top:44px}.hero h1{max-width:15ch}.hero .dev{max-width:560px}}
@media (max-width:480px){.hero .cta .btn{width:100%}.hero .cta{gap:6px 24px}}
/* hero entrance: pure CSS so the headline paints at once */
.rise{animation:rise .7s var(--ease) both}
.rise.d1{animation-delay:.08s}.rise.d2{animation-delay:.16s}.rise.d3{animation-delay:.24s}.rise.d4{animation-delay:.32s}.rise.d5{animation-delay:.2s}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
h1.rise{animation-name:riseH}
@keyframes riseH{from{transform:translateY(18px)}to{transform:none}}

/* at-a-glance band: navy stat chips with orange numbers */
.glance{position:relative;z-index:2;border-top:1px solid rgba(255,255,255,.1);background:rgba(7,17,31,.6)}
.glance dl{margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.glance .r{padding:24px 26px;border-left:1px solid rgba(255,255,255,.1);min-width:0}
.glance .r:first-child{border-left:0;padding-left:0}
.glance dt{font:700 11.5px/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--mist-2)}
.glance dd{margin:10px 0 0;color:var(--white);font:700 17px/1.35 var(--sans)}
.glance dd .n{display:block;font:800 clamp(30px,3.2vw,40px)/1 var(--display);color:var(--orange);margin-bottom:6px}
.glance .rnbar{width:56px;margin-top:14px;transform-origin:left;transition:transform 1.2s var(--ease) .3s}
.js .glance:not(.in) .rnbar{transform:scaleX(0)}
@media (max-width:900px){.glance dl{grid-template-columns:repeat(2,minmax(0,1fr))}.glance .r:nth-child(3){border-left:0;padding-left:0}.glance .r:nth-child(n+3){border-top:1px solid rgba(255,255,255,.1)}}
@media (max-width:480px){.glance .r{padding:18px 0 18px 16px}.glance .r:nth-child(odd){padding-left:0}.glance dd{font-size:15.5px}}
@media (max-width:339px){.glance dl{grid-template-columns:minmax(0,1fr)}.glance .r,.glance .r:nth-child(odd){border-left:0;padding:16px 0}.glance .r+.r{border-top:1px solid rgba(255,255,255,.1)}}

/* ---------- device frames (ACG dev3: laptop + phone with scrolling full-page captures) ---------- */
.dev{position:relative;width:100%;max-width:640px;margin-inline:auto;aspect-ratio:640/470}
.dev .dv-frame{background:#0c1424;border:1px solid #2a3a52;box-shadow:0 30px 70px -20px rgba(0,0,0,.65)}
.dev .dv-screen{width:100%;background:linear-gradient(160deg,#1A2B3C,#0D1E35) top center/100% auto no-repeat}
.dev .dv-laptop{position:absolute;left:3%;top:4%;width:86%}
.dev .dv-laptop .dv-frame{border-radius:12px 12px 0 0;padding:9px 9px 0}
.dev .dv-laptop .dv-screen{aspect-ratio:16/10;border-radius:4px 4px 0 0}
.dev .dv-base{height:14px;width:112%;margin-left:-6%;background:linear-gradient(#cdd6e1,#9aa7b6);border-radius:0 0 12px 12px;position:relative}
.dev .dv-base::after{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:18%;height:4px;background:#8391a0;border-radius:0 0 5px 5px}
.dev .dv-phone{position:absolute;right:0;bottom:0;width:23%}
.dev .dv-phone .dv-frame{border-radius:22px;padding:6px;position:relative}
.dev .dv-phone .dv-screen{aspect-ratio:9/19.3;border-radius:16px}
.dev .dv-notch{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:30%;height:5px;background:#0c1424;border-radius:99px;z-index:2}
.dev .dv-laptop .dv-screen{background-image:var(--full-d,var(--still-d,none))}
.dev .dv-phone .dv-screen{background-image:var(--full-m,var(--still-m,none))}
.dev .dv-screen{background-size:100% auto;background-position:center 0%}
@keyframes roll{0%,6%{background-position:center 0%}94%,100%{background-position:center 100%}}
.dev.roll .dv-screen{animation:roll var(--roll-t,46s) linear infinite alternate}
.dev.roll.paused .dv-screen,.dev.roll.off .dv-screen{animation-play-state:paused}
.dev.mx .dv-laptop{transform:translateY(calc(var(--dp,0) * -36px))}
.dev.mx .dv-phone{transform:translateY(calc(var(--dp,0) * -110px))}
@media (max-width:480px){.dev .dv-phone .dv-frame{border-radius:13px;padding:3px}.dev .dv-phone .dv-screen{border-radius:10px}.dev .dv-notch{top:7px}.dev .dv-laptop .dv-frame{padding:5px 5px 0;border-radius:8px 8px 0 0}.dev .dv-base{height:9px}}
@media (prefers-reduced-motion:reduce){.dev.roll .dv-screen{animation:none!important}.dev.mx .dv-laptop,.dev.mx .dv-phone{transform:none!important}}

/* ---------- 2. industry samples ---------- */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:56px}
.card{background:var(--white);border:1px solid var(--divider);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;min-width:0;box-shadow:0 26px 48px -34px rgba(13,30,53,.5);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.card:hover{transform:translateY(-4px);box-shadow:0 36px 60px -36px rgba(13,30,53,.6)}
.card-stage{position:relative;padding:30px 8% 26px 5%;background:radial-gradient(70% 80% at 80% 0%,rgba(36,212,195,.12),transparent 60%),radial-gradient(60% 70% at 0% 100%,rgba(241,154,8,.12),transparent 60%),var(--navy-d);overflow:hidden}
.card-stage .dev{max-width:none;aspect-ratio:640/440}
.card-stage .dev .dv-laptop{top:0;left:0;width:88%}
.card-stage .dev .dv-phone{width:24%;right:-1%}
.card-hint{position:absolute;left:5%;top:9px;font:700 10.5px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--mist-2);opacity:.85;transition:opacity .3s}
.card:hover .card-hint,.card.play .card-hint{opacity:0}
@media (hover:none){.card-hint{display:none}}
.card-meta{padding:22px 24px 26px;display:grid;gap:8px;align-content:start;flex:1}
.card-tags{display:flex;flex-wrap:wrap;gap:8px}
.card-tags span{font:700 11px/1 var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--navy);border:1px solid rgba(33,62,101,.28);border-radius:4px;padding:6px 9px}
.card-tags span.live{color:#0B6B62;border-color:rgba(36,212,195,.6);background:rgba(36,212,195,.1);display:inline-flex;align-items:center;gap:6px}
.card-tags span.live::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 3px rgba(36,212,195,.25)}
.card-meta h3{font-size:clamp(22px,1.9vw,25px);line-height:1.15}
.card-go{display:inline-flex;align-items:center;gap:8px;margin-top:10px;align-self:end;justify-self:start;min-height:44px;background:var(--navy);color:var(--white);font:700 14px/1 var(--sans);padding:12px 18px;border-radius:8px;text-decoration:none;transition:background .2s,color .2s}
.card-go:hover{background:var(--orange);color:var(--navy-x)}
.card-go svg{width:14px;height:14px}
.samples-foot{margin-top:40px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;font-size:17px;color:var(--body)}
@media (max-width:1080px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:680px){.cards{grid-template-columns:minmax(0,1fr);margin-top:40px}}

/* ---------- 3. how it works (ACG track) ---------- */
.track{position:relative;margin-top:64px}
.track>.rnbar{position:absolute;left:0;right:0;top:10px;height:4px;transform-origin:left;transition:transform 1.6s var(--ease) .1s}
.js .track:not(.in)>.rnbar{transform:scaleX(0)}
.track ol{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px);position:relative}
.track li{padding-top:52px;position:relative;min-width:0}
.track li::before{content:"";position:absolute;top:0;left:0;width:24px;height:24px;border-radius:50%;background:var(--navy-x);border:5px solid var(--c,var(--orange));transition:box-shadow .5s}
.track li:nth-child(2){--c:var(--green)}
.track li:nth-child(3){--c:var(--teal)}
.track .ph{font:700 12px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--c,var(--orange))}
.track h3{font-size:clamp(23px,2.2vw,28px);line-height:1.18;margin:10px 0 12px}
.track p{color:var(--mist);font-size:16.5px;max-width:38ch}
.js .track li{opacity:0;transform:translateY(16px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.js .track.in li{opacity:1;transform:none}
.js .track.in li:nth-child(2){transition-delay:.45s}.js .track.in li:nth-child(3){transition-delay:.9s}
@media (max-width:860px){.track>.rnbar{left:10px;right:auto;top:0;bottom:0;width:4px;height:auto;background:linear-gradient(180deg,#F19A08,#8BD46A 55%,#24D4C3);transform-origin:top}.track ol{grid-template-columns:minmax(0,1fr);gap:40px}.track li{padding:0 0 0 52px}.js .track:not(.in)>.rnbar{transform:scaleY(0)}}

/* ---------- 4. pricing ---------- */
.price-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:56px;align-items:stretch}
.price{border-radius:14px;padding:clamp(28px,3.4vw,44px);display:flex;flex-direction:column;gap:18px;min-width:0;border:1px solid var(--divider);background:var(--white);box-shadow:0 26px 48px -36px rgba(13,30,53,.5)}
.price.navy{background:var(--navy-x);border-color:var(--line-d);border-top:3px solid var(--orange);color:var(--mist);box-shadow:0 30px 60px -30px rgba(7,17,31,.7)}
.price.navy h3{color:var(--white)}
.price-k{font:700 12px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--orange-ink)}
.price.navy .price-k{color:var(--orange)}
.price h3{font-size:clamp(24px,2.3vw,30px);line-height:1.15}
.chip{display:inline-flex;align-items:baseline;gap:10px;align-self:flex-start;background:var(--navy);border-radius:10px;padding:14px 18px 12px;color:var(--mist)}
.price.navy .chip{background:var(--panel)}
.chip b{font:800 clamp(36px,4vw,48px)/1 var(--display);color:var(--orange);font-variant-numeric:lining-nums}
.chip span{font:700 14px/1 var(--sans);color:var(--white)}
.price .when{font-size:16px;color:var(--muted)}
.price.navy .when{color:var(--mist)}
.list{list-style:none;display:grid;gap:12px;padding-top:20px;border-top:1px solid var(--divider)}
.price.navy .list{border-color:var(--line-d)}
.list li{display:flex;gap:12px;align-items:baseline;font-size:16.5px}
.list li::before{content:"";flex:none;width:16px;height:4px;border-radius:2px;background:var(--rn);transform:translateY(-3px)}
.price.navy .list li{color:var(--white)}
.price-line{margin-top:32px;display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between;padding:22px 26px;border:1.5px dashed rgba(241,154,8,.55);border-radius:12px;background:rgba(255,255,255,.5)}
.price-line p{font:700 clamp(19px,1.8vw,22px)/1.3 var(--display);color:var(--ink)}
@media (max-width:860px){.price-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------- 5. social media ---------- */
.split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(40px,6vw,96px);align-items:center}
.handles{list-style:none;display:grid;gap:0;margin-top:34px;border-top:1px solid var(--divider)}
.handles li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:4px 16px;padding:18px 0;border-bottom:1px solid var(--divider)}
.handles .svc-ico{grid-row:span 2}
.handles b{font:700 17px/1.35 var(--sans);color:var(--ink)}
.handles span.t{font-size:16px;color:var(--body)}
.svc-ico{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:10px;background:rgba(241,154,8,.12);border:1px solid rgba(241,154,8,.3);color:#C77C00}
.svc-ico svg{width:18px;height:18px;display:block}
.dark .svc-ico{color:var(--orange)}
.split-cta{margin-top:30px;display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center}
.split-cta p{font-weight:700;color:var(--ink)}
@media (max-width:960px){.split{grid-template-columns:minmax(0,1fr)}}

/* phone stage (social feed and AI chat) */
.stage{position:relative;border-radius:16px;padding:clamp(28px,4vw,52px) 0;display:grid;place-items:center;background:radial-gradient(60% 60% at 70% 10%,rgba(36,212,195,.14),transparent 60%),radial-gradient(60% 60% at 20% 100%,rgba(241,154,8,.16),transparent 60%),var(--navy-d);overflow:hidden;min-width:0}
.stage::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:32px 32px}
.stage-tag{position:absolute;left:18px;top:16px;z-index:2;font:700 10.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--mist-2)}
.phone{position:relative;z-index:1;width:min(300px,78%);aspect-ratio:9/19;background:#0c1424;border:1px solid #2a3a52;border-radius:34px;padding:9px;box-shadow:0 40px 80px -30px rgba(0,0,0,.85)}
.phone-scr{position:relative;width:100%;height:100%;border-radius:26px;overflow:hidden;background:#fff}
.phone .dv-notch{position:absolute;top:15px;left:50%;transform:translateX(-50%);width:28%;height:6px;background:#0c1424;border-radius:99px;z-index:3}

/* sample feed */
.feed{font-family:var(--sans);color:#14181f;height:100%;display:flex;flex-direction:column}
.feed-top{padding:30px 14px 10px;display:flex;align-items:center;gap:10px;border-bottom:1px solid #eceae4;background:#fff;position:relative;z-index:2}
.av{width:34px;height:34px;border-radius:50%;flex:none;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#0e7490,#06283d)}
.av svg{width:16px;height:16px}
.av .ini{font:700 11px/1 var(--sans);font-style:normal;letter-spacing:.04em}
.post-hd .av .ini{font-size:8.5px}
.feed-top b{display:block;font-size:12.5px;line-height:1.2}
.feed-top small{display:block;font-size:10.5px;color:#6b7280}
.feed-scroll{flex:1;overflow:hidden;position:relative}
.feed-track{display:grid;gap:0}
.js .stage.in .feed-track{animation:feed 22s var(--ease) 1s infinite}
@keyframes feed{0%,30%{transform:translateY(0)}45%,75%{transform:translateY(-52%)}90%,100%{transform:translateY(0)}}
.post{border-bottom:8px solid #f3f2ee;background:#fff}
.post-hd{display:flex;align-items:center;gap:8px;padding:10px 12px;font-size:11px}
.post-hd .av{width:24px;height:24px}
.post-hd .av svg{width:11px;height:11px}
.post-hd b{font-size:11.5px}
.post-hd small{margin-left:auto;color:#6b7280;font-size:10px}
.ba-post{position:relative;display:grid;grid-template-columns:1fr 1fr;aspect-ratio:1/1;gap:2px;background:#fff}
.ba-post figure{margin:0;position:relative;overflow:hidden;background:#cdbb9e}
.ba-post img{width:100%;height:100%;object-fit:cover}
.ba-post figcaption{position:absolute;left:6px;top:6px;font:700 9px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;padding:5px 7px;border-radius:4px;background:rgba(7,17,31,.78);color:#fff}
.ba-post figure+figure figcaption{background:var(--orange);color:var(--navy-x)}
.post-ic{display:flex;gap:12px;padding:9px 12px 4px;color:#14181f}
.post-ic svg{width:17px;height:17px}
.post-tx{padding:2px 12px 12px;font-size:11px;line-height:1.45}
.post-tx b{font-weight:700}
.post-ph{aspect-ratio:4/3;background:linear-gradient(160deg,#47d0e0,#0f86a6);position:relative;overflow:hidden}
.post-ph img{width:100%;height:100%;object-fit:cover}
.post-sched{margin:10px 12px 12px;padding:10px 12px;border-radius:10px;background:#f6f4ef;display:flex;align-items:center;gap:10px;font-size:10.5px;color:#374151}
.post-sched i{width:8px;height:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 3px rgba(36,212,195,.25);flex:none}

/* ---------- 6. AI tools ---------- */
.ai-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(40px,5vw,80px);align-items:start;margin-top:56px}
.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(24px,3vw,44px);counter-reset:t}
.tile{padding:26px 0 28px;border-top:1px solid var(--line-d);display:grid;grid-template-columns:64px minmax(0,1fr);gap:6px 18px;align-content:start;min-width:0}
.tile .onum{grid-row:span 2;font:800 44px/.9 var(--display);color:transparent;-webkit-text-stroke:1.3px var(--orange);font-variant-numeric:lining-nums}
.tile h3{font:700 18px/1.3 var(--sans);color:var(--white);letter-spacing:0;padding-top:4px}
.tile p{font-size:15.5px;color:var(--mist);line-height:1.55}
.ai-line{margin-top:28px;padding-top:26px;border-top:1.5px dashed rgba(36,212,195,.45);display:flex;flex-wrap:wrap;gap:16px 26px;align-items:center;justify-content:space-between}
.ai-line p{max-width:52ch;color:var(--white);font-size:17px}
.ai-grid .stage{position:sticky;top:calc(var(--hd) + 24px);background:radial-gradient(60% 60% at 70% 10%,rgba(36,212,195,.16),transparent 60%),radial-gradient(60% 60% at 20% 100%,rgba(241,154,8,.14),transparent 60%),#0A1729;border:1px solid var(--line-d)}
@media (max-width:1023px){.ai-grid{grid-template-columns:minmax(0,1fr)}.ai-grid .stage{position:relative;top:0}}
@media (max-width:640px){.tiles{grid-template-columns:minmax(0,1fr)}}

/* text conversation */
.chat{height:100%;display:flex;flex-direction:column;background:#f4f3ef;font-family:var(--sans)}
.chat-top{padding:30px 14px 10px;background:#fff;border-bottom:1px solid #e6e3dc;display:flex;align-items:center;gap:10px}
.chat-top .av{background:linear-gradient(135deg,#213E65,#07111F);width:32px;height:32px}
.chat-top b{display:block;font-size:12.5px;color:#14181f}
.chat-top small{display:flex;align-items:center;gap:5px;font-size:10.5px;color:#0B6B62}
.chat-top small::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--teal)}
.chat-body{flex:1;padding:12px 10px;display:flex;flex-direction:column;gap:7px;overflow:hidden;justify-content:flex-end}
.msg{max-width:84%;padding:8px 11px;border-radius:14px;font-size:11.5px;line-height:1.4;color:#14181f;background:#fff;align-self:flex-start;border-bottom-left-radius:4px;box-shadow:0 1px 0 rgba(0,0,0,.04)}
.msg.me{align-self:flex-end;background:var(--navy);color:#fff;border-bottom-left-radius:14px;border-bottom-right-radius:4px}
.msg.sys{align-self:center;background:transparent;box-shadow:none;color:#6b7280;font-size:10px;padding:2px 0;text-align:center}
.msg.sys b{color:#8F2D1E;font-weight:700}
.msg.ok{align-self:center;background:#E7F8F5;color:#0B6B62;border:1px solid rgba(36,212,195,.5);border-radius:999px;font-weight:700;font-size:10.5px;display:flex;align-items:center;gap:6px}
.msg.ok svg{width:12px;height:12px}
.typing{align-self:flex-start;display:flex;gap:3px;padding:9px 11px;background:#fff;border-radius:14px;border-bottom-left-radius:4px}
.typing i{width:5px;height:5px;border-radius:50%;background:#9aa3ad;animation:dot 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,60%,100%{opacity:.35;transform:none}30%{opacity:1;transform:translateY(-2px)}}
.js .chat .msg{opacity:0;transform:translateY(8px);transition:opacity .35s var(--ease),transform .35s var(--ease)}
.js .chat .msg.on{opacity:1;transform:none}
.js .chat .msg:not(.on){display:none}
.chat-in{padding:9px 10px 14px;background:#fff;border-top:1px solid #e6e3dc;display:flex;gap:8px;align-items:center}
.chat-in span{flex:1;height:30px;border-radius:999px;background:#f1efea;display:flex;align-items:center;padding:0 12px;font-size:10.5px;color:#9aa3ad}
.chat-in i{width:30px;height:30px;border-radius:50%;background:var(--orange);display:grid;place-items:center;color:var(--navy-x)}
.chat-in i svg{width:13px;height:13px}

/* ---------- 7. recent work ---------- */
.work{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;margin-top:56px}
.work .card-stage{padding:34px 13% 30px 6%}
.work .dev{aspect-ratio:640/420}
.work .dev .dv-laptop{width:100%;left:0;top:0}
.work .dev .dv-phone{width:23%;right:-12%;bottom:-2%}
.work .card-meta h3 a{text-decoration:none;color:inherit;display:inline-flex;align-items:center;min-height:44px}
.work .card-meta h3 a:hover{color:#B86F00}
.work .card-meta p{font-size:16px;color:var(--body)}
@media (max-width:900px){.work{grid-template-columns:minmax(0,1fr);margin-top:40px}}

/* ---------- 8. FAQ (ACG accordion) ---------- */
.faq-wrap{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:clamp(28px,6vw,80px);align-items:start}
.faq-wrap .left{position:sticky;top:calc(var(--hd) + 32px)}
.faq-wrap .left .btn{margin-top:30px}
.acc{display:grid;gap:12px}
.acc details{background:var(--white);border:1px solid var(--divider);border-radius:10px;padding:0 22px;transition:border-color .2s}
.acc details[open]{border-color:rgba(241,154,8,.55)}
.acc summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:44px;padding:18px 0;font:700 clamp(17px,1.5vw,19px)/1.3 var(--display);color:var(--ink)}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(241,154,8,.15);color:#B86F00;font:600 20px/1 var(--sans);transition:transform .25s var(--ease)}
.acc details[open] summary::after{content:"\2013"}
.acc summary:hover::after{background:rgba(241,154,8,.28)}
.acc details p{padding-bottom:20px;max-width:65ch;font-size:16.5px}
@media (max-width:860px){.faq-wrap{grid-template-columns:minmax(0,1fr)}.faq-wrap .left{position:static}}

/* ---------- 9. quote form ---------- */
.quote-wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(36px,6vw,88px);align-items:start}
.quote-wrap .left{position:sticky;top:calc(var(--hd) + 32px)}
.quote-wrap .left .lede{margin-top:20px}
.qf{background:var(--white);border-radius:14px;border-top:3px solid var(--orange);padding:clamp(24px,3.4vw,44px);color:var(--body);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 18px;box-shadow:0 40px 90px -40px rgba(0,0,0,.7)}
.qf .f{display:grid;gap:7px;min-width:0}
.qf .full{grid-column:1/-1}
.qf label,.qf legend{font:700 14px/1.3 var(--sans);color:var(--ink)}
.qf .opt{font-weight:500;color:var(--muted)}
.qf input[type=text],.qf input[type=email],.qf input[type=tel],.qf select,.qf textarea{width:100%;min-height:48px;font:400 16px/1.4 var(--sans);color:var(--ink);background:var(--cream);border:1px solid var(--divider);border-radius:8px;padding:12px 14px;transition:border-color .2s,background .2s,box-shadow .2s}
.qf textarea{min-height:110px;resize:vertical}
.qf select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23213E65' stroke-width='1.8'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:12px 8px;padding-right:38px}
.qf input:hover,.qf select:hover,.qf textarea:hover{border-color:#C9C0AE}
.qf input:focus,.qf select:focus,.qf textarea:focus{outline:none;border-color:var(--navy);background:var(--white);box-shadow:0 0 0 3px rgba(241,154,8,.35)}
.qf .err input,.qf .err select{border-color:#B5470B}
.qf fieldset{border:0;margin:0;padding:0;min-width:0}
.qf legend{padding:0;margin-bottom:10px}
.opts{display:flex;flex-wrap:wrap;gap:10px}
.opt-c{position:relative;display:inline-flex}
.opt-c input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.opt-c span{display:inline-flex;align-items:center;gap:9px;min-height:46px;padding:11px 16px;border:1px solid var(--divider);border-radius:8px;background:var(--cream);font:700 15px/1 var(--sans);color:var(--ink);transition:background .2s,border-color .2s,color .2s}
.opt-c span::before{content:"";width:16px;height:16px;border:1.5px solid #9AA0A8;border-radius:4px;background:#fff;flex:none;transition:background .2s,border-color .2s}
.opt-c input[type=radio]+span::before{border-radius:50%}
.opt-c input:hover+span{border-color:#C9C0AE}
.opt-c input:checked+span{background:var(--navy);border-color:var(--navy);color:var(--white)}
.opt-c input:checked+span::before{background:var(--orange) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-6.5' fill='none' stroke='%2307111F' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat;border-color:var(--orange)}
.opt-c input[type=radio]:checked+span::before{background:var(--orange);box-shadow:inset 0 0 0 3px #fff}
.opt-c input:focus-visible+span{outline:2px solid var(--orange);outline-offset:2px}
.qf .ts{min-height:0}
.qf .ts.on{min-height:65px}
.qf .send{display:grid;gap:12px;justify-items:start}
.qf .send .btn{min-width:220px}
.qf .send .btn[disabled]{opacity:.65;cursor:progress;transform:none}
.qf .note{font-size:14px;color:var(--muted)}
.qf .status{display:none;font-weight:700;padding:12px 14px;border-radius:8px;font-size:15px}
.qf .status.err{display:block;background:rgba(181,71,11,.1);color:#7A1D10}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.qf-done{display:none;background:var(--white);border-radius:14px;border-top:3px solid var(--teal);padding:clamp(28px,4vw,52px);text-align:left;box-shadow:0 40px 90px -40px rgba(0,0,0,.7)}
.qf-done.on{display:block}
.qf-done .svc-ico{width:48px;height:48px;margin-bottom:18px;background:rgba(36,212,195,.12);border-color:rgba(36,212,195,.5);color:#0B6B62}
.qf-done p{font:700 clamp(22px,2.4vw,28px)/1.25 var(--display);color:var(--ink)}
@media (max-width:960px){.quote-wrap{grid-template-columns:minmax(0,1fr)}.quote-wrap .left{position:static}}
@media (max-width:560px){.qf{grid-template-columns:minmax(0,1fr)}.qf .send .btn{width:100%}}

/* ---------- footer (ACG foot2) ---------- */
.foot{position:relative;background:var(--navy-x);color:var(--mist);overflow:hidden}
.foot::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 80% at 100% 0%,rgba(36,212,195,.06),transparent 60%),radial-gradient(60% 80% at 0% 100%,rgba(241,154,8,.07),transparent 60%)}
.foot::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:44px 44px}
.foot .wrap{position:relative;z-index:1}
.foot .cols{display:grid;grid-template-columns:1.3fr 1fr .9fr 1.2fr;gap:32px;padding-block:64px 52px;font-size:15px}
.foot .fh{margin:0 0 14px;font:700 12px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--orange)}
.foot ul{list-style:none;display:grid;gap:4px}
.foot a{color:var(--mist);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.foot a:hover{color:var(--orange)}
.foot .logo{margin-bottom:16px}
.foot .about p{max-width:42ch}
.foot .parent{margin-top:8px;font-weight:700;color:var(--white)!important;text-decoration:underline;text-decoration-color:rgba(241,154,8,.7);text-underline-offset:5px}
.bottombar{position:relative;z-index:1;background:var(--navy);color:var(--mist);font-size:13px}
.bottombar .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;padding-block:16px}
.foot .map{display:block;border-radius:8px;overflow:hidden;min-height:0}.foot .map img{width:100%;height:auto;transition:opacity .2s}.foot .map:hover img{opacity:.85}
@media (max-width:900px){.foot .cols{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot .cols{grid-template-columns:minmax(0,1fr);gap:28px}}

/* ---------- sticky phone action bar ---------- */
.mbar{display:none}
@media (max-width:760px){
  .mbar{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:50;padding:7px;border-radius:12px;background:rgba(7,17,31,.94);border:1px solid var(--line-d);box-shadow:0 18px 40px -14px rgba(0,0,0,.6);transform:translateY(170%);transition:transform .35s var(--ease)}
  .bar-on .mbar{transform:none}
  .mbar a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:8px;font:700 15px/1 var(--sans);text-decoration:none}
  .mbar .a1{background:var(--orange);color:var(--navy-x)}
  .mbar .a2{color:var(--white);border:1px solid rgba(255,255,255,.22)}
  body{padding-bottom:0}
  .bottombar .wrap{padding-bottom:88px}
}

/* ---------- scroll reveals (site.js adds .js and .in) ---------- */
.js [data-rv]{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js [data-rv].in{opacity:1;transform:none}
.js [data-rv-d="1"]{transition-delay:.1s}.js [data-rv-d="2"]{transition-delay:.2s}.js [data-rv-d="3"]{transition-delay:.3s}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js [data-rv],.js .track li,.js .chat .msg{opacity:1!important;transform:none!important}
  .js .chat .msg:not(.on){display:block}
  .js .track:not(.in)>.rnbar,.js .glance:not(.in) .rnbar{transform:none}
}

/* ---------- privacy page ---------- */
.legal-hero{background:var(--navy-x);color:var(--white);padding-block:clamp(56px,8vw,96px) clamp(40px,6vw,64px);position:relative}
.legal-hero h1{color:var(--white);font-size:clamp(34px,5vw,56px);line-height:1.08;margin-top:14px}
.legal-body{padding-block:clamp(48px,7vw,88px)}
.doc{max-width:760px;font-size:17px;line-height:1.7}
.doc h2{font-size:clamp(24px,3vw,30px);margin:40px 0 12px}
.doc p,.doc ul{margin:0 0 16px}
.doc ul{padding-left:22px}
.doc a{color:var(--navy);text-decoration-color:rgba(241,154,8,.7);text-underline-offset:3px;font-weight:700}

/* ---------- review round 2 (adversarial review 2026-10-28) ---------- */
.q-steps{list-style:none;margin:34px 0 0;display:grid;gap:0;border-top:1px solid var(--line-d);counter-reset:q}
.q-steps li{counter-increment:q;display:grid;grid-template-columns:40px minmax(0,1fr);gap:2px 14px;padding:16px 0;border-bottom:1px solid var(--line-d)}
.q-steps li::before{content:"0" counter(q);grid-row:span 2;font:700 13px/1 var(--sans);color:var(--orange);letter-spacing:.08em;padding-top:5px}
.q-steps li:nth-child(2)::before{color:var(--green)}.q-steps li:nth-child(3)::before{color:var(--teal)}
.q-steps b{color:var(--white);font:700 17px/1.35 var(--display)}
.q-steps span{font-size:15px;color:var(--mist)}
.q-chips{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.q-chips .chip{background:var(--panel);border:1px solid var(--line-d)}
/* the dark price card gets a cream chip so its edge reads */
.price.navy .chip{background:var(--navy);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
/* footer: engraved backdrop like the ACG footer, wider contact column, aligned bottom bar */
.foot{background:var(--navy-x) url(../img/hero-brickell.webp) center 70%/cover no-repeat}
.foot::before{background:linear-gradient(180deg,rgba(7,17,31,.9) 0%,rgba(7,17,31,.97) 60%)}
.foot .cols{grid-template-columns:1.2fr 1.25fr .7fr 1.2fr}
@media (max-width:900px){.foot .cols{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot .cols{grid-template-columns:minmax(0,1fr)}}
.bottombar .wrap{align-items:center}
.bottombar a{min-height:44px}
/* hero engraving a little more present, as on the ACG hero */
.hero::before{background:radial-gradient(50% 60% at 0% 100%,rgba(241,154,8,.10),transparent 60%),linear-gradient(145deg,rgba(7,17,31,.93) 0%,rgba(13,30,53,.86) 50%,rgba(33,62,101,.7) 100%)}
.hero .trust a{display:inline-flex;align-items:center;min-height:44px}
.samples-foot .link{display:inline-flex;align-items:center;min-height:44px;padding-inline:4px}
@media (max-width:480px){.hero .pill{font-size:10.5px;letter-spacing:.02em;padding:5px 11px;text-wrap:balance}}
/* phone menu: a dimmed backdrop under the open menu, like the ACG mobile menu */
@media (max-width:1023px){
  .site-nav.open::after{content:"";position:fixed;left:0;right:0;top:var(--hd);bottom:0;background:rgba(7,17,31,.6);z-index:-1}
  .site-nav{z-index:1}
}
/* phones: one orange CTA at a time (the header one steps back while the action bar shows) */
@media (max-width:760px){.bar-on .hd-cta{visibility:hidden}}