/* OwnBrand Fitness — public site. Static port of the light-editorial marketing
   design (v2). Two palettes, switched by data-palette on <main>:
   "blue" — editorial direction with the light-blue flood. White on the blue
   flood is only 2.98:1, so blue surfaces carry near-black ink (#06121c).
   "mono" — the OwnBrand identity (brand-spec.md): Ink/Bone/Stone/Fog, no
   accent hue. Every colour resolves through the tokens, so one word swaps
   the whole site. */

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; }
h1, h2, h3, p { margin: 0; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
img { max-width: 100%; }
[hidden] { display: none !important; }

.marketing{
  --font-display:"Archivo";
  --font-body:"Schibsted Grotesk";
  --font-serif:"Instrument Serif";
  --font-mono:"Geist Mono";
  --mk-w:min(1400px,calc(100% - 48px));
  background:var(--mk-paper); color:var(--mk-ink);
  font-family:var(--font-body),system-ui,sans-serif; letter-spacing:-.01em;
  font-size:16px; line-height:1.5;
}
.marketing[data-palette="blue"]{
  --mk-paper:#F2F0EB; --mk-paper-alt:#E7E4DD; --mk-ink:#0E1116;
  --mk-flood:#0f9fe0; --mk-flood-deep:#0f86d0; --mk-strong:#0a6699;
  --mk-on-flood:#06121c; --mk-on-flood-soft:#46b6ee;
  --mk-em:#0f86d0; --mk-dim:#4B5058; --mk-nav-link:#33383F;
  --mk-flood-rgb:15,159,224; --mk-on-flood-rgb:6,18,28;
  --mk-ink-rgb:14,17,22; --mk-paper-rgb:242,240,235;
}
.marketing[data-palette="mono"]{
  --mk-paper:#F7F5F0; --mk-paper-alt:#E5E2DA; --mk-ink:#16161A;
  --mk-flood:#16161A; --mk-flood-deep:#0E0E11; --mk-strong:#16161A;
  --mk-on-flood:#F7F5F0; --mk-on-flood-soft:#F7F5F0;
  --mk-em:#8A857B; --mk-dim:#8A857B; --mk-nav-link:#4A4740;
  --mk-flood-rgb:22,22,26; --mk-on-flood-rgb:247,245,240;
  --mk-ink-rgb:22,22,26; --mk-paper-rgb:247,245,240;
}
.marketing{
  --mk-line:rgba(var(--mk-ink-rgb),.14);
  --mk-line-flood:rgba(var(--mk-on-flood-rgb),.24);
  --mk-line-ink:rgba(var(--mk-paper-rgb),.16);
  --mk-dim-ink:rgba(var(--mk-paper-rgb),.66);
}
.marketing ::selection{background:var(--mk-flood);color:var(--mk-on-flood)}
.marketing h1,.marketing h2,.marketing h3{font-family:var(--font-display),system-ui,sans-serif;font-weight:600;letter-spacing:-.055em;line-height:.94;margin:0}
.marketing em{font-family:var(--font-serif),Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.02em;color:var(--mk-em)}
.marketing a{color:inherit}
/* Anchors on the flood surface need their own colour (cascade: `.marketing a`
   out-specifies the button classes). */
.marketing a.mk-nav-cta,.marketing a.mk-btn-blue{color:var(--mk-on-flood)}
.marketing a.mk-btn-ink{color:var(--mk-paper)}
.marketing{overflow:clip}
.marketing :is(a,button,summary):focus-visible{outline:3px solid var(--mk-flood-deep);outline-offset:3px}
.marketing :is(section[id],footer[id]){scroll-margin-top:88px}
.mk-index{font:11px var(--font-mono),monospace;letter-spacing:.14em;text-transform:uppercase;color:#5B6068;margin:0}

/* --- nav --- */
.mk-nav{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:24px;
  width:var(--mk-w);margin:0 auto;min-height:70px;background:rgba(var(--mk-paper-rgb),.88);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--mk-line);flex-wrap:wrap}
.mk-brand{display:flex;align-items:center;gap:12px;font-weight:600;text-decoration:none;font-size:15px;font-family:var(--font-display),sans-serif}
/* Identity tile: the mark on the flood tile, one colour, never recoloured. */
.mk-mark{display:grid;place-items:center;width:30px;height:30px;background:var(--mk-flood);border-radius:7px}
.mk-mark svg{width:26px;height:26px;display:block}
.mk-mark svg rect{fill:var(--mk-on-flood)}
.mk-nav nav{display:flex;gap:26px}
.mk-nav nav a{font:11px var(--font-mono),monospace;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--mk-nav-link)}
.mk-nav nav a:hover{color:var(--mk-strong)}
.mk-nav-actions{display:flex;align-items:center;gap:10px}
.mk-nav-cta{background:var(--mk-flood);color:var(--mk-on-flood);text-decoration:none;padding:12px 20px;font-weight:600;font-size:14px;min-height:44px;display:inline-flex;align-items:center}
.mk-nav-cta:hover{background:var(--mk-flood-deep)}
.mk-menu-button,.mk-nav .mk-mobile-nav{display:none}

