/* ============================================================
   SMX MARKETING · SHARED PAGE LAYOUT
   Sister file to design-system.css (which holds tokens + base
   typography). This file holds the shared layout primitives
   used across all marketing landing pages — nav, footer, hero
   shell, sections, CTA, form, cookie.

   Current-page state is driven by `body[data-page]`. Pages set
   one of: `data-page="platform"`, `data-page="shop"`,
   `data-page="concierge"`. CSS does the rest.

   Page-specific section CSS (hero copy details, unique grids,
   editorial flourishes) lives inline in each src/ page.
   ============================================================ */

/* ─── PAGE BASELINE ─── */
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--smx-bone);color:var(--smx-text);font:400 16px/1.6 var(--smx-font-sans);font-feature-settings:"ss01";-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
body{overflow-x:hidden}
a{color:inherit;text-decoration:none}
::selection{background:var(--smx-forest);color:var(--smx-bone)}

/* ─── UTILITIES ─── */
.container{max-width:1280px;margin:0 auto;padding:0 32px;}
.hr{height:1px;background:var(--smx-rule);border:0;margin:0}
.em-red{color:var(--smx-forest);font-style:italic;font-family:var(--smx-font-serif);font-weight:500;}
.serif{font-family:var(--smx-font-serif);font-weight:400}
.mono{font-family:var(--smx-font-mono);letter-spacing:.04em;font-feature-settings:"tnum","zero";}
.caps{font:500 11px/1.4 var(--smx-font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--smx-ink);}

/* ─── NAV ─── */
nav.top{position:sticky;top:0;z-index:30;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:48px;padding:20px 32px;background:rgba(250,248,243,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--smx-rule);}
.brand{display:flex;align-items:center;height:32px;}
.brand img{height:32px;width:auto;display:block;}
.nav-monogram{display:flex;align-items:center;height:32px;transition:transform .22s ease-out;}
.nav-monogram img{height:32px;width:auto;display:block;}
.nav-monogram:hover{transform:scale(1.05);}
.nav-links{display:flex;gap:36px;justify-content:center;font-size:14px;}

/* Nav items — all <a data-nav="..."> by default. CSS differentiates state. */
.nav-links a[data-nav]{font:400 13px/1 var(--smx-font-sans);color:var(--smx-text-2);letter-spacing:-0.005em;display:inline-flex;align-items:center;gap:6px;position:relative;padding:6px 0;transition:color .22s ease-out;}
.nav-links a[data-nav]::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--smx-forest);transition:width .25s ease-out;}
.nav-links a[data-nav]:hover{color:var(--smx-ink);}
.nav-links a[data-nav]:hover::after{width:100%;}

/* Phase pill — default = live (green, for clickable links) */
.nav-phase{font:500 9px/1 var(--smx-font-mono);letter-spacing:0.12em;text-transform:uppercase;padding:3px 6px;border:1px solid var(--smx-forest);color:var(--smx-forest);}

/* Disabled placeholder (About, future items) */
.nav-links a.is-disabled{color:var(--smx-text-2);pointer-events:none;cursor:default;}
.nav-links a.is-disabled::after{display:none;}
.nav-links a.is-disabled .nav-phase{color:var(--smx-stone-700);border-color:var(--smx-rule);}

/* CURRENT page — bold + gold underline + gold pill */
body[data-page="platform"]  .nav-links a[data-nav="platform"],
body[data-page="shop"]      .nav-links a[data-nav="shop"],
body[data-page="concierge"] .nav-links a[data-nav="concierge"]{
  font-weight:500;color:var(--smx-ink);border-bottom:1px solid var(--smx-gold);
  pointer-events:none;cursor:default;
}
body[data-page="platform"]  .nav-links a[data-nav="platform"]::after,
body[data-page="shop"]      .nav-links a[data-nav="shop"]::after,
body[data-page="concierge"] .nav-links a[data-nav="concierge"]::after{display:none;}
body[data-page="platform"]  .nav-links a[data-nav="platform"] .nav-phase,
body[data-page="shop"]      .nav-links a[data-nav="shop"] .nav-phase,
body[data-page="concierge"] .nav-links a[data-nav="concierge"] .nav-phase{
  color:var(--smx-gold);border-color:var(--smx-gold);
}

