/* Lunado site — variant A «Графіт і перли» (approved 2026-10-15, J-033).
   Layout: one editorial column; "two taps" features alternate copy and a drawn app frame; one inverted band for "where the money comes from".
   Light only on purpose: the brand look is pearl paper and graphite. */

/* Fonts live on our own server, not Google Fonts: the site makes no third-party requests (privacy and cookies policies say so).
   Files are Google Fonts' own woff2 subsets (same pattern as Dayveo's landing-fonts); unicode-range lets the browser fetch only the subsets a page uses.
   cyrillic-ext holds «₴», Onest symbols holds «←» «→». Vietnamese and math subsets are left out. Licence: SIL OFL 1.1 — copyright and link are inside each file. */
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;src:url(fonts/cormorant-garamond-v21-italic-cyrillic-ext.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;src:url(fonts/cormorant-garamond-v21-italic-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;src:url(fonts/cormorant-garamond-v21-italic-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;src:url(fonts/cormorant-garamond-v21-italic-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500 600;font-display:swap;src:url(fonts/cormorant-garamond-v21-cyrillic-ext.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500 600;font-display:swap;src:url(fonts/cormorant-garamond-v21-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500 600;font-display:swap;src:url(fonts/cormorant-garamond-v21-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500 600;font-display:swap;src:url(fonts/cormorant-garamond-v21-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Onest";font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/onest-v11-cyrillic-ext.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:"Onest";font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/onest-v11-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/onest-v11-symbols.woff2) format("woff2");unicode-range:U+0001-000C,U+000E-001F,U+007F-009F,U+20DD-20E0,U+20E2-20E4,U+2150-218F,U+2190,U+2192,U+2194-2199,U+21AF,U+21E6-21F0,U+21F3,U+2218-2219,U+2299,U+22C4-22C6,U+2300-243F,U+2440-244A,U+2460-24FF,U+25A0-27BF,U+2800-28FF,U+2921-2922,U+2981,U+29BF,U+29EB,U+2B00-2BFF,U+4DC0-4DFF,U+FFF9-FFFB,U+10140-1018E,U+10190-1019C,U+101A0,U+101D0-101FD,U+102E0-102FB,U+10E60-10E7E,U+1D2C0-1D2D3,U+1D2E0-1D37F,U+1F000-1F0FF,U+1F100-1F1AE,U+1F1E6-1F1FF,U+1F30D-1F30F,U+1F315,U+1F31C,U+1F31E,U+1F320-1F32C,U+1F336,U+1F378,U+1F37D,U+1F382,U+1F393-1F39F,U+1F3A7-1F3A8,U+1F3AC-1F3AF,U+1F3C2,U+1F3C4-1F3C6,U+1F3CA-1F3CE,U+1F3D4-1F3E0,U+1F3ED,U+1F3F1-1F3F3,U+1F3F5-1F3F7,U+1F408,U+1F415,U+1F41F,U+1F426,U+1F43F,U+1F441-1F442,U+1F444,U+1F446-1F449,U+1F44C-1F44E,U+1F453,U+1F46A,U+1F47D,U+1F4A3,U+1F4B0,U+1F4B3,U+1F4B9,U+1F4BB,U+1F4BF,U+1F4C8-1F4CB,U+1F4D6,U+1F4DA,U+1F4DF,U+1F4E3-1F4E6,U+1F4EA-1F4ED,U+1F4F7,U+1F4F9-1F4FB,U+1F4FD-1F4FE,U+1F503,U+1F507-1F50B,U+1F50D,U+1F512-1F513,U+1F53E-1F54A,U+1F54F-1F5FA,U+1F610,U+1F650-1F67F,U+1F687,U+1F68D,U+1F691,U+1F694,U+1F698,U+1F6AD,U+1F6B2,U+1F6B9-1F6BA,U+1F6BC,U+1F6C6-1F6CF,U+1F6D3-1F6D7,U+1F6E0-1F6EA,U+1F6F0-1F6F3,U+1F6F7-1F6FC,U+1F700-1F80B,U+1F810-1F847,U+1F850-1F859,U+1F860-1F887,U+1F890-1F8AD,U+1F8B0-1F8BB,U+1F8C0-1F8C1,U+1F8D0-1F8D8,U+1F900-1F90B,U+1F93B,U+1F946,U+1F984,U+1F996,U+1F9E9,U+1FA00-1FA6F,U+1FA70-1FA7C,U+1FA80-1FAC6,U+1FAC8,U+1FACC-1FADD,U+1FADF-1FAEB,U+1FAEF-1FAFA,U+1FB00-1FBFF}
@font-face{font-family:"Onest";font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/onest-v11-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Onest";font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/onest-v11-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Outfit";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/outfit-v15-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Outfit";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/outfit-v15-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --bg:#F6F4EF; --surface:#FFFFFF; --surface-2:#EFEBE3; --ink:#17171C; --ink-2:#55545C; --line:#E2DCD0;
  --btn:#17171C; --btn-ink:#F6F4EF; --gold:#C2A878; --gold-ink:#7A6640; --gold-soft:#EEE5D2;
  --band:#17171C; --band-ink:#F4F1EA; --band-2:#A9A59C; --band-line:#34343B; --band-gold:#C2A878;
  --frame:#E6E2D9; --frame-ink:#3A3A40;
  --display:"Cormorant Garamond","Iowan Old Style","Times New Roman",serif; --dw:500; --dtrack:-0.01em; --dscale:1.14; --em:italic;
  --body:"Onest",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mark:"Outfit","Onest",system-ui,sans-serif;
  --r-lg:28px; --r-md:18px;
  /* the app itself, drawn inside phones — same in every look */
  --a-bg:#FAFAFB; --a-sf:#FFFFFF; --a-ink:#17171C; --a-ink2:#5A5A66; --a-ink3:#6E6E7A; --a-line:#E5E5EE;
  --sand-bg:#F4E4CD; --sand-ln:#D8BB90; --sand-ink:#674A22;
  --sage-bg:#D9E9D5; --sage-ln:#A8CBA1; --sage-ink:#305B36;
  --rose-bg:#F2D5E0; --rose-ln:#DBA0B7; --rose-ink:#6D2D46;
  --lav-bg:#DDD6F1; --lav-ln:#AEA1DD; --lav-ink:#463B76;
  --ok:#2E7D4F; --warn:#B7791F; --danger:#C8432F; --white:#FFFFFF; --bezel:#0B0B0D;
  color-scheme:light;
}

*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
p,h1,h2,h3,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}

/* ── site ── */
.site{background:var(--bg);color:var(--ink);overflow-x:clip}
.wrap{width:100%;max-width:1160px;margin-inline:auto;padding-inline:clamp(16px,5vw,40px)}
section{scroll-margin-top:80px}

.eyebrow{font:600 12.5px/1.2 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:18px}
h1,h2,h3{font-family:var(--display);font-weight:var(--dw);letter-spacing:var(--dtrack);text-wrap:balance;color:var(--ink)}
h1{font-size:calc(var(--dscale) * clamp(40px,6.6vw,84px));line-height:1.02}
h2{font-size:calc(var(--dscale) * clamp(32px,4.4vw,54px));line-height:1.06;margin-bottom:18px}
h3{font-size:calc(var(--dscale) * clamp(26px,3vw,36px));line-height:1.1;margin-bottom:14px}
h1 em,h2 em{font-style:var(--em);color:var(--gold-ink)}
.lead{font-size:clamp(17px,1.7vw,19px);color:var(--ink-2);max-width:34em;margin-top:22px}
.txt{color:var(--ink-2);max-width:32em}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border-radius:999px;border:0;background:var(--btn);color:var(--btn-ink);font:600 15px/1 var(--body);text-decoration:none;cursor:pointer;transition:transform .12s ease,opacity .2s}
.btn:hover{opacity:.9}
.btn:active{transform:scale(.97)}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 22%,transparent)}
.btn.sm{min-height:40px;padding:0 18px;font-size:14px}
.btn svg{width:18px;height:18px;flex:none}
.btn.store{cursor:default}
.btn.store:hover{opacity:1}
.btn.store:active{transform:none}

/* header */
.hd{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--bg) 84%,transparent);-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent)}
.hd .wrap{display:flex;align-items:center;gap:22px;height:68px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);flex:none}
.brand svg{width:32px;height:32px;border-radius:9px;box-shadow:0 0 0 1px var(--line)}
.brand span{font-family:var(--mark);font-weight:500;font-size:25px;letter-spacing:-.02em;line-height:1}
.nav{display:flex;gap:26px;margin-left:auto}
.nav a{color:var(--ink-2);text-decoration:none;font-size:15px}
.nav a:hover{color:var(--ink)}
.lang{display:inline-flex;gap:2px;padding:3px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);flex:none}
.lang a{display:inline-grid;place-items:center;color:var(--ink-2);font:600 12px/1 var(--body);letter-spacing:.06em;min-height:30px;min-width:40px;padding:0 10px;border-radius:999px;text-decoration:none}
.lang a:hover{color:var(--ink)}
.lang a[aria-current="page"]{background:var(--ink);color:var(--bg)}
@media (max-width:900px){.nav{display:none}.hd .lang{margin-left:auto}}
@media (max-width:520px){.hd .btn{display:none}}

