/* Setwise / Nail Profile in the fit quiz v51 look (colors + type only; layout untouched). Loaded last.
   v51 palette: white base, ink #121212, pink #c2447a, blush #fdeff1 / #fddfea, muted #595a5b, line #e5e5e5.
   v51 type: Bodoni Moda (display, 400) + Jost (text, 400/500), uppercase tracked labels and buttons. Fonts self-hosted (/fonts, latin). */
@font-face{font-family:'Jost';font-style:normal;font-weight:400 500;font-display:swap;src:url(/fonts/jost-var.woff2) format('woff2')}
@font-face{font-family:'Bodoni Moda';font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/bodoni-moda-italic-400.woff2) format('woff2')}
:root{--ink:#121212;--paper:#fff;--canvas:#fff;--pink:#c2447a;--pink-text:#b0386c;--blush:#fdeff1;--blush2:#fddfea;--muted:#595a5b;--line:#e5e5e5;
  --accent:#121212;--merlot:#121212;--sans:'Jost',Futura,'Century Gothic',system-ui,sans-serif;--serif:'Bodoni Moda',Didot,'Bodoni 72',Georgia,serif}
body{font-family:var(--sans);color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
button,input,textarea,select{font-family:var(--sans)}
:focus-visible{outline-color:var(--pink)!important}

/* wordmark: v51 tracked sans */
.wordmark,.site-footer>.wordmark{font-family:var(--sans)!important;font-weight:500!important;font-size:19px!important;letter-spacing:.34em!important;color:var(--ink)!important;text-transform:lowercase}

/* display headings: Bodoni 400, tight */
.setwise-hero h1,.question-heading h1,.free-example h2,.setwise-how h2,.complete h1,.complete h2,main h1,main h2{font-family:var(--serif);font-weight:400;letter-spacing:-.02em;color:var(--ink)}
.setwise-hero h1{line-height:1.04;letter-spacing:-.025em}
.setwise-personalized{color:var(--pink);font-style:italic}
.setwise-tagline{font-family:var(--sans);font-weight:500;color:var(--ink)}
.setwise-intro,.setwise-how-intro{color:#333}
.setwise-how h2{font-size:clamp(28px,3vw,38px);line-height:1.15}
.setwise-how h3{font-family:var(--sans);font-weight:500;font-size:16px;color:var(--ink)}
.setwise-how p{color:var(--muted)}
.question-heading h1{font-size:31px;line-height:1.1}
@media(min-width:700px){.question-heading h1{font-size:36px}}
.question-heading>p{color:var(--muted)}
.question-heading .eyebrow{color:var(--pink-text);text-transform:uppercase;letter-spacing:.16em;font-size:11px;font-weight:500}

/* buttons: v51 .btn (ink, white, uppercase, tracked, square) */
.primary,button.primary{background:var(--ink)!important;color:#fff!important;border-radius:0!important;font-family:var(--sans);font-size:13px!important;font-weight:500!important;letter-spacing:.18em;text-transform:uppercase;box-shadow:none}
.primary:hover:not(:disabled){background:#000!important}
.primary:disabled{background:#cfcfcf!important;color:#fff!important}
.secondary{border-color:var(--ink)!important;color:var(--ink);border-radius:0!important;font-size:13px;font-weight:500;letter-spacing:.18em;text-transform:uppercase}
.text-button{font-family:var(--sans);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--ink)}

/* answer cards: v51 .opt */
.option{background:#fff!important;border:1px solid var(--line)!important;border-radius:0!important;box-shadow:none!important}
.option:hover{border-color:#bdbdbd!important;background:#fff!important}
.option.selected{border-color:var(--ink)!important;background:var(--blush)!important;box-shadow:none!important}
.option-text strong{font-family:var(--sans);font-weight:500}
.option-text>span{color:var(--muted)!important}
.select-mark{border-color:#bdbdbd!important}
.option.selected .select-mark,.selected .select-mark{background:var(--ink)!important;border-color:var(--ink)!important;color:#fff!important}
.field-label{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--muted)}

/* progress: v51 pink */
.quiz-progress progress{accent-color:var(--pink);background:var(--line)}
.quiz-progress progress::-webkit-progress-bar{background:var(--line)}
.quiz-progress progress::-webkit-progress-value{background:var(--pink)}
.quiz-progress progress::-moz-progress-bar{background:var(--pink)}
.quiz-progress>span{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--muted)}
.stage-bar{background:#fff!important}
.stage-bar>div{background:#fff!important;color:var(--muted)!important;border-right-color:var(--line)!important;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:500}
.stage-bar>.current{color:var(--ink)!important;box-shadow:inset 0 -2px var(--pink)!important}
.stage-bar>.done{color:var(--ink)!important}

/* tips */
.tipbtn{color:var(--pink-text)!important;font-size:13.5px}
.tiptx{background:var(--blush)!important;border-left-color:var(--pink)!important;color:var(--muted);font-size:14px}

/* results: free example + brand-fit cards in the v51 card colors */
.free-example{border-color:var(--line);border-radius:0}
.free-example h2,.free-example__grid h3{font-family:var(--serif);font-weight:400;color:var(--ink)}
.free-example .free-profile-advice li::marker,.np-bf-lead__list li::marker{color:var(--pink)}
.np-bf .eyebrow{color:var(--pink-text);text-transform:uppercase;letter-spacing:.16em;font-size:11px;font-weight:500}
.np-bf h2{font-family:var(--serif);font-weight:400;color:var(--ink)}
.np-bf .sec{border-radius:0}
.np-bf .sec h3{font-family:var(--sans);font-size:11px;letter-spacing:.16em;font-weight:500}
.np-bf .sec.works{background:#f3faf6;border-left-color:#5fb38a}
.np-bf .sec.works h3{color:#23794f}
.np-bf .sec.avoid{background:#fdf4f3;border-left-color:#d9827b}
.np-bf .sec.avoid h3{color:#a8403a}
.np-bf .sec h3 .cnt{color:var(--muted)}
.np-bf ul.names li{border-bottom-color:rgba(0,0,0,.07)}
.np-bf .nm{font-family:var(--serif);font-size:20px;letter-spacing:-.01em;line-height:1.2;color:var(--ink)}
.np-bf .sec.avoid .nm{color:#4a4a4a}
.np-bf .why{font-family:var(--sans);font-size:13.5px;color:#8a4a45}
.np-bf .sib{font-size:12.5px;color:var(--muted)}
.np-bf blockquote.pq{font-size:14px;color:#444;border-left-color:#bfe0cd}
.np-bf blockquote.pq cite{font-size:10.5px;letter-spacing:.14em;color:#6b6b6b}
.np-bf a.blink{text-decoration-color:rgba(194,68,122,.45)}
.np-bf a.blink:hover{text-decoration-color:var(--pink)}
.np-bf-price{border-left-color:rgba(255,255,255,.4)}
/* Bodoni Moda's display optical size draws hairline-thin dashes: same fix as v51 (.hy) */
.hy{font-optical-sizing:none;font-variation-settings:'opsz' 11}

/* ---- v6 (Nov 2): section intro images + results transition/illustrations ---- */
/* Your style intro: show the whole photo (nail tips at top, thumb at bottom) over a blurred fill of the same photo */
/* Your nails intro: new photo, same full-bleed + shade treatment */
.section-intro--nails .section-intro__image{object-position:center 66%}
/* results: sales transition right under the brands */
.np-bf-lead{display:grid;grid-template-columns:200px 1fr;gap:28px;align-items:start;background:#fdeff1;border:0;border-radius:4px;margin-top:30px;padding:28px 30px}
.np-bf-art{width:100%;height:auto;display:block;border-radius:4px;mix-blend-mode:multiply}
.np-bf-next{font-family:var(--serif,'Bodoni Moda',serif);font-size:clamp(24px,2.6vw,32px);line-height:1.2;color:#121212;margin:0}
.np-bf-lead__intro{margin:10px 0 0}
/* decorative nail-shape strip above the free example (now below the plan info) */
@media (max-width:640px){
  .np-bf-lead{grid-template-columns:1fr;gap:16px;padding:22px 18px}
  .np-bf-art{max-width:120px}
  .np-bf-next{font-size:24px}
}

/* ---- v7 (Nov 2, late) ---- */
/* Your style intro: fills the screen and shows the whole hand. Wide (16:9) and tall (9:16) extended versions of the same photo. */
.quiz .section-intro--style,.section-intro--style{background:#3b3b3b url(/images/setwise-real/style-intro-wide.webp) center 40%/cover no-repeat}
.section-intro--style .section-intro__image{opacity:0}
@media (max-aspect-ratio:1/1){.quiz .section-intro--style,.section-intro--style{background-image:url(/images/setwise-real/style-intro-tall.webp);background-position:center 35%}}
/* results: profile part a little smaller */
.completion h1{font-size:clamp(28px,3.4vw,40px);margin:12px 0 16px}
.completion-intro>p{font-size:17px}
.snapshot-grid{gap:16px;margin:28px 0}
.snapshot-grid article{padding:20px 22px}
.snapshot-grid h2{font-size:21px;margin:8px 0 10px}
.snapshot-grid p{font-size:15px;line-height:1.6}
@media (max-width:640px){.snapshot-grid{gap:12px}.snapshot-grid article{padding:18px}}
/* transition into the plan list */
.np-bf-transition{font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.35;color:#b0386c;margin:22px 0 0}
/* Sample Profile Example title: Bodoni italic in pink to break up the black text */
.free-example h2.np-sample-title{font-family:var(--serif);font-style:italic;font-weight:400;color:#c2447a;letter-spacing:-.01em}
.np-nowrap{white-space:nowrap}
/* v8: pink section headline + italic subline */
.purchase-offer h2 .np-plan-sub{display:block;margin-top:14px;font-family:var(--serif);font-style:italic;font-weight:400;font-size:.62em;line-height:1.25;letter-spacing:0}
/* v8: press-on profile box ~10% smaller (from v7 sizes) */
.completion h1{font-size:clamp(25px,3.05vw,36px);margin:11px 0 14px}
.completion-intro>p{font-size:15.5px}
.snapshot-grid{gap:14px;margin:25px 0}
.snapshot-grid article{padding:18px 20px}
.snapshot-grid h2{font-size:19px;margin:7px 0 9px}
.snapshot-grid p{font-size:13.5px}
@media (max-width:640px){.snapshot-grid{gap:11px}.snapshot-grid article{padding:16px}}
/* v8: readability of large italics: upright Bodoni with a gentle slant instead of the calligraphic italic */
.free-example h2.np-sample-title{font-style:normal;font-weight:500;display:inline-block;transform:skewX(-6deg);transform-origin:left bottom;letter-spacing:0}
.np-bf-transition{font-style:normal;font-weight:500;transform:skewX(-5deg);transform-origin:left bottom}
.purchase-offer h2 .np-plan-sub{font-family:var(--sans);font-style:italic;font-weight:400;font-size:.6em}
/* v8: what's inside + sample label + soft fade at the bottom of the sample */
.np-inside{border:1px solid #e5e5e5;border-radius:14px;padding:20px 22px;margin:0 0 30px;background:#fff}
.np-inside-title{font-family:var(--serif);font-weight:500;font-size:22px;margin:0 0 12px;color:#121212}
.np-inside-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:10px 26px}
.np-inside-list li{display:flex;flex-direction:column;font-size:15px;line-height:1.45;padding-left:14px;border-left:2px solid #c2447a}
.np-inside-list strong{font-weight:500;color:#121212}
.np-inside-list span{color:#595a5b}
@media (max-width:640px){.np-inside-list{grid-template-columns:1fr}}
.np-sample-label{display:inline-block;margin:0 0 8px;padding:4px 12px;border-radius:999px;background:#fdeff1;color:#b0386c;font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase}
.free-example .np-sample-label+h2.np-sample-title{display:block;width:max-content;max-width:100%}
.np-sample-doc{position:relative}
.np-sample-doc::after{content:"";position:absolute;left:0;right:0;bottom:0;height:45%;pointer-events:none;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 65%);mask-image:linear-gradient(to bottom,transparent,#000 65%);background:linear-gradient(to bottom,rgba(255,255,255,0),rgba(255,255,255,.88))}
/* v8: delivery line under the plan button */
.np-bf-delivery{font-size:13.5px;line-height:1.5;color:#595a5b;margin:10px 0 0}