/* ─── HERO SHELL ─── */
.hero{position:relative;padding:96px 0 120px;overflow:hidden;}
.hero-X{position:absolute;font-family:var(--smx-font-serif);font-style:italic;font-weight:500;color:var(--smx-gold);opacity:.08;font-size:min(96vh,920px);line-height:1;letter-spacing:-.05em;top:50%;right:-4%;transform:translateY(-50%);user-select:none;pointer-events:none;z-index:0;}
.hero .container{position:relative;z-index:1}
.eyebrow{display:inline-flex;align-items:center;gap:12px;font:500 11px/1 var(--smx-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--smx-gold);}
.eyebrow::before{content:"";width:24px;height:1px;background:var(--smx-gold)}
.hero h1{margin:28px 0 0;font-family:var(--smx-font-serif);font-weight:400;font-size:clamp(64px,9vw,124px);line-height:.98;letter-spacing:-.02em;color:var(--smx-ink);max-width:16ch;}
.hero h1 em{font-style:italic;color:var(--smx-gold);font-weight:500;}
.hero-row{display:grid;grid-template-columns:1.45fr 1fr;gap:80px;margin-top:64px;align-items:end;}
.hero-lead{font-family:var(--smx-font-serif);font-style:italic;font-size:clamp(24px,2.4vw,30px);line-height:1.32;color:var(--smx-ink-soft);max-width:34ch;margin:0;}
.hero-side{font-size:14px;line-height:1.6;color:var(--smx-text-2);max-width:36ch;padding-left:24px;border-left:1px solid var(--smx-rule);}
.hero-side b{display:block;font-family:var(--smx-font-sans);font-weight:500;color:var(--smx-ink);font-size:14px;letter-spacing:.02em;margin-bottom:8px;}

/* ─── BUTTONS ─── */
.cta-row{display:flex;gap:12px;align-items:center;margin-top:48px;flex-wrap:wrap;}
.btn{display:inline-flex;align-items:center;gap:12px;padding:14px 22px;border-radius:2px;font:500 14px/1 var(--smx-font-sans);letter-spacing:.01em;border:0;cursor:pointer;transition:background .22s ease-out,color .22s ease-out,border-color .22s ease-out;font-family:inherit;}
.btn .arr{transition:transform .25s ease-out}
.btn:hover .arr{transform:translateX(3px)}
.btn-primary{background:var(--smx-forest);color:var(--smx-bone);}
.btn-primary:hover{background:var(--smx-forest-deep);}
.btn-ghost{background:transparent;color:var(--smx-ink);border:1px solid var(--smx-stone-300);}
.btn-ghost:hover{border-color:var(--smx-ink);background:var(--smx-paper);}
.btn-on-dark{background:var(--smx-bone);color:var(--smx-ink);}
.btn-on-dark:hover{background:var(--smx-forest);color:var(--smx-bone);}
.btn-gold{background:var(--smx-gold);color:var(--smx-ink-black);}
.btn-gold:hover{background:var(--smx-gold-soft);color:var(--smx-ink-black);}

/* ─── TEXTLINK · mono caps with underline (premium pages) ─── */
.textlink{display:inline-flex;align-items:center;gap:8px;font:500 11px/1 var(--smx-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--smx-ink);border-bottom:1px solid var(--smx-rule);padding-bottom:4px;transition:color .22s ease-out,border-color .22s ease-out;}
.textlink:hover{color:var(--smx-forest);border-bottom-color:var(--smx-gold);}
.ground-dark .textlink,.ground-black .textlink{color:var(--smx-bone);border-bottom-color:rgba(245,239,227,.22);}
.ground-dark .textlink:hover,.ground-black .textlink:hover{color:var(--smx-gold-soft);border-bottom-color:var(--smx-gold-soft);}

/* ─── GOLD RULE · decorative horizontal hairline ─── */
.gold-rule{display:block;width:120px;height:1px;background:var(--smx-gold);}
.gold-rule.short{width:64px;}