/* hero */
.hero{padding-block:clamp(36px,7vw,96px) clamp(56px,8vw,112px)}
.hero-g{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,5vw,64px);align-items:center}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.fine{margin-top:18px;font-size:14px;color:var(--ink-2)}
.fine b{color:var(--ink);font-weight:600}
.hero-art{--pw:clamp(220px,24vw,290px)}
.stack{position:relative;width:calc(var(--pw) * 1.42);margin-inline:auto;padding-bottom:28px}
.stack .st{--sw:calc(var(--pw) * .64);position:absolute;right:0;bottom:0;transform:rotate(4deg);box-shadow:0 30px 60px -24px rgb(15 12 14/.55)}
.chip-free{position:absolute;left:calc(var(--pw) * .62);top:39%;z-index:2;display:flex;align-items:center;gap:8px;padding:9px 14px 9px 10px;border-radius:999px;background:var(--surface);color:var(--ink);font:600 13px/1 var(--body);box-shadow:0 12px 30px -12px rgb(23 23 28/.35),0 0 0 1px var(--line);white-space:nowrap}
.chip-free i{width:22px;height:22px;border-radius:50%;background:var(--gold-soft);display:grid;place-items:center}
.chip-free svg{width:13px;height:13px;stroke:var(--gold-ink)}
@media (max-width:860px){.hero-g{grid-template-columns:minmax(0,1fr)}.hero-art{margin-top:8px}}
@media (max-width:420px){.chip-free{display:none}}