/* --- buttons (square; flood surfaces carry ink text) --- */
.mk-btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 24px;font-weight:600;font-size:15px;
  text-decoration:none;border:1px solid transparent;cursor:pointer;transition:background .18s,color .18s,transform .18s}
.mk-btn-blue{background:var(--mk-flood);color:var(--mk-on-flood)}
.mk-btn-blue:hover{background:var(--mk-flood-deep);transform:translateY(-2px)}
.mk-btn-outline{background:transparent;color:var(--mk-ink);border-color:var(--mk-ink)}
.mk-btn-outline:hover{background:var(--mk-ink);color:var(--mk-paper)}
.mk-btn-ink{background:var(--mk-ink);color:var(--mk-paper)}
.mk-btn-ink:hover{transform:translateY(-2px)}

/* --- hero --- */
.mk-hero{width:var(--mk-w);margin:0 auto;padding:clamp(44px,6vw,82px) 0 clamp(48px,6vw,88px)}
.mk-hero-meta{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-bottom:clamp(28px,4vw,52px)}
.mk-eyebrow{display:flex;align-items:center;gap:10px;font:11px var(--font-mono),monospace;letter-spacing:.14em;text-transform:uppercase;color:#5B6068}
.mk-dot{width:7px;height:7px;background:var(--mk-flood);border-radius:50%;animation:mkPulse 2.6s ease-in-out infinite}
@keyframes mkPulse{0%,100%{opacity:1}50%{opacity:.25}}
.mk-hero-layout{display:grid;grid-template-columns:minmax(0,1.22fr) minmax(280px,.58fr);gap:clamp(42px,6vw,96px);align-items:center}
.mk-hero-copy{min-width:0}
.mk-hero h1{font-size:clamp(54px,7.5vw,112px);line-height:.86;letter-spacing:-.06em;text-wrap:balance}
.mk-period{display:inline-block;width:.11em;height:.11em;background:var(--mk-ink);margin-left:.06em;vertical-align:baseline}
.mk-lede{max-width:60ch;padding-top:clamp(26px,3vw,42px);font-size:clamp(16px,1.35vw,20px);line-height:1.55;color:var(--mk-nav-link)}
.mk-hero-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:26px}
.mk-hero-product{position:relative;display:grid;justify-items:center;padding:34px 22px 20px;background:var(--mk-paper-alt);border:1px solid var(--mk-line);min-width:0}
.mk-phone-hero{width:min(320px,90%);box-shadow:0 32px 70px rgba(14,17,22,.24)}
.mk-product-rail{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.mk-product-rail span{font:8px var(--font-mono),monospace;letter-spacing:.13em;color:#5B6068}

/* --- flood block --- */
.mk-blue{background:var(--mk-flood);color:var(--mk-on-flood)}
.mk-blue-inner{width:var(--mk-w);margin:0 auto;padding:clamp(64px,8vw,116px) 0;display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,5vw,72px);align-items:center}
.mk-blue .mk-index{color:rgba(var(--mk-on-flood-rgb),.66)}
.mk-blue h2{font-size:clamp(32px,5vw,68px);max-width:14ch}
.mk-blue .mk-blue-copy>p{margin-top:22px;max-width:52ch;font-size:clamp(15px,1.3vw,19px);line-height:1.55;color:rgba(var(--mk-on-flood-rgb),.82)}
.mk-blue em{color:var(--mk-on-flood)}
.mk-control-card{background:var(--mk-on-flood);color:var(--mk-paper);border:1px solid rgba(var(--mk-on-flood-rgb),.35);padding:clamp(26px,4vw,46px);box-shadow:0 30px 80px rgba(6,18,28,.20)}
.mk-control-card .mk-index{color:rgba(var(--mk-paper-rgb),.58)}
.mk-control-card h3{font-size:clamp(28px,3vw,44px);max-width:12ch;margin:18px 0 30px}
/* Ownership split: ticks = what the creator keeps; dashes = the platform's work. */
.mk-control{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:26px 32px;
  border-top:1px solid rgba(var(--mk-paper-rgb),.18);padding-top:26px}
.mk-control-label{margin:0 0 16px;font:10px var(--font-mono),monospace;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(var(--mk-paper-rgb),.58)}
.mk-control ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.mk-control li{position:relative;padding-left:26px;font-size:14px;line-height:1.5}
.mk-control li::before{content:"";position:absolute;left:2px;top:.3em;width:11px;height:6px;
  border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg)}