/* ─── EYEBROW children · idx (gold numeral) + dot (gold square) ─── */
.eyebrow .idx{color:var(--smx-gold);}
.eyebrow .dot{width:5px;height:5px;background:var(--smx-gold);display:inline-block;}
.ground-dark .eyebrow,.ground-black .eyebrow{color:var(--smx-gold-soft);}

/* ─── DISPLAY / TITLE / BODY-LG · premium typography scale ─── */
.display{font-family:var(--smx-font-serif);font-weight:400;font-size:clamp(46px,7.4vw,116px);line-height:.98;letter-spacing:-.025em;text-wrap:balance;}
.display em{font-style:italic;font-weight:500;color:var(--smx-gold);}
.title{font-family:var(--smx-font-serif);font-weight:400;font-size:clamp(34px,4.6vw,64px);line-height:1.06;letter-spacing:-.022em;text-wrap:balance;margin:0;}
.title em{font-style:italic;font-weight:500;color:var(--smx-forest);}
.ground-dark .title em,.ground-black .title em{color:var(--smx-gold-soft);}
.body-lg{font-size:clamp(17px,1.25vw,19px);line-height:1.7;color:var(--smx-graphite);max-width:62ch;}
.ground-dark .body-lg,.ground-black .body-lg{color:rgba(250,248,243,.74);}

/* ─── SECTION GROUND SYSTEM · multi-ground rhythm for editorial pages ─── */
.ground-bone{background:var(--smx-bone);color:var(--smx-text);}
.ground-linen{background:var(--smx-linen);color:var(--smx-text);}
.ground-paper{background:var(--smx-paper);color:var(--smx-text);}
.ground-dark{background:var(--smx-forest);color:var(--smx-bone);}
.ground-black{background:var(--smx-ink-black);color:var(--smx-bone);}
.ground-dark .lead,.ground-black .lead{color:rgba(250,248,243,.72);}

/* ─── IMAGE PLACEHOLDER · bordered box for portrait slots (no JS needed) ─── */
.image-placeholder{position:relative;background:rgba(250,248,243,.04);border:1px solid var(--smx-rule);display:flex;align-items:flex-end;justify-content:flex-start;padding:24px;overflow:hidden;}
.ground-dark .image-placeholder,.ground-black .image-placeholder{background:rgba(250,248,243,.04);border-color:rgba(245,239,227,.22);}
.image-placeholder::before{content:"";position:absolute;top:-1px;right:-1px;width:48px;height:48px;border-top:1px solid var(--smx-gold);border-right:1px solid var(--smx-gold);opacity:.7;}
.image-placeholder .ph-tag{font:500 10px/1 var(--smx-font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--smx-text-3);}
.ground-dark .image-placeholder .ph-tag,.ground-black .image-placeholder .ph-tag{color:rgba(250,248,243,.4);}

/* ─── REVEAL · scroll-triggered fade-up (opt-in via .reveal class) ─── */
@media (prefers-reduced-motion: no-preference){
  html.smx-anim .reveal{opacity:0;transform:translateY(18px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1);}
  html.smx-anim .reveal.in{opacity:1;transform:none;}
  html.smx-anim .reveal[data-d="1"]{transition-delay:.08s;}
  html.smx-anim .reveal[data-d="2"]{transition-delay:.16s;}
  html.smx-anim .reveal[data-d="3"]{transition-delay:.24s;}
  html.smx-anim .reveal[data-d="4"]{transition-delay:.32s;}
}
html.smx-shown .reveal{opacity:1 !important;transform:none !important;transition:none !important;}