/* pain */
.pain{padding-block:clamp(56px,8vw,104px);border-top:1px solid var(--line)}
.pain-g{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,5vw,72px);align-items:end}
.pain-g h2{margin-bottom:0}
.pain-end{margin-top:18px;color:var(--ink);font-weight:500}
.tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:40px}
.tool{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;background:var(--surface);box-shadow:0 0 0 1px var(--line);color:var(--ink-2);font-size:15px;text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--danger) 70%,transparent);text-decoration-thickness:1.5px}
.tools .arrow{width:34px;height:14px;stroke:var(--ink-2);flex:none}
.tool.us{text-decoration:none;color:var(--btn-ink);background:var(--btn);box-shadow:none;gap:8px;font-family:var(--mark);font-size:17px;padding-left:8px}
.tool.us svg{width:26px;height:26px;border-radius:7px}
@media (max-width:760px){.pain-g{grid-template-columns:minmax(0,1fr)}}

/* two taps */
.taps{padding-block:clamp(56px,8vw,104px) clamp(24px,4vw,48px);border-top:1px solid var(--line)}
.taps-h{max-width:760px}
.feat{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,6vw,88px);align-items:center;padding-block:clamp(32px,5vw,64px)}
.feat.flip .art{order:-1}
.art{background:var(--surface-2);border-radius:var(--r-lg);padding:clamp(24px,4.5vw,56px);display:grid;place-items:center;--pw:clamp(220px,23vw,280px)}
.art .st,.art .pl{--sw:clamp(210px,22vw,270px);box-shadow:0 30px 60px -28px rgb(15 12 14/.5)}
.dots{display:grid;gap:10px;margin-top:22px}
.dots li{position:relative;padding-left:26px;color:var(--ink)}
.dots li::before{content:"";position:absolute;left:0;top:.72em;width:14px;height:1.5px;background:var(--gold)}
.num{font-family:var(--display);font-size:calc(var(--dscale) * 20px);color:var(--gold-ink);margin-bottom:10px;display:block}
@media (max-width:760px){.feat{grid-template-columns:minmax(0,1fr)}.feat.flip .art{order:0}}