.mk-control-mine li{color:rgba(var(--mk-paper-rgb),.72)}
.mk-control-mine li::before{top:.62em;left:0;width:12px;height:0;border-left:0;
  border-bottom:2px solid rgba(var(--mk-paper-rgb),.45);transform:none}

/* --- phone frame --- */
.mk-phone{position:relative;width:min(300px,74%);aspect-ratio:9/17.4;background:var(--mk-ink);border-radius:44px;
  padding:14px;box-shadow:0 40px 90px rgba(6,14,60,.42)}
.mk-phone-top{display:flex;align-items:center;justify-content:space-between;padding:6px 12px 12px}
.mk-phone-top span,.mk-phone-top i{width:26px;height:4px;background:rgba(var(--mk-paper-rgb),.26);border-radius:99px}
.mk-phone-top b{font:9px var(--font-mono),monospace;letter-spacing:.2em;color:var(--mk-on-flood-soft)}
/* Real captures, anchored to the top so the header stays visible. */
img.mk-shot{display:block;width:100%;height:auto;object-fit:cover;object-position:top center;border-radius:12px}
.mk-phone img.mk-shot{height:calc(100% - 34px);border-radius:32px}

/* --- generic section + heads --- */
.mk-section{width:var(--mk-w);margin:0 auto;padding:clamp(64px,8vw,120px) 0;border-bottom:1px solid var(--mk-line)}
.mk-head{display:flex;gap:clamp(20px,3vw,48px);align-items:flex-end;flex-wrap:wrap;padding-bottom:clamp(30px,4vw,52px)}
.mk-head .mk-index{flex:0 0 130px}
.mk-head h2{flex:1 1 440px;font-size:clamp(30px,4.6vw,66px)}
.mk-kicker{flex:0 1 320px;font-size:15px;line-height:1.55;color:var(--mk-dim)}
.mk-head-faq{padding-top:clamp(48px,6vw,88px)}