/* ─── HERO LEDGER ─── */
.ledger{margin-top:96px;display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--smx-rule);}
.ledger > div{padding:24px 24px 24px 0;border-right:1px solid var(--smx-rule);position:relative;transition:background .25s ease-out;cursor:default;}
.ledger > div:last-child{border-right:0}
.ledger > div:hover{background:var(--smx-paper)}
.ledger > div::after{content:"";position:absolute;left:0;top:-1px;width:0;height:1px;background:var(--smx-forest);transition:width .35s ease-out;}
.ledger > div:hover::after{width:100%}
.ledger .k{font:500 10px/1 var(--smx-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--smx-text-3);padding-left:24px;}
.ledger > div:first-child .k{padding-left:0}
.ledger .v{font-family:var(--smx-font-serif);font-weight:400;font-size:28px;line-height:1.1;letter-spacing:-.01em;margin-top:10px;padding-left:24px;color:var(--smx-ink);}
.ledger > div:first-child .v{padding-left:0}
.ledger .v em{font-style:italic;color:var(--smx-gold);font-weight:500;}

/* ─── SECTION SHELL ─── */
section.block{padding:128px 0;}
section.block.alt{background:var(--smx-linen);border-top:1px solid var(--smx-rule);border-bottom:1px solid var(--smx-rule);}
.section-head{display:grid;grid-template-columns:1fr 1.3fr;gap:80px;margin-bottom:72px;align-items:end;}
h2.section-title{font-family:var(--smx-font-serif);font-weight:400;font-size:clamp(44px,5.6vw,72px);line-height:1.02;letter-spacing:-.015em;margin:20px 0 0;max-width:18ch;color:var(--smx-ink);}
h2.section-title em{font-style:italic;color:var(--smx-forest);font-weight:500;}
.lead{font:italic 400 22px/1.4 var(--smx-font-serif);color:var(--smx-ink-soft);max-width:48ch;margin:0;}
.lead em{font-style:italic;color:var(--smx-forest);font-weight:500;}
.closer{margin-top:48px;font-family:var(--smx-font-serif);font-style:italic;font-size:28px;line-height:1.3;letter-spacing:-.005em;max-width:42ch;color:var(--smx-ink-soft);}
.closer em{color:var(--smx-forest);font-weight:500;}

/* ─── 3-COL GRID ─── */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--smx-rule);border-bottom:1px solid var(--smx-rule);}
.pcol{padding:40px 32px 44px;border-right:1px solid var(--smx-rule);position:relative;transition:background .25s ease-out;}
.pcol:last-child{border-right:0}
.pcol:hover{background:var(--smx-paper);}
.pcol::before{content:"";position:absolute;left:0;top:-1px;width:0;height:2px;background:var(--smx-forest);transition:width .4s ease-out;}
.pcol:hover::before{width:100%}
.pcol .num{font-family:var(--smx-font-mono);font-size:11px;letter-spacing:.14em;color:var(--smx-text-3);}
.pcol h3{font-family:var(--smx-font-serif);font-weight:400;font-size:30px;line-height:1.1;letter-spacing:-.01em;margin:20px 0 18px;color:var(--smx-ink);}
.pcol h3 em{font-style:italic;color:var(--smx-forest);font-weight:500;}
.pcol p{font-size:15px;line-height:1.6;color:var(--smx-graphite);margin:0 0 28px;max-width:34ch;}
.pcol .icon{width:38px;height:38px;border:1px solid var(--smx-stone-300);display:flex;align-items:center;justify-content:center;color:var(--smx-ink);transition:background .25s ease-out,color .25s ease-out,border-color .25s ease-out;}
.pcol:hover .icon{background:var(--smx-ink);color:var(--smx-bone);border-color:var(--smx-ink);}
.pcol .icon svg{width:18px;height:18px;stroke-width:1.5;}
.pcol .foot{display:flex;justify-content:space-between;align-items:center;margin-top:36px;padding-top:18px;border-top:1px dashed var(--smx-rule);font-family:var(--smx-font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--smx-text-3);}