/* how */
.how{padding-block:clamp(56px,8vw,104px);border-top:1px solid var(--line)}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2.6vw,32px);margin-top:36px}
.steps li{border-top:1px solid var(--ink);padding-top:18px;display:flex;flex-direction:column;gap:8px}
.steps .n{font-family:var(--display);font-size:calc(var(--dscale) * 46px);line-height:1;color:var(--gold-ink)}
.steps b{font-weight:600;font-size:17px;line-height:1.3}
.steps p{color:var(--ink-2);font-size:15px}
@media (max-width:900px){.steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px}}
@media (max-width:480px){.steps{grid-template-columns:minmax(0,1fr)}}

/* voice */
.voice{padding-block:clamp(48px,7vw,96px);background:var(--surface-2)}
.soon{display:inline-flex;align-items:center;gap:8px;min-height:28px;padding:0 12px;border-radius:999px;background:var(--gold-soft);color:var(--gold-ink);font:600 12.5px/1 var(--body);letter-spacing:.06em;text-transform:uppercase;margin-bottom:18px}
.soon::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gold-ink)}
.vc{width:min(100%,380px);margin-inline:auto;background:var(--a-sf);color:var(--a-ink);border-radius:26px;padding:22px;font-family:"Onest",system-ui,sans-serif;box-shadow:0 30px 70px -36px rgb(23 23 28/.45),0 0 0 1px var(--a-line);display:grid;gap:16px}
.vc-say{display:flex;align-items:center;gap:14px}
.mic{width:48px;height:48px;border-radius:50%;background:var(--a-ink);display:grid;place-items:center;flex:none}
.mic svg{width:22px;height:22px;stroke:var(--white)}
.wave{display:flex;align-items:center;gap:4px;height:40px;flex:1;min-width:0;overflow:hidden}
.wave i{display:block;flex:none;width:4px;border-radius:2px;background:var(--a-ink);height:calc(var(--h) * 1%);opacity:.85;transform-origin:center}
.vc-q{font-size:16px;line-height:1.4;color:var(--a-ink)}
.vc-k{font:600 11px/1 "Onest",system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--a-ink3);margin-bottom:8px}
.vc .r-card{position:static;height:auto;font-size:15px;padding:.6em .8em;gap:.2em}
.vc-btns{display:grid;grid-template-columns:1fr 1.4fr;gap:10px;margin-top:12px}
.vc-btns span{display:grid;place-items:center;min-height:44px;border-radius:14px;font-weight:600;font-size:15px;box-shadow:inset 0 0 0 1px var(--a-line)}
.vc-btns .go{background:var(--a-ink);color:var(--white);box-shadow:none}

.voice .feat{padding-block:0}

/* everyday */
.daily{padding-block:clamp(56px,8vw,104px)}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,48px) clamp(20px,3vw,40px);margin-top:40px}
.tile{display:flex;flex-direction:column;gap:10px;padding-top:22px;border-top:1px solid var(--line)}
.tile .ic{width:44px;height:44px;border-radius:14px;background:var(--surface);box-shadow:0 0 0 1px var(--line);display:grid;place-items:center}
.tile .ic svg{width:22px;height:22px;stroke:var(--ink);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.tile b{font-size:18px;font-weight:600;margin-top:6px}
.tile p{color:var(--ink-2);font-size:15.5px}
@media (max-width:900px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:540px){.tiles{grid-template-columns:minmax(0,1fr)}}

/* band: where the money comes from */
.band{background:var(--band);color:var(--band-ink);padding-block:clamp(56px,8vw,104px)}
.band h2{color:var(--band-ink)}
.band .eyebrow{color:var(--band-gold)}
.band .txt{color:var(--band-2)}
.band-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,6vw,80px);align-items:center}
.src{border-radius:var(--r-lg);padding:clamp(22px,3.5vw,36px);background:color-mix(in srgb,var(--band-ink) 6%,var(--band));box-shadow:inset 0 0 0 1px var(--band-line)}
.src-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:22px}
.src-h b{font-weight:600;font-size:16px}
.src-h span{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--band-2)}
.src-r{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;padding-block:12px;border-top:1px solid var(--band-line)}
.src-r b{font-weight:600}
.src-r .m{font-variant-numeric:tabular-nums;font-weight:600;text-align:right}
.src-r .bar{grid-column:1 / -1;height:6px;border-radius:3px;background:color-mix(in srgb,var(--band-ink) 10%,transparent);overflow:hidden}
.src-r .bar i{display:block;height:100%;width:calc(var(--w) * 1%);border-radius:3px;background:var(--band-gold)}
.src-r small{grid-column:1 / -1;color:var(--band-2);font-size:13px}
@media (max-width:800px){.band-g{grid-template-columns:minmax(0,1fr)}}