/* --- hairline card grids --- */
.mk-grid{display:grid;gap:1px;background:var(--mk-line);border:1px solid var(--mk-line)}
.mk-grid>article{background:var(--mk-paper);padding:26px;display:flex;flex-direction:column;gap:10px;transition:background .18s}
.mk-grid>article:hover{background:#fff}
.mk-grid h3{font-size:18px;letter-spacing:-.03em}
.mk-grid p{font-size:14px;line-height:1.55;color:var(--mk-dim)}
.mk-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.mk-app-grid>article{overflow:hidden}
.mk-app-grid h3{font-size:26px}
.mk-app-grid .mk-index{color:var(--mk-strong);font-size:9px}
.mk-app-grid img{margin-top:12px}
.mk-feature-tags{display:flex;gap:7px;flex-wrap:wrap;list-style:none;padding:0;margin:4px 0 2px}
.mk-feature-tags li{border:1px solid var(--mk-line);padding:6px 8px;font:8px var(--font-mono),monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--mk-strong)}
.mk-swipe-hint{display:none;margin:0 0 14px;font:10px var(--font-mono),monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--mk-dim)}
/* --- ink section --- */
.mk-ink{background:var(--mk-ink);color:var(--mk-paper);padding:clamp(64px,8vw,120px) 0}
.mk-ink .mk-head,.mk-ink .mk-grid{width:var(--mk-w);margin-inline:auto}
.mk-ink .mk-index{color:rgba(var(--mk-paper-rgb),.55)}
.mk-ink .mk-kicker{color:var(--mk-dim-ink)}
.mk-ink em{color:var(--mk-on-flood-soft)}
.mk-ink .mk-grid{background:var(--mk-line-ink);border-color:var(--mk-line-ink)}
.mk-ink .mk-grid>article{background:var(--mk-ink)}
.mk-ink .mk-grid>article:hover{background:#141A24}
.mk-ink .mk-grid p{color:var(--mk-dim-ink)}

/* --- process rows --- */
.mk-process{border-top:1px solid var(--mk-line)}
.mk-row{display:grid;grid-template-columns:56px minmax(140px,230px) minmax(0,1fr);gap:22px;align-items:center;
  padding:26px 0 26px 8px;border-bottom:1px solid var(--mk-line);transition:background .3s,padding-left .3s}
.mk-row:hover{background:#fff;padding-left:20px}
.mk-row h3{font-size:22px;letter-spacing:-.04em}
.mk-row p{font-size:14px;line-height:1.55;color:var(--mk-dim)}
/* --- the offer --- */
.mk-pricing{background:var(--mk-paper-alt);padding:clamp(64px,8vw,120px) 0}
.mk-pricing .mk-head,.mk-tiers{width:var(--mk-w);margin-inline:auto}
.mk-pricing .mk-head{display:block;padding-bottom:clamp(30px,4vw,48px)}
.mk-pricing .mk-head .mk-index{margin-bottom:18px}
.mk-pricing .mk-head h2{max-width:14ch}
.mk-tiers{display:grid;gap:1px;background:var(--mk-line);border:1px solid var(--mk-line)}
.mk-tiers-single{grid-template-columns:1fr}
.mk-tiers-single .mk-tier{padding:clamp(30px,3.5vw,52px)}
.mk-tiers-single .mk-tier ul{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(32px,5vw,80px);row-gap:12px}
.mk-tiers-single .mk-tier-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.mk-tiers-single .mk-tier-head .mk-btn{margin:0}
.mk-tier{background:var(--mk-paper);padding:clamp(26px,3vw,40px);display:flex;flex-direction:column;gap:12px}
.mk-tier-sub{font-size:14px;color:var(--mk-dim)}
.mk-tier ul{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:9px}
.mk-tier li{font-size:14px;line-height:1.45;padding-left:18px;position:relative;color:var(--mk-nav-link)}
.mk-tier li::before{content:"";position:absolute;left:0;top:.58em;width:7px;height:1px;background:var(--mk-flood-deep)}
.mk-tier .mk-btn{margin-top:auto;align-self:flex-start}
.mk-tier-feature{background:var(--mk-flood);color:var(--mk-on-flood)}
.mk-tier-feature .mk-index,.mk-tier-feature .mk-tier-sub,.mk-tier-feature li{color:rgba(var(--mk-on-flood-rgb),.78)}
.mk-tier-feature li::before{background:var(--mk-on-flood)}
/* --- fit + faq --- */
.mk-fit{display:grid;gap:1px;background:var(--mk-line);border:1px solid var(--mk-line)}
.mk-fit p{background:var(--mk-paper);padding:20px 24px;display:flex;gap:18px;align-items:baseline;margin:0}
.mk-fit b{font:11px var(--font-mono),monospace;color:var(--mk-strong);letter-spacing:.1em}
.mk-fit span{font-size:clamp(15px,1.5vw,20px);line-height:1.45}
.mk-faq{border-top:1px solid var(--mk-line)}
.mk-faq details{border-bottom:1px solid var(--mk-line)}
.mk-faq summary{list-style:none;cursor:pointer;padding:22px 0;display:flex;justify-content:space-between;gap:20px;
  align-items:center;font-family:var(--font-display),sans-serif;font-size:clamp(16px,1.7vw,22px);font-weight:600;letter-spacing:-.03em}
.mk-faq summary::-webkit-details-marker{display:none}
.mk-faq summary i{font-style:normal;color:var(--mk-flood-deep);font-size:22px;transition:transform .2s}
.mk-faq details[open] summary i{transform:rotate(45deg)}
.mk-faq details p{padding:0 0 22px;max-width:74ch;font-size:15px;line-height:1.6;color:var(--mk-dim)}

/* --- CTA + contact card --- */
.mk-cta-inner{grid-template-columns:minmax(0,1fr) minmax(0,520px);align-items:start}
.mk-cta h2{font-size:clamp(34px,5.6vw,84px);max-width:12ch}
.mk-cta-copy>p{margin-top:20px;max-width:50ch;font-size:clamp(15px,1.3vw,18px);line-height:1.55;color:rgba(var(--mk-on-flood-rgb),.82)}
.mk-form-card{background:var(--mk-paper);padding:clamp(24px,3vw,34px);color:var(--mk-ink)}
.mk-form-head{display:flex;justify-content:space-between;align-items:center;gap:14px;padding-bottom:18px;
  border-bottom:1px solid var(--mk-line);font:10px var(--font-mono),monospace;letter-spacing:.14em;text-transform:uppercase;color:#5B6068}
.marketing form label{display:block;margin-top:16px;font:10px var(--font-mono),monospace;letter-spacing:.12em;
  text-transform:uppercase;color:#5B6068}
.marketing form input,.marketing form textarea{width:100%;margin-top:8px;padding:13px 14px;min-height:48px;
  background:#fff;border:1px solid var(--mk-line);border-radius:0;color:var(--mk-ink);font:15px var(--font-display),sans-serif;
  letter-spacing:-.01em;outline:none;transition:border-color .18s,box-shadow .18s}
.marketing form textarea{resize:vertical;line-height:1.5}
.marketing form input:focus,.marketing form textarea:focus{border-color:var(--mk-flood-deep);box-shadow:0 0 0 3px rgba(var(--mk-flood-rgb),.18)}
.mk-field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mk-submit{width:100%;justify-content:center;margin-top:20px}
.mk-submit:disabled{opacity:.42;cursor:not-allowed;transform:none}
.mk-form-error{margin-top:16px;border:1px solid rgba(176,58,46,.4);background:rgba(176,58,46,.07);padding:12px 14px;display:grid;gap:5px}
.mk-form-error b{font:10px var(--font-mono),monospace;letter-spacing:.12em;text-transform:uppercase;color:#8E2F26}
.mk-form-error span{font-size:13px;color:#7A342C}
.mk-form-error a{font-weight:600;text-underline-offset:3px}
.mk-sent h3{font-size:26px;margin:10px 0}
.mk-sent>p{font-size:14px;line-height:1.55;color:var(--mk-dim)}
.mk-sent-actions{display:flex;align-items:center;gap:18px;margin-top:20px;flex-wrap:wrap}
.mk-text-btn{border:0;background:none;padding:0;color:var(--mk-strong);cursor:pointer;font:13px var(--font-display),sans-serif;
  text-decoration:underline;text-underline-offset:4px}
.mk-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.mk-noscript{margin-top:0;margin-bottom:4px}
/* --- footer --- */
.mk-footer{background:var(--mk-ink);color:var(--mk-paper);display:grid;grid-template-columns:1fr auto;
  align-items:center;gap:20px;padding:clamp(30px,4vw,46px) max(24px,calc((100% - 1400px)/2));font-size:13px}
.mk-footer a{text-decoration:none;color:var(--mk-on-flood-soft)}
.mk-footer .mk-brand{color:var(--mk-paper)}
.mk-footer-links{display:flex;justify-content:flex-end;gap:18px;align-items:center}

/* --- legal page --- */
.mk-legal{min-height:100vh;background:var(--mk-paper);color:var(--mk-ink);font-family:var(--font-body),system-ui,sans-serif}
.mk-legal-main{width:min(760px,calc(100% - 40px));margin:0 auto;padding:clamp(56px,8vw,100px) 0}
.mk-legal-main h1{font-family:var(--font-display),system-ui,sans-serif;font-size:clamp(42px,7vw,76px);line-height:.95;letter-spacing:-.055em;margin:18px 0 24px}
.mk-legal-main h2{font-family:var(--font-display),system-ui,sans-serif;font-size:25px;letter-spacing:-.035em;margin:38px 0 12px}
.mk-legal-main p,.mk-legal-main li{font-size:15px;line-height:1.7;color:var(--mk-nav-link)}
.mk-legal-main ul{padding-left:20px}
.mk-legal-main a{text-underline-offset:3px}
.mk-legal-back{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600}
.mk-legal-date{font:10px var(--font-mono),monospace;letter-spacing:.12em;text-transform:uppercase;color:#5B6068}

/* --- responsive: 4 -> 2 -> 1, never 3-with-4-children --- */
@media(max-width:1150px){
  .mk-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mk-blue-inner,.mk-cta-inner{grid-template-columns:1fr}
}
@media(max-width:900px){
  .mk-hero-layout{grid-template-columns:1fr}
  .mk-hero-copy{max-width:760px}
  .mk-hero-product{width:min(520px,100%);margin:0 auto}
}
@media(max-width:860px){
  .mk-row{grid-template-columns:44px 1fr;row-gap:8px}
  .mk-row p{grid-column:1/-1}
  .mk-tiers{grid-template-columns:1fr}
  .mk-tiers-single .mk-tier ul{grid-template-columns:1fr}
  .mk-footer{grid-template-columns:1fr;justify-items:center}
  .mk-footer-links{justify-content:center;flex-wrap:wrap}
}
@media(max-width:640px){
  .marketing{--mk-w:min(1400px,calc(100% - 32px))}
  .mk-nav{min-height:70px;flex-wrap:nowrap;gap:10px}
  .mk-brand{min-width:0}
  .mk-brand>span:last-child{display:none}
  .mk-desktop-nav{display:none!important}
  .mk-nav-actions{margin-left:auto}
  .mk-nav-cta{padding-inline:14px;font-size:13px}
  .mk-menu-button{display:inline-flex;align-items:center;justify-content:center;min-width:58px;min-height:44px;padding:0 10px;
    border:1px solid var(--mk-ink);background:transparent;color:var(--mk-ink);font:10px var(--font-mono),monospace;
    letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
  .mk-nav .mk-mobile-nav{position:absolute;display:grid;top:calc(100% + 1px);left:0;right:0;background:var(--mk-paper);
    border-bottom:1px solid var(--mk-line);box-shadow:0 16px 30px rgba(var(--mk-ink-rgb),.12)}
  .mk-nav .mk-mobile-nav[hidden]{display:none}
  .mk-mobile-nav a{min-height:48px;display:flex;align-items:center;padding:0 16px;border-top:1px solid var(--mk-line);
    font:11px var(--font-mono),monospace;letter-spacing:.14em;text-transform:uppercase;text-decoration:none}
  .mk-grid-4:not(.mk-app-grid){grid-template-columns:1fr}
  .mk-app-grid{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(280px,82vw);overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:inline mandatory;scrollbar-width:thin;background:transparent;border:0;gap:12px;padding-bottom:12px}
  .mk-app-grid>article{scroll-snap-align:start;border:1px solid var(--mk-line)}
  .mk-swipe-hint{display:block}
  .mk-field-row{grid-template-columns:1fr}
  .mk-hero-meta{flex-direction:column;gap:10px}
  .mk-hero h1{font-size:clamp(50px,16vw,74px)}
  .mk-hero-product{padding-inline:12px}
  .mk-phone-hero{width:min(280px,88%)}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .mk-dot{animation:none}
  .mk-btn,.mk-row{transition:none}
}

/* Offer footnote: price shape only — the number lives in each customer's SOW. */
.mk-offer-note { margin-top: 18px; font-size: 0.92rem; line-height: 1.5; color: var(--mk-dim-ink); }