/* ─── CTA · DARK ─── */
:root{--smx-cta-bg:#0A0A0A;--smx-cta-fg:#FAF8F4;--smx-cta-x:var(--smx-gold-soft);--smx-cta-x-opacity:.16;--smx-cta-rule:rgba(245,239,227,.22);--smx-cta-eyebrow:var(--smx-gold-soft);}
.cta{position:relative;background:var(--smx-cta-bg);color:var(--smx-cta-fg);padding:120px 0;overflow:hidden;}
.cta-X{position:absolute;font-family:var(--smx-font-serif);font-style:italic;font-weight:500;color:var(--smx-cta-x);opacity:var(--smx-cta-x-opacity);font-size:min(120vh,1100px);line-height:1;letter-spacing:-.05em;top:50%;left:-2%;transform:translateY(-50%);user-select:none;pointer-events:none;}
.cta .container{position:relative;z-index:1}
.cta .eyebrow{color:var(--smx-gold-soft);opacity:.85;}
.cta .eyebrow::before{background:var(--smx-gold-soft);opacity:.7;}
.cta h2{font-family:var(--smx-font-serif);font-weight:400;font-size:clamp(56px,8vw,108px);line-height:.98;letter-spacing:-.02em;margin:24px 0 24px;max-width:14ch;color:var(--smx-bone);}
.cta h2 em{font-style:italic;color:var(--smx-gold-soft);font-weight:500;}
.cta-sub{font:italic 400 18px/1.4 var(--smx-font-serif);color:rgba(250,248,243,.55);margin:0 0 72px;letter-spacing:-.005em;max-width:40ch;}
.cta-cols{display:grid;grid-template-columns:1fr 1fr;gap:96px;}
.cta-col h3{font-family:var(--smx-font-serif);font-weight:400;font-style:italic;font-size:32px;letter-spacing:-.005em;margin:0 0 16px;color:var(--smx-bone);}
.cta-col > p{font-size:16px;line-height:1.6;color:rgba(250,248,243,.7);max-width:42ch;margin:0 0 32px;}

/* ─── FORM ─── */
.form-row{display:flex;gap:0;align-items:center;border:1px solid rgba(250,248,243,.22);background:rgba(250,248,243,.04);transition:border-color .22s ease-out,background .22s ease-out;}
.form-row:focus-within{border-color:var(--smx-bone);background:rgba(250,248,243,.08);}
.form-row input{flex:1;background:transparent;border:0;outline:0;padding:14px 18px;color:var(--smx-bone);font-family:inherit;font-size:15px;}
.form-row input::placeholder{color:rgba(250,248,243,.4)}
.form-row button{padding:14px 22px;background:var(--smx-forest);color:var(--smx-bone);font-weight:500;font-family:inherit;border:0;cursor:pointer;font-size:13.5px;display:inline-flex;align-items:center;gap:8px;letter-spacing:.01em;transition:background .22s ease-out;border-radius:0;}
.form-row button:hover{background:var(--smx-forest-deep);}
.form-row button .arr{transition:transform .25s ease-out}
.form-row button:hover .arr{transform:translateX(3px)}

.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;}
.chip{padding:8px 14px;background:transparent;border:1px solid rgba(250,248,243,.2);font-family:var(--smx-font-mono);font-size:11px;letter-spacing:.06em;color:rgba(250,248,243,.75);cursor:pointer;transition:all .22s ease-out;}
.chip:hover{border-color:rgba(250,248,243,.55);color:var(--smx-bone);}
.chip.active{background:var(--smx-forest);border-color:var(--smx-forest);color:var(--smx-bone);}
.micro{margin-top:14px;font:400 12px/1 var(--smx-font-mono);letter-spacing:.04em;color:rgba(250,248,243,.45);}

.investor-link{display:inline-flex;align-items:center;gap:14px;padding:14px 22px;border:1px solid rgba(250,248,243,.25);color:var(--smx-bone);font-size:14.5px;transition:background .22s ease-out,border-color .22s ease-out;}
.investor-link:hover{background:var(--smx-bone);color:var(--smx-ink);border-color:var(--smx-bone);}
.investor-link .arr{transition:transform .25s ease-out}
.investor-link:hover .arr{transform:translateX(4px)}

/* ─── FOOTER ─── */
footer{padding:96px 0 40px;background:var(--smx-bone);border-top:1px solid var(--smx-rule);}
.foot-inner{max-width:1280px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:64px;}
.foot-brand{font-family:var(--smx-font-serif);font-weight:400;font-size:32px;line-height:1.15;max-width:22ch;letter-spacing:-.005em;color:var(--smx-ink);}
.foot-brand em{font-style:italic;color:var(--smx-forest);font-weight:500;}
.foot-email{margin-top:24px;font:400 13px/1 var(--smx-font-mono);color:var(--smx-text-3);letter-spacing:.04em;}
.foot-email a{color:var(--smx-ink);position:relative;}
.foot-email a::after{content:"";position:absolute;left:0;bottom:-3px;width:100%;height:1px;background:var(--smx-forest);transform:scaleX(0);transform-origin:left;transition:transform .3s ease-out}
.foot-email a:hover::after{transform:scaleX(1)}
.foot-col h6{font:500 11px/1 var(--smx-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--smx-text-3);margin:0 0 18px;font-weight:500;}
.foot-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.foot-col a{font-size:14.5px;color:var(--smx-ink-soft);transition:color .22s ease-out;}
.foot-col a:hover{color:var(--smx-forest);}
.foot-col a.is-disabled{color:var(--smx-stone-700);cursor:default;pointer-events:none;}
.foot-col span.tag{font-family:var(--smx-font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--smx-text-3);margin-left:8px;}

/* CURRENT product in footer — ink, weight 500, no hover */
body[data-page="platform"]  .foot-col a[data-foot="platform"],
body[data-page="shop"]      .foot-col a[data-foot="shop"],
body[data-page="concierge"] .foot-col a[data-foot="concierge"]{
  color:var(--smx-ink);font-weight:500;pointer-events:none;cursor:default;
}

.foot-meta{max-width:1280px;margin:64px auto 0;padding:24px 32px 0;border-top:1px solid var(--smx-rule);display:flex;justify-content:space-between;font-family:var(--smx-font-mono);font-size:11px;letter-spacing:.06em;color:var(--smx-text-3);}

/* ─── COOKIE ─── */
.cookie{position:fixed;bottom:24px;left:24px;right:24px;max-width:560px;margin:0 auto;background:var(--smx-ink-black);color:var(--smx-bone);border:1px solid var(--smx-graphite);padding:18px 20px;display:flex;align-items:center;gap:18px;font-size:13px;line-height:1.45;z-index:50;transform:translateY(140%);opacity:0;transition:opacity .5s ease-out,transform .55s ease-out;}
.cookie.show{transform:translateY(0);opacity:1;}
.cookie p{margin:0;flex:1;color:rgba(250,248,243,.78);}
.cookie .btns{display:flex;gap:8px;}
.cookie button{padding:8px 14px;background:transparent;color:var(--smx-bone);border:1px solid rgba(250,248,243,.25);cursor:pointer;font-family:inherit;font-size:12.5px;transition:all .22s ease-out;}
.cookie button.accept{background:var(--smx-forest);border-color:var(--smx-forest);}
.cookie button:hover{border-color:var(--smx-bone);}
.cookie button.accept:hover{background:var(--smx-forest-deep);border-color:var(--smx-forest-deep);}

/* ─── RESPONSIVE ─── */
@media (max-width:980px){
  .cta-cols,.hero-row,.foot-inner,.section-head{grid-template-columns:1fr;gap:24px;}
  .grid-3{grid-template-columns:1fr;}
  .grid-3 .pcol{border-right:0;border-bottom:1px solid var(--smx-rule);}
  .grid-3 .pcol:last-child{border-bottom:0;}
  .ledger{grid-template-columns:repeat(2,1fr)}
  .ledger > div{border-bottom:1px solid var(--smx-rule);padding-left:0!important;}
  .ledger .k,.ledger .v{padding-left:24px!important;}
  .ledger > div:nth-child(odd) .k, .ledger > div:nth-child(odd) .v{padding-left:0!important;}
  .hero{padding:64px 0 80px}
  section.block{padding:80px 0}
  .container{padding:0 22px}
  .foot-inner{padding:0 22px}
  .cta{padding:80px 0}
  nav.top{grid-template-columns:auto auto;gap:16px}
  .nav-links{display:none}
}