/* pricing */
.pricing{padding-block:clamp(56px,8vw,104px)}
.plans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:36px;max-width:900px}
.plan{border-radius:var(--r-lg);padding:clamp(24px,3.5vw,36px);display:flex;flex-direction:column;gap:20px;background:var(--surface);box-shadow:0 0 0 1px var(--line)}
.plan-n{font:600 13px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink)}
.plan-p{display:flex;flex-direction:column;gap:6px}
.plan-p span{font-family:var(--display);font-weight:var(--dw);font-size:calc(var(--dscale) * 50px);line-height:1;letter-spacing:var(--dtrack)}
.plan-p small{font-size:14px;color:var(--ink-2)}
.ticks{display:grid;gap:11px;flex:1}
.ticks li{position:relative;padding-left:30px;font-size:15.5px}
.ticks li::before{content:"";position:absolute;left:0;top:.2em;width:19px;height:19px;border-radius:50%;background:var(--gold-soft)}
.ticks li::after{content:"";position:absolute;left:6px;top:calc(.2em + 6px);width:7px;height:4px;border-left:1.7px solid var(--gold-ink);border-bottom:1.7px solid var(--gold-ink);transform:rotate(-45deg)}
.ticks .later{color:var(--ink-2)}
.plan .btn{align-self:flex-start}
.plan.pro{background:var(--band);color:var(--band-ink);box-shadow:none}
.plan.pro .plan-n{color:var(--band-gold)}
.plan.pro .plan-p small,.plan.pro .ticks .later{color:var(--band-2)}
.plan.pro .ticks li::before{background:color-mix(in srgb,var(--band-ink) 14%,var(--band))}
.plan.pro .ticks li::after{border-color:var(--band-ink)}
.plan.pro .btn{background:var(--band-ink);color:var(--band)}
@media (max-width:700px){.plans{grid-template-columns:minmax(0,1fr)}}

/* faq */
.faq{padding-block:clamp(56px,8vw,104px);border-top:1px solid var(--line)}
.faq-g{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,5vw,72px);align-items:start}
.qa details{border-bottom:1px solid var(--line)}
.qa details:first-child{border-top:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding-block:20px;font-weight:600;font-size:17px;line-height:1.35}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";flex:none;font:300 28px/1 var(--body);color:var(--ink-2);transition:transform .25s ease}
.qa details[open] summary::after{transform:rotate(45deg)}
.qa p{color:var(--ink-2);padding-bottom:22px;max-width:36em}
@media (max-width:800px){.faq-g{grid-template-columns:minmax(0,1fr)}}

/* end */
.end{padding-block:0 clamp(56px,8vw,104px)}
.end-box{background:var(--surface-2);border-radius:var(--r-lg);padding:clamp(28px,5.5vw,72px);display:flex;align-items:center;justify-content:space-between;gap:32px}
.end-box h2{font-size:calc(var(--dscale) * clamp(36px,5.4vw,68px))}
.end-box .txt{margin-bottom:28px}
.end-mark{width:clamp(96px,14vw,168px);height:auto;aspect-ratio:1;border-radius:23%;flex:none;box-shadow:0 30px 60px -30px rgb(23 23 28/.55),0 0 0 1px var(--line)}
@media (max-width:640px){.end-box{flex-direction:column-reverse;align-items:flex-start}}

/* footer */
.ft{border-top:1px solid var(--line);padding-block:48px 28px;font-size:15px}
.ft-g{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:32px}
.ft-brand p{color:var(--ink-2);margin-top:14px;max-width:22em}
.ft nav{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.ft-h{font:600 12px/1.2 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);margin-bottom:4px}
.ft nav a{text-decoration:none;color:var(--ink)}
.ft nav a:hover{text-decoration:underline;text-underline-offset:3px}
.ft-mail{color:var(--ink-2);user-select:all;overflow-wrap:anywhere}
.ft-b{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:44px;padding-top:20px;border-top:1px solid var(--line);color:var(--ink-2);font-size:14px}
@media (max-width:860px){.ft-g{grid-template-columns:repeat(2,minmax(0,1fr))}.ft-brand{grid-column:1 / -1}}
@media (max-width:400px){.ft-g{grid-template-columns:minmax(0,1fr)}}

/* ── drawn app: phone frame ── */
.phone{position:relative;width:var(--pw);aspect-ratio:9/19.3;border-radius:calc(var(--pw) * .155);background:var(--bezel);padding:calc(var(--pw) * .03);box-shadow:0 44px 90px -44px rgb(23 23 28/.6),inset 0 0 0 1px rgb(255 255 255/.08)}
.screen{position:relative;width:100%;height:100%;overflow:hidden;border-radius:calc(var(--pw) * .126);background:var(--a-bg);color:var(--a-ink);font-family:"Onest",system-ui,sans-serif;font-size:calc(var(--pw) * .041);line-height:1.3;font-variant-numeric:tabular-nums}
.island{position:absolute;z-index:4;top:calc(var(--pw) * .028);left:50%;transform:translateX(-50%);width:31%;height:calc(var(--pw) * .085);border-radius:999px;background:var(--bezel)}
.homebar{position:absolute;z-index:4;bottom:.5em;left:50%;transform:translateX(-50%);width:34%;height:.36em;border-radius:1em;background:var(--a-ink);opacity:.85}
.screen svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* records day */
.rec{display:flex;flex-direction:column}
.r-top{display:flex;align-items:center;gap:.5em;padding:3.6em 1.15em .5em}
.r-top b{font-size:1.5em;font-weight:600;letter-spacing:-.01em}
.r-top .chev{width:1em;height:1em;color:var(--a-ink3)}
.r-top .sp{flex:1}
.r-btn{position:relative;width:2.7em;height:2.7em;border-radius:50%;background:var(--a-sf);box-shadow:inset 0 0 0 1px var(--a-line);display:grid;place-items:center}
.r-btn svg{width:1.3em;height:1.3em}
.r-badge{position:absolute;top:-.2em;right:-.3em;min-width:1.5em;height:1.5em;padding:0 .35em;border-radius:1em;background:var(--danger);color:var(--white);font-size:.72em;font-weight:600;display:grid;place-items:center;line-height:1}
.r-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding:.35em .7em .45em;text-align:center}
.r-days span{display:flex;flex-direction:column;align-items:center;gap:.25em;font-size:.8em;color:var(--a-ink3)}
.r-days b{display:grid;place-items:center;width:2.25em;height:2.25em;border-radius:50%;font-size:1.2em;font-weight:500;color:var(--a-ink)}
.r-days .td b{box-shadow:inset 0 0 0 1.2px var(--a-ink)}
.r-days .on b{background:var(--a-ink);color:var(--white)}
.r-date{display:flex;justify-content:space-between;align-items:baseline;gap:.6em;padding:.55em 1.15em .7em;border-bottom:1px solid var(--a-line)}
.r-date b{font-weight:600;font-size:1.02em;white-space:nowrap}
.r-date span{color:var(--a-ink3);font-size:.88em;white-space:nowrap}
.r-axis{position:relative;flex:1;--h:3.4em;margin-top:.9em}
.r-hr{position:absolute;left:3.5em;right:.8em;top:calc(var(--i) * var(--h));border-top:1px solid var(--a-line)}
.r-hr span{position:absolute;left:-3em;top:-.62em;font-size:.76em;color:var(--a-ink2)}
.r-card{position:absolute;left:3.9em;right:.8em;top:calc(var(--s) * var(--h) + 2px);height:calc(var(--d) * var(--h) - 3px);display:flex;flex-direction:column;gap:.1em;padding:.32em .6em;border-radius:.72em;background:var(--cbg);box-shadow:inset 0 0 0 1px var(--cln);overflow:hidden}
.r-card .l1{display:flex;align-items:center;gap:.32em;font-weight:600;font-size:.96em;white-space:nowrap}
.r-card .l1 .t{margin-left:auto;font-weight:500;color:var(--cink)}
.r-card .l1 svg{width:1em;height:1em;flex:none}
.r-card .l2{display:flex;justify-content:space-between;gap:.5em;color:var(--a-ink2);font-size:.86em;white-space:nowrap}
.r-card .l2 span{overflow:hidden;text-overflow:ellipsis}
.r-card .l3{color:var(--cink);font-size:.86em;font-weight:500}
.sand{--cbg:var(--sand-bg);--cln:var(--sand-ln);--cink:var(--sand-ink)}
.sage{--cbg:var(--sage-bg);--cln:var(--sage-ln);--cink:var(--sage-ink)}
.rose{--cbg:var(--rose-bg);--cln:var(--rose-ln);--cink:var(--rose-ink)}
.lav{--cbg:var(--lav-bg);--cln:var(--lav-ln);--cink:var(--lav-ink)}
.okc{color:var(--ok)} .wtc{color:var(--warn)}
.r-now{position:absolute;left:3.5em;right:.8em;top:calc(var(--s) * var(--h));height:2px;background:var(--danger);z-index:2}
.r-now::before{content:"";position:absolute;left:-.35em;top:-.28em;width:.65em;height:.65em;border-radius:50%;background:var(--danger)}
.r-nav{position:absolute;z-index:3;left:.85em;right:.85em;bottom:1.55em;display:flex;align-items:center;justify-content:space-between;gap:.5em}
.r-nav .c,.r-nav .p{height:3.7em;border-radius:2em;background:rgb(255 255 255/.94);box-shadow:0 .5em 1.4em rgb(23 23 28/.12),0 0 0 1px var(--a-line);display:flex;align-items:center;justify-content:center}
.r-nav .c{width:3.7em}
.r-nav .c svg{width:1.4em;height:1.4em}
.r-nav .p{gap:.9em;padding:0 1.05em;font-weight:500;font-size:.95em}
.r-nav .p svg{width:1.1em;height:1.1em;color:var(--a-ink3)}
.r-nav .plus{background:var(--a-ink);color:var(--white);box-shadow:0 .5em 1.4em rgb(23 23 28/.3)}

