/* WiseSpark Studio — one stylesheet for every page. Source: site-src/style.css (copied by build.py). */
@font-face{font-family:"Host Grotesk";src:url(/assets/fonts/host-grotesk-latin-wght.woff2) format("woff2");font-weight:300 800;font-display:swap}

:root{
  --bg:#fff; --surface:#fff; --surface-2:#f4f5f7;
  --ink:#14161b; --ink-2:#3b404b; --muted:#5f6573;
  --hair:rgba(20,22,27,.10); --hair-2:rgba(20,22,27,.16);
  --tint:#14161b; --tint-ink:#14161b;
  --font:"Host Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --shadow:0 1px 2px rgba(20,22,27,.05),0 22px 50px -22px rgba(20,22,27,.30);
  --icon-shadow:drop-shadow(0 10px 18px rgba(20,22,27,.20)) drop-shadow(0 2px 3px rgba(20,22,27,.10));
  --ease:cubic-bezier(.16,1,.3,1);
  --top:64px;
  /* Thai weekday colours (the studio's quiet luck layer) */
  --sun:#e5373a; --mon:#f2c230; --tue:#f27aa8; --wed:#2f9e58; --thu:#f2802b; --fri:#3d8fe0; --sat:#8a4fd8;
  color-scheme:light;
}
[data-app="posebunny"]{--tint:#ff6a45;--tint-ink:#c8401e}
[data-app="lucky-widget"]{--tint:#8a4fd8;--tint-ink:#6a32b8}
[data-app="good-hour"]{--tint:#3d6fe0;--tint-ink:#2652b8}
[data-app="lucky-fit"]{--tint:#e85a8f;--tint-ink:#b8336a}
[data-app="lucky-booth"]{--tint:#2f9e58;--tint-ink:#1f7a42}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--top) + 20px)}
body{margin:0;font-family:var(--font);font-size:17px;line-height:1.58;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:inherit;text-underline-offset:.18em}
h1,h2,h3{margin:0;line-height:1.08;letter-spacing:-.03em;text-wrap:balance;font-weight:720}
p{margin:0;text-wrap:pretty}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-9999px;top:10px;background:var(--ink);color:#fff;padding:9px 14px;border-radius:10px;z-index:100}.skip:focus{left:10px}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}

/* top bar */
.topbar{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 84%,transparent);backdrop-filter:saturate(1.6) blur(16px);-webkit-backdrop-filter:saturate(1.6) blur(16px);border-bottom:1px solid var(--hair)}
.topbar .in{max-width:1280px;margin:0 auto;padding:0 24px;height:var(--top);display:flex;align-items:center;gap:12px}
.brand{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:16.5px;letter-spacing:-.015em;text-decoration:none;color:var(--ink);white-space:nowrap}
.brand svg{width:28px;height:28px;flex:none}
.topnav{margin-left:auto;display:flex;align-items:center;gap:2px}
.topnav a{color:var(--muted);text-decoration:none;font-size:15px;font-weight:500;padding:7px 12px;border-radius:10px;white-space:nowrap;transition:background .15s,color .15s}
.topnav a:hover,.topnav a[aria-current]{color:var(--ink);background:rgba(20,22,27,.06)}
.topnav .navapp{display:inline-flex;align-items:center;gap:7px}
.topnav .navapp svg{width:20px;height:20px}

/* buttons, chips */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font:inherit;font-weight:620;font-size:16px;padding:12px 22px;border-radius:999px;border:1px solid transparent;text-decoration:none;cursor:pointer;transition:transform .14s var(--ease),filter .14s,background .14s}
.btn:active{transform:scale(.98)}
.btn-primary{background:var(--tint-ink);color:#fff}.btn-primary:hover{filter:brightness(1.1)}
.btn-ink{background:var(--ink);color:#fff}.btn-ink:hover{background:#000}
.btn-ghost{background:var(--surface);color:var(--ink);border-color:var(--hair-2)}.btn-ghost:hover{background:var(--surface-2)}
.btn svg{width:17px;height:17px}
.ctas{display:flex;flex-wrap:wrap;gap:10px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{font-size:13px;font-weight:560;color:var(--muted);background:var(--surface);border:1px solid var(--hair);padding:3px 11px;border-radius:999px;white-space:nowrap}
.state{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:640;padding:4px 11px 4px 9px;border-radius:999px;white-space:nowrap}
.state::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.state.soon{color:#a2400f;background:#ffe9dd}
.state.works{color:var(--ink-2);background:rgba(20,22,27,.07)}
.state.later{color:#5b3aa6;background:#efe8fb}
.fine{font-size:14.5px;color:var(--muted)}
.fine .inl{display:inline-block;width:12px;height:14px;vertical-align:-1px;margin-right:4px}

/* app icons */
.icon{display:block;flex:none;filter:var(--icon-shadow)}
.icon svg{width:100%;height:100%}

/* home hero */
.hero{text-align:center;padding-top:48px}
.hero h1{font-size:clamp(40px,5.4vw,68px);font-weight:760;letter-spacing:-.04em;line-height:1.02;max-width:15ch;margin:0 auto}
.mascot{position:absolute;width:84px;height:auto;right:44px;top:-80px;transform:rotate(6deg);transform-origin:50% 100%}
@media (prefers-reduced-motion:no-preference){.mascot{animation:peek .9s var(--ease) .25s both}@keyframes peek{from{opacity:0;transform:translateY(22px) rotate(6deg)}to{opacity:1;transform:rotate(6deg)}}}
.hero .lede{font-size:clamp(18px,2.1vw,21px);color:var(--muted);max-width:40em;margin:20px auto 0}
.today{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font-size:14.5px;color:var(--ink-2);background:var(--surface);border:1px solid var(--hair);padding:7px 15px 7px 9px;border-radius:999px;box-shadow:0 1px 2px rgba(20,22,27,.04)}
.today i{flex:none;width:18px;height:18px;border-radius:50%;background:var(--today,var(--thu));box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.today[hidden]{display:none}
.weekdots{display:inline-flex;gap:4px;margin-left:4px}
.weekdots b{width:7px;height:7px;border-radius:50%;opacity:.35}
.weekdots b.on{opacity:1;transform:scale(1.25)}
.shelf{position:relative;margin:74px auto 0;max-width:820px;background:var(--surface-2);border-radius:32px;padding:26px 24px 16px}
.icon-row{display:flex;justify-content:center;flex-wrap:wrap;gap:26px clamp(14px,3.4vw,40px)}
.shelf-note{margin-top:16px;padding-top:12px;border-top:1px solid var(--hair);font-size:13.5px;color:var(--muted)}
.icon-row a,.icon-row .app{display:flex;flex-direction:column;align-items:center;gap:11px;width:104px;text-decoration:none;color:var(--muted);font-size:14px;font-weight:560;line-height:1.25}
.icon-row .icon{width:80px;height:80px;transition:transform .35s var(--ease)}
.icon-row a:hover{color:var(--ink)}
.icon-row .app{cursor:default}
.icon-row a:hover .icon{transform:translateY(-5px) scale(1.04)}
.icon-row small{display:block;font-size:12px;font-weight:500;color:color-mix(in srgb,var(--muted) 80%,transparent);margin-top:2px}

/* sections */
.section{padding-top:104px}
.head{max-width:700px;margin-bottom:34px}
.head h2{font-size:clamp(30px,3.9vw,44px);font-weight:740}
.head p{color:var(--muted);font-size:18.5px;margin-top:12px}

/* feature app card (PoseBunny) */
.appcard{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:44px;align-items:center;padding:56px;border-radius:36px;background:color-mix(in srgb,var(--tint) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--tint) 20%,transparent);overflow:hidden;position:relative}
.appcard .icon{width:72px;height:72px}
.appcard h3{font-size:clamp(32px,3.8vw,46px);font-weight:760;letter-spacing:-.035em;margin-top:22px}
.appcard h3 a{text-decoration:none}
.tag{font-size:20px;font-weight:620;color:var(--tint-ink);margin-top:6px;letter-spacing:-.012em}
.appcard .desc{color:var(--ink-2);margin-top:14px;max-width:34em}
.appcard .chips{margin-top:20px}
.appcard .ctas{margin-top:26px}
.appcard .fine{margin-top:14px}
.phones{display:flex;justify-content:center;align-items:flex-end;gap:18px;min-width:0}
.phone{flex:0 1 210px;min-width:0;border-radius:38px;padding:7px;background:#121317;box-shadow:0 30px 60px -28px rgba(80,25,5,.55),0 2px 6px rgba(0,0,0,.18),inset 0 0 0 1.5px #2b2d33}
.phone img{border-radius:31px;width:100%;height:auto;aspect-ratio:390/844;object-fit:cover;object-position:top}
.phone.mid{flex-basis:236px;transform:translateY(-22px)}
.phone.small{flex-basis:196px}

/* two overlapping phones in the feature card */
.duo{position:relative;height:560px;min-width:0}
.duo .phone{position:absolute;width:250px}
.duo .back{right:calc(50% - 40px);top:58px;transform:rotate(-6deg);opacity:.98}
.duo .front{left:calc(50% - 60px);top:0;transform:rotate(3deg);box-shadow:0 40px 70px -30px rgba(80,25,5,.6),0 2px 6px rgba(0,0,0,.2),inset 0 0 0 1.5px #2b2d33}
/* zoomed detail of a real screen */
.detail{margin:0;width:min(440px,100%);padding:26px;border-radius:30px;background:color-mix(in srgb,var(--tint) 14%,var(--surface));border:1px solid color-mix(in srgb,var(--tint) 20%,transparent)}
.detail img{width:100%;height:auto;border-radius:18px;box-shadow:var(--shadow);background:#fff}

/* upcoming grid */
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.mini{display:flex;flex-direction:column;border-radius:30px;background:var(--surface);border:1px solid var(--hair);overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.mini:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.mini .stage{position:relative;height:250px;display:grid;place-items:center;background:color-mix(in srgb,var(--tint) 11%,var(--surface));border-bottom:1px solid color-mix(in srgb,var(--tint) 16%,transparent);overflow:hidden}
.mini .stage .note{position:absolute;right:14px;bottom:12px;font-size:11.5px;font-weight:600;color:color-mix(in srgb,var(--tint-ink) 75%,#000);opacity:.65}
.mini .body{padding:28px 30px 30px;display:grid;grid-template-columns:auto 1fr;column-gap:18px;align-items:start}
.mini .icon{width:58px;height:58px;grid-row:span 3}
.mini h3{font-size:25px;font-weight:740;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mini .tag{font-size:16.5px;margin-top:3px}
.mini p.desc{grid-column:2;color:var(--muted);font-size:15.5px;margin-top:10px}

/* concept mockups (illustrations, not product screenshots) */
.mock-widgets{display:flex;gap:16px;align-items:center}
.wdg{background:#fff;border-radius:24px;box-shadow:0 18px 34px -18px rgba(60,20,110,.45),0 1px 2px rgba(0,0,0,.06);padding:16px;color:var(--ink)}
.wdg.s{width:150px;height:150px;display:flex;flex-direction:column;justify-content:space-between}
.wdg .d{font-size:12px;font-weight:650;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.wdg .c{width:54px;height:54px;border-radius:50%;background:var(--thu);box-shadow:inset 0 -6px 12px rgba(0,0,0,.12)}
.wdg .n{font-size:20px;font-weight:720;letter-spacing:-.02em;line-height:1.1}
.wdg.m{width:190px;height:150px;display:flex;flex-direction:column;gap:9px}
.wdg .row{display:flex;justify-content:space-between;font-size:13px;font-weight:600}
.wdg .row span:last-child{color:var(--muted);font-weight:500}
.wdg .bar{height:7px;border-radius:9px;background:var(--surface-2);position:relative;overflow:hidden}
.wdg .bar i{position:absolute;top:0;bottom:0;border-radius:9px;background:var(--sat)}
.mock-day{width:min(380px,84%)}
.mock-day .lbl{display:flex;justify-content:space-between;font-size:12px;font-weight:600;color:#33456f;margin-bottom:8px}
.mock-day .track{height:64px;border-radius:18px;background:#fff;position:relative;box-shadow:0 18px 34px -20px rgba(20,40,110,.5);overflow:hidden}
.mock-day .w{position:absolute;top:10px;bottom:10px;border-radius:11px;background:var(--fri)}
.mock-day .w.b{background:color-mix(in srgb,var(--fri) 45%,#fff)}
.mock-day .rk{position:absolute;top:10px;bottom:10px;border-radius:11px;background:repeating-linear-gradient(135deg,#e7e9ef 0 6px,#f6f7f9 6px 12px)}
.mock-day .now{position:absolute;top:4px;bottom:4px;width:2px;background:var(--ink);border-radius:2px}
.mock-day .legend{display:flex;gap:14px;margin-top:12px;font-size:12px;font-weight:600;color:#33456f}
.mock-day .legend span{display:inline-flex;align-items:center;gap:6px}
.mock-day .legend i{width:10px;height:10px;border-radius:3px;background:var(--fri)}
.mock-day .legend i.r{background:repeating-linear-gradient(135deg,#cfd3dc 0 3px,#f1f2f5 3px 6px)}
.mock-fit{display:flex;gap:14px;align-items:flex-end}
.tee{width:96px;background:#fff;border-radius:18px;padding:12px 12px 10px;box-shadow:0 16px 30px -18px rgba(110,20,60,.5);text-align:center;font-size:11.5px;font-weight:650;color:var(--muted)}
.tee svg{width:72px;height:66px;margin:0 auto 6px}
.tee.pick{transform:translateY(-12px);box-shadow:0 22px 38px -18px rgba(110,20,60,.6),0 0 0 2px var(--tint)}
.tee.pick b{color:var(--tint-ink)}
.mock-strip{display:flex;gap:22px;align-items:center}
.strip{background:var(--wed);padding:10px 10px 26px;border-radius:6px;display:grid;gap:8px;transform:rotate(-5deg);box-shadow:0 22px 34px -18px rgba(10,60,30,.6)}
.strip i{display:block;width:78px;height:52px;border-radius:3px;background:linear-gradient(160deg,#fef6e8,#f3dcc4)}
.strip i:nth-child(2){background:linear-gradient(160deg,#e8f3fe,#cfe0f3)}
.strip i:nth-child(3){background:linear-gradient(160deg,#fde8ef,#f3cfdb)}
.strip.two{background:#fff;transform:rotate(4deg) translateY(10px)}
.strip.two i{background:linear-gradient(160deg,#eef0f4,#dfe3ea)}

/* membership teaser */
.pass{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;align-items:center;padding:48px 56px;border-radius:36px;background:#17181d;color:#f3f4f7;position:relative;overflow:hidden}
.pass h2{font-size:clamp(28px,3.4vw,40px);font-weight:740;color:#fff}
.pass p{color:#b9bdc8;margin-top:12px;max-width:34em}
.pass .state.later{background:rgba(255,255,255,.1);color:#d9ccff;margin-bottom:18px}
.pass ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.pass li{display:flex;gap:12px;align-items:flex-start;color:#dfe2e9;font-size:16px}
.pass li svg{width:20px;height:20px;flex:none;margin-top:2px;color:#b8a4ff}

/* about */
.about{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:64px;align-items:start}
.about h2{font-size:clamp(30px,3.9vw,44px);font-weight:740}
.about .copy p{color:var(--ink-2);font-size:18px;margin-top:16px;max-width:34em}
.promises{list-style:none;margin:0;padding:0;border-top:1px solid var(--hair)}
.promises li{padding:18px 0;border-bottom:1px solid var(--hair);display:grid;grid-template-columns:28px 1fr;gap:14px}
.promises svg{width:22px;height:22px;margin-top:2px;color:var(--ink)}
.promises b{display:block;font-weight:680;font-size:16.5px}
.promises span{color:var(--muted);font-size:15.5px}

/* app page */
.apphero{text-align:center;padding-top:72px}
.apphero .icon{width:116px;height:116px;margin:0 auto}
.apphero h1{font-size:clamp(46px,6.6vw,80px);font-weight:770;letter-spacing:-.04em;margin-top:28px}
.apphero .tagline{font-size:clamp(19px,2.3vw,23px);color:var(--muted);max-width:30em;margin:18px auto 0}
.apphero .chips,.apphero .ctas{justify-content:center}
.apphero .chips{margin-top:24px}.apphero .ctas{margin-top:28px}.apphero .fine{margin-top:14px}
.stage-phones{margin-top:60px;padding:56px 24px 0;border-radius:40px 40px 0 0;background:linear-gradient(180deg,color-mix(in srgb,var(--tint) 16%,var(--bg)),color-mix(in srgb,var(--tint) 4%,var(--bg)));overflow:hidden}
.stage-phones .phones{gap:26px;margin-bottom:-60px}
.stage-phones .phone{flex-basis:250px}
.stage-phones .phone.mid{flex-basis:276px}
.showcase{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.showcase.flip .media{order:-1}
.showcase h2{font-size:clamp(28px,3.5vw,40px);font-weight:740}
.showcase p{color:var(--ink-2);font-size:18px;margin-top:14px;max-width:32em}
.showcase ul{margin:20px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.showcase li{display:flex;gap:11px;color:var(--ink-2)}
.showcase li svg{width:20px;height:20px;flex:none;margin-top:3px;color:var(--tint-ink)}
.showcase .media{display:flex;justify-content:center}
.showcase .media .phone{flex:0 0 280px}
.swatches{display:flex;gap:8px;margin-top:22px;flex-wrap:wrap}
.swatches span{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;color:var(--ink-2);background:var(--surface);border:1px solid var(--hair);padding:4px 11px 4px 6px;border-radius:999px}
.swatches i{width:16px;height:16px;border-radius:50%}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.facts div{padding:24px 20px 24px 0}
.facts div+div{padding-left:20px;border-left:1px solid var(--hair)}
.facts dt{font-size:13.5px;color:var(--muted);font-weight:560}
.facts dd{margin:4px 0 0;font-size:18px;font-weight:660;letter-spacing:-.01em}

/* plain pages */
.plain{max-width:780px;padding-top:72px}
.plain h1{font-size:clamp(38px,5vw,56px);font-weight:760;letter-spacing:-.035em}
.plain .meta{color:var(--muted);margin-top:12px}
.plain h2{font-size:23px;font-weight:700;margin:44px 0 10px;letter-spacing:-.02em}
.plain p,.plain li{color:var(--ink-2)}
.plain p+p{margin-top:12px}
.plain ul{padding-left:22px;margin:10px 0}.plain li{margin:6px 0}
.plain a{color:var(--ink)}
.callout{margin-top:26px;padding:18px 22px;border-radius:18px;background:var(--surface);border:1px solid var(--hair);color:var(--ink-2)}
.tablewrap{overflow-x:auto;border:1px solid var(--hair);border-radius:18px;background:var(--surface);margin:14px 0}
table{width:100%;border-collapse:collapse;font-size:14.5px;line-height:1.5}
th,td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid var(--hair)}
tr:last-child td{border-bottom:0}
th{font-weight:650;color:var(--ink);background:var(--surface-2)}
td{color:var(--ink-2)}
.ph{background:#fff1b8;color:#5c4400;border-radius:5px;padding:0 5px;font-weight:560}
.contact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:28px}
.contact a,.contact div{display:block;padding:24px;border-radius:22px;background:var(--surface);border:1px solid var(--hair);text-decoration:none}
.contact a:hover{border-color:var(--hair-2);box-shadow:var(--shadow)}
.contact b{display:block;font-size:18px;font-weight:680;letter-spacing:-.01em}
.contact span{display:block;color:var(--muted);font-size:15px;margin-top:4px}
.contact .co p{color:var(--muted);font-size:15px;margin-top:6px;line-height:1.6}
.qa{border-top:1px solid var(--hair);margin-top:12px}
.qa details{border-bottom:1px solid var(--hair);padding:4px 0}
.qa summary{cursor:pointer;list-style:none;padding:16px 0;font-weight:640;font-size:17px;display:flex;justify-content:space-between;gap:16px}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";font-weight:400;font-size:22px;line-height:1;color:var(--muted);transition:transform .2s var(--ease)}
.qa details[open] summary::after{transform:rotate(45deg)}
.qa details p{padding:0 0 18px;color:var(--ink-2)}

/* footer */
.footer{margin-top:120px;border-top:1px solid var(--hair);padding:44px 0 56px;font-size:14px;color:var(--muted)}
.footer .in{max-width:1120px;margin:0 auto;padding:0 24px;display:grid;gap:24px}
.footer .apps{display:flex;flex-wrap:wrap;gap:12px 22px}
.footer .apps a{display:inline-flex;align-items:center;gap:8px;color:var(--ink);text-decoration:none;font-weight:580;font-size:14.5px}
.footer .apps a:hover{color:var(--ink-2);text-decoration:underline}
.footer .apps svg{width:20px;height:20px}
.footer .apps em{font-style:normal;color:var(--muted);font-weight:500}
.footer .links{display:flex;flex-wrap:wrap;gap:6px 24px;padding-top:22px;border-top:1px solid var(--hair)}
.footer .links a{color:var(--muted);text-decoration:none}.footer .links a:hover{color:var(--ink);text-decoration:underline}
.footer .legal{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:end;line-height:1.65}
.footer .legal strong{color:var(--ink-2);font-weight:640}
.footer .week{display:flex;gap:5px}
.footer .week i{width:9px;height:9px;border-radius:50%}

/* motion: one moment — the hero icons settle in (content visible by default) */
@media (prefers-reduced-motion:no-preference){
  .js .icon-row a,.js .icon-row .app{animation:rise .9s var(--ease) both;animation-delay:calc(var(--i,0) * 70ms + 120ms)}
  @keyframes rise{from{opacity:.001;transform:translateY(14px) scale(.96);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* responsive */
@media (max-width:980px){
  .appcard{grid-template-columns:1fr;padding:34px 26px;gap:40px;border-radius:30px}
  .about,.showcase,.pass{grid-template-columns:1fr;gap:30px}
  .showcase.flip .media{order:0}
  .pass{padding:38px 28px}
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .facts div:nth-child(3){padding-left:0;border-left:0}
  .facts div:nth-child(n+3){border-top:1px solid var(--hair)}
}
@media (max-width:760px){
  .grid2{grid-template-columns:1fr}
  .topnav a.hide-s{display:none}
  .contact{grid-template-columns:1fr}
  .footer .legal{grid-template-columns:1fr}
}
@media (max-width:560px){
  body{font-size:16.5px}
  .wrap,.topbar .in{padding:0 18px}
  .topnav a{padding:7px 9px;font-size:14.5px}
  .hero{padding-top:64px}
  .icon-row{gap:26px 10px;margin-top:44px}
  .icon-row a,.icon-row .app{width:92px;font-size:13px}
  .icon-row .icon{width:68px;height:68px}
  .section{padding-top:80px}
  .phones{gap:10px}
  .phone{padding:5px;border-radius:28px}.phone img{border-radius:23px}
  .phone.small{display:none}
  .phone.mid{transform:none}
  .stage-phones{padding:36px 14px 0;border-radius:28px 28px 0 0;margin-top:44px}
  .stage-phones .phone:not(.mid){display:none}
  .stage-phones .phone.mid{flex-basis:260px}
  .mini .stage{height:210px}
  .mini .body{padding:22px 22px 26px;grid-template-columns:1fr}
  .mini .icon{width:52px;height:52px;grid-row:auto;margin-bottom:14px}
  .mini p.desc{grid-column:1}
  .today{font-size:14px;text-align:left}
  .weekdots{display:none}
  .duo{height:440px}
  .duo .phone{width:196px}
  .duo .back{width:172px;right:calc(50% - 26px);top:44px}
  .duo .front{left:calc(50% - 64px)}
  .apphero{padding-top:44px}
  .plain{padding-top:48px}
  .detail{padding:16px;border-radius:24px}
  .mock-widgets{transform:scale(.86)}
  .facts dd{font-size:16.5px}
  .facts div{padding:18px 12px 18px 0}.facts div+div{padding-left:12px}
}
@media (max-width:560px){.shelf{margin-top:72px;padding:18px 12px 16px;border-radius:26px}.mascot{width:64px;top:-62px;right:28px}.icon-row{gap:20px 8px;margin-top:0}}

/* v4 minimal footer */
.footer{margin-top:96px;padding:28px 0 36px}
.footer .in{grid-template-columns:1fr auto;align-items:center}
.footer .links{padding-top:0;border-top:0}
.footer .legal{display:block;margin:0}
@media (max-width:560px){.footer .in{grid-template-columns:1fr}}
.contact{grid-template-columns:1fr;max-width:560px}