/* booking page */
.bk-url{margin:3.3em .9em 0;height:2.5em;border-radius:1.3em;background:var(--a-sf);box-shadow:inset 0 0 0 1px var(--a-line);display:flex;align-items:center;justify-content:center;gap:.4em;font-size:.88em;color:var(--a-ink2)}
.bk-url svg{width:1em;height:1em}
.bk{display:flex;flex-direction:column;gap:.6em;padding:1em 1.15em}
.bk-who{display:flex;align-items:center;gap:.7em;margin-bottom:.3em}
.av{width:2.9em;height:2.9em;border-radius:50%;background:var(--rose-bg);color:var(--rose-ink);display:grid;place-items:center;font-weight:600;font-size:1.05em;flex:none}
.bk-who b{display:block;font-size:1.12em;font-weight:600}
.bk-who small{color:var(--a-ink3);font-size:.86em}
.bk-k{font-size:.72em;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--a-ink3);margin-top:.35em}
.bk-svc{display:flex;justify-content:space-between;align-items:center;gap:.6em;padding:.6em .75em;border-radius:.8em;background:var(--a-sf);box-shadow:inset 0 0 0 1px var(--a-line)}
.bk-svc b{display:block;font-weight:600;font-size:.94em}
.bk-svc small{color:var(--a-ink3);font-size:.82em}
.bk-svc span{font-weight:600;font-size:.94em;white-space:nowrap}
.bk-svc.on{box-shadow:inset 0 0 0 1.6px var(--a-ink)}
.bk-days{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.45em}
.bk-days span{display:flex;flex-direction:column;align-items:center;gap:.1em;padding:.4em 0;border-radius:.8em;background:var(--a-sf);box-shadow:inset 0 0 0 1px var(--a-line);font-size:.8em;color:var(--a-ink3)}
.bk-days b{font-size:1.35em;font-weight:600;color:var(--a-ink)}
.bk-days .on{background:var(--a-ink);color:rgb(255 255 255/.75);box-shadow:none}
.bk-days .on b{color:var(--white)}
.bk-times{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.45em}
.bk-times span{display:grid;place-items:center;height:2.5em;border-radius:.8em;background:var(--a-sf);box-shadow:inset 0 0 0 1px var(--a-line);font-weight:600;font-size:.92em}
.bk-times .on{box-shadow:inset 0 0 0 1.6px var(--a-ink);background:var(--sand-bg)}
.bk-in{height:2.7em;border-radius:.8em;background:var(--a-sf);box-shadow:inset 0 0 0 1px var(--a-line);display:flex;align-items:center;padding:0 .8em;font-size:.92em}
.bk-go{height:3em;border-radius:1.5em;background:var(--a-ink);color:var(--white);display:grid;place-items:center;font-weight:600;margin-top:.3em}

/* story: free slots render */
.st{container-type:inline-size;position:relative;flex:none;width:var(--sw);aspect-ratio:9/16;border-radius:14px;overflow:hidden;background:linear-gradient(180deg,rgb(18 12 16/.2) 0%,rgb(18 12 16/.5) 42%,rgb(18 12 16/.82) 100%),url("img/nails.jpg") center 30%/cover,#3a2b30;color:var(--white)}
.st-in{position:absolute;inset:0;display:flex;flex-direction:column;padding:24cqi 9cqi 27cqi}
.st-k{font:600 3.9cqi/1 "Onest",system-ui,sans-serif;letter-spacing:.22em;text-transform:uppercase;opacity:.9}
.st-t{font:500 16cqi/.92 "Cormorant Garamond","Times New Roman",serif;margin-top:3cqi;letter-spacing:-.01em}
.st-t em{font-style:italic}
.st-d{margin-top:auto}
.st-d li{border-top:1px solid rgb(255 255 255/.38);padding-block:3.2cqi}
.st-d b{display:block;font:600 3.8cqi/1.2 "Onest",system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.st-d span{display:block;font:500 6.6cqi/1.25 "Onest",system-ui,sans-serif;font-variant-numeric:tabular-nums;margin-top:1cqi;white-space:nowrap}
.st-f{font:500 3.8cqi/1 "Onest",system-ui,sans-serif;letter-spacing:.06em;margin-top:5cqi;opacity:.85}

/* price list render */
.pl{container-type:inline-size;position:relative;flex:none;width:var(--sw);aspect-ratio:9/16;border-radius:14px;overflow:hidden;background:url("img/pedi.jpg") center 18%/cover,#e9e5df}
.pl-p{position:absolute;left:7cqi;right:7cqi;top:30%;bottom:13%;border-radius:4cqi;background:rgb(250 248 244/.93);color:#1E1C1F;padding:8cqi 7cqi 6cqi;display:flex;flex-direction:column}
.pl-t{font:500 15cqi/.88 "Cormorant Garamond","Times New Roman",serif;letter-spacing:.02em;text-transform:uppercase}
.pl-t em{font-style:italic;text-transform:none;letter-spacing:0}
.pl-s{font:600 3.4cqi/1 "Onest",system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#6B6258;margin-top:3.5cqi}
.pl-r{margin-top:auto;display:grid;gap:3.4cqi}
.pl-r li{display:flex;align-items:baseline;gap:2cqi;font:500 4.4cqi/1.15 "Onest",system-ui,sans-serif;font-variant-numeric:tabular-nums}
.pl-r li i{flex:1;border-bottom:1px dotted rgb(30 28 31/.4);transform:translateY(-.25em)}
.pl-r li b{font-weight:600;white-space:nowrap}
.pl-f{font:500 3.4cqi/1 "Onest",system-ui,sans-serif;letter-spacing:.06em;color:#6B6258;margin-top:5cqi}

/* motion */
@media (prefers-reduced-motion:no-preference){
  .hero-art .phone{animation:rise .9s cubic-bezier(.2,.8,.2,1) both}
  .hero-art .st{animation:tilt 1.1s .12s cubic-bezier(.2,.8,.2,1) both}
  .hero-art .chip-free{animation:rise .8s .35s cubic-bezier(.2,.8,.2,1) both}
  .wave i{animation:wv 1.25s ease-in-out infinite;animation-delay:calc(var(--k) * -.11s)}
}
@keyframes rise{from{transform:translateY(18px)}to{transform:none}}
@keyframes tilt{from{transform:translateY(26px) rotate(0deg)}to{transform:rotate(4deg)}}
@keyframes wv{0%,100%{transform:scaleY(.4)}50%{transform:scaleY(1)}}