/* ==========================================================================
   NO FIO DA NAVALHA — Design System v1.0 · Componentes do site
   Compostos só com os fundamentos e as peças básicas.
   ========================================================================== */

.nfn-container { width: min(100% - 2 * var(--gutter), var(--container)); margin-inline: auto; }
.nfn-grid-lines { /* colunas visíveis à Crisp */
  background-image: repeating-linear-gradient(90deg, var(--grid-line) 0 1px, transparent 1px calc(100% / 6));
  background-size: calc(100% - 2 * var(--gutter)) 100%;
  background-position: var(--gutter) 0;
  background-repeat: no-repeat;
}
.nfn-logo { display: inline-block; line-height: 0; }
.nfn-logo img { height: var(--logo-h, 48px); width: auto; }
.nfn-paper .nfn-logo img, [data-theme="light"] .nfn-logo img { filter: invert(1) hue-rotate(180deg) brightness(.25) contrast(1.4); }
.nfn-logo--keep img { filter: none !important; }

/* ==========================================================================
   Cabeçalho
   ========================================================================== */
.nfn-header {
  --logo-h: 44px;
  position: sticky; top: 0; z-index: var(--z-header);
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem;
  padding: .85rem var(--gutter);
  transition: background-color var(--dur-4) var(--ease-out), border-color var(--dur-4) var(--ease-out), padding var(--dur-4) var(--ease-out), backdrop-filter var(--dur-4) var(--ease-out);
  border-bottom: 1px solid transparent;
  color: var(--bone-100);
}
.nfn-header.is-scrolled { background: var(--glass-bg); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); border-bottom-color: var(--glass-border); padding-block: .6rem; --logo-h: 38px; }
.nfn-header .nfn-logo img { transition: height var(--dur-4) var(--ease-out); }
.nfn-header__nav { display: flex; gap: .25rem; }
.nfn-nav-link { position: relative; padding: .55rem .9rem; border-radius: var(--radius-sm); font-size: var(--text-2xs); font-weight: 600; letter-spacing: var(--tracking-label); text-transform: uppercase; text-decoration: none; color: var(--text-2); transition: color var(--dur-2) var(--ease-out), background-color var(--dur-2) var(--ease-out); }
.nfn-nav-link::after { content: ""; position: absolute; left: .9rem; right: .9rem; bottom: .35rem; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform var(--dur-3) var(--ease-out); }
@media (hover: hover) { .nfn-nav-link:hover { color: var(--text); } .nfn-nav-link:hover::after { transform: scaleX(1); } }
.nfn-nav-link[aria-current="page"] { color: var(--text); background: rgba(244, 241, 234, .08); }
.nfn-nav-link[aria-current="page"]::after { display: none; }
.nfn-header__end { display: flex; gap: .5rem; justify-content: flex-end; align-items: center; }
.nfn-header__end .nfn-btn--icon { --btn-h: 42px; }
@media (max-width: 520px) { .nfn-book__foot [data-back] span { display: none; } .nfn-book__foot [data-back] { --btn-px: .75rem; } .nfn-book__total strong { font-size: 1.3rem; } }
@media (max-width: 860px) { .nfn-header { grid-template-columns: 1fr auto; } .nfn-header__nav, .nfn-header .nfn-hide-m { display: none; } }

/* Pílula de estado (aberto/fechado) */
.nfn-open { display: inline-flex; align-items: center; gap: .5rem; height: 36px; padding: 0 .9rem 0 .75rem; border-radius: var(--radius-pill); background: rgba(13,13,13,.55); border: 1px solid rgba(244,241,234,.14); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); font-size: var(--text-2xs); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--sage-400); white-space: nowrap; }
.nfn-open .nfn-badge__dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.nfn-open.is-closed { color: var(--coral-500); }
.nfn-open small { color: var(--bone-400); letter-spacing: .06em; text-transform: none; font-weight: 500; font-size: .72rem; }

/* ==========================================================================
   Menu ecrã inteiro — índice gigante com imagem (Crisp) + revelação em círculo
   ========================================================================== */
.nfn-fullmenu { position: fixed; inset: 0; z-index: calc(var(--z-header) + 5); background: var(--carbon-1000); color: var(--bone-100); display: grid; grid-template-rows: auto 1fr auto; clip-path: circle(0 at var(--cx, 95%) var(--cy, 4%)); visibility: hidden; transition: clip-path var(--dur-5) var(--ease-in-out), visibility 0s linear var(--dur-5); }
.nfn-fullmenu.is-open { clip-path: circle(150% at var(--cx, 95%) var(--cy, 4%)); visibility: visible; transition: clip-path calc(var(--dur-5) * 1.4) var(--ease-in-out), visibility 0s; }
.nfn-fullmenu__top { display: flex; justify-content: space-between; align-items: center; padding: 1rem var(--gutter); --logo-h: 40px; }
.nfn-fullmenu__body { display: grid; grid-template-columns: 1.3fr 1fr; gap: var(--gutter); align-items: center; padding: 0 var(--gutter); min-height: 0; }
.nfn-fullmenu__list { list-style: none; margin: 0; padding: 0; }
.nfn-fullmenu__list li { overflow: hidden; border-bottom: 1px solid rgba(244,241,234,.1); }
.nfn-fullmenu__link { display: flex; align-items: baseline; gap: 1rem; padding: .35rem 0; text-decoration: none; color: inherit; font-family: var(--font-display); font-variation-settings: "wdth" 125; font-weight: 800; text-transform: uppercase; font-size: clamp(2.25rem, 1rem + 5.4vw, 5.6rem); line-height: 1; letter-spacing: -0.03em; transform: translateY(100%); transition: transform var(--dur-6) var(--ease-out), color var(--dur-2) var(--ease-out); transition-delay: calc((var(--i) * 50ms + 120ms) * var(--motion-scale)), 0s; }
.nfn-fullmenu.is-open .nfn-fullmenu__link { transform: none; }
@media (hover: hover) { .nfn-fullmenu__list:hover .nfn-fullmenu__link { color: var(--bone-500); } .nfn-fullmenu__list .nfn-fullmenu__link:hover { color: var(--bone-100); } }
.nfn-fullmenu__media { position: relative; aspect-ratio: 4 / 5; max-height: 62vh; border-radius: var(--radius-lg); overflow: hidden; justify-self: end; width: min(100%, 420px); }
.nfn-fullmenu__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: var(--photo-filter); opacity: 0; transform: scale(1.06); transition: opacity var(--dur-5) var(--ease-out), transform var(--dur-6) var(--ease-out); }
.nfn-fullmenu__media img.is-on { opacity: 1; transform: none; }
.nfn-fullmenu__foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; padding: 1.25rem var(--gutter) calc(1.25rem + env(safe-area-inset-bottom)); border-top: 1px solid rgba(244,241,234,.1); font-size: var(--text-sm); color: var(--bone-400); }
@media (max-width: 760px) { .nfn-fullmenu__body { grid-template-columns: 1fr; } .nfn-fullmenu__media { display: none; } }

/* ==========================================================================
   Tab bar em vidro (telemóvel) + botão "Marcar" flutuante + rail
   ========================================================================== */
.nfn-tabbar { position: relative; display: flex; align-items: stretch; padding: 6px; gap: 2px; border-radius: 18px; background: rgba(13,13,13,.92); border: 1px solid rgba(244,241,234,.1); box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 18px 40px -14px rgba(0,0,0,.7); backdrop-filter: blur(18px) saturate(140%); -webkit-backdrop-filter: blur(18px) saturate(140%); color: var(--bone-100); width: max-content; max-width: 100%; }
.nfn-tabbar__ind { position: absolute; bottom: 7px; left: 0; height: 1.5px; width: var(--w, 0); background: var(--bone-100); transform: translateX(var(--x, 0)) scaleX(.42); transition: transform var(--dur-4) var(--ease-out), width var(--dur-4) var(--ease-out), opacity var(--dur-2); }
.nfn-tabbar__btn { position: relative; z-index: 1; display: grid; justify-items: center; align-content: center; gap: 5px; min-width: 62px; padding: .55rem .6rem .7rem; border: 0; border-radius: 12px; background: transparent; color: var(--bone-500); cursor: pointer; font-family: var(--font-sans); font-size: .5625rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; transition: color var(--dur-3) var(--ease-out), transform var(--dur-1) var(--ease-out); }
.nfn-tabbar__btn .nfn-icon { width: 20px; height: 20px; }
.nfn-tabbar__btn[aria-current="page"] { color: var(--bone-100); }
.nfn-tabbar__btn:active { transform: scale(.94); }
.nfn-tabbar__btn:focus-visible { outline: 2px solid var(--bone-100); outline-offset: -2px; }
.nfn-tabbar__btn--cta { margin: 0 4px; padding-inline: 1rem; border-radius: 12px; background: var(--gold-500); color: var(--carbon-950); font-family: var(--font-display); font-variation-settings: "wdth" 120; font-weight: 800; font-size: .625rem; letter-spacing: .08em; }
.nfn-tabbar__btn--cta[aria-current="page"] { color: var(--carbon-950); }
@media (hover: hover) { .nfn-tabbar__btn:not(.nfn-tabbar__btn--cta):hover { color: var(--bone-100); } }
.nfn-tabbar--fixed { position: fixed; left: 50%; bottom: calc(12px + env(safe-area-inset-bottom)); transform: translateX(-50%); z-index: var(--z-sticky); }
@media (max-width: 380px) { .nfn-tabbar__btn { min-width: 54px; padding-inline: .45rem; } .nfn-tabbar__btn--cta { padding-inline: .8rem; } }

.nfn-fab { position: fixed; right: max(1rem, env(safe-area-inset-right)); bottom: max(1rem, env(safe-area-inset-bottom)); z-index: var(--z-sticky); }
.nfn-fab.nfn-btn { --btn-h: 56px; box-shadow: var(--glass-edge), 0 18px 40px -12px rgba(0,0,0,.7); transition: transform var(--dur-4) var(--ease-out), opacity var(--dur-3) var(--ease-out), background-color var(--dur-2) var(--ease-out); }
.nfn-fab.is-hidden { transform: translateY(calc(100% + 2rem)); opacity: 0; pointer-events: none; }

.nfn-rail { display: grid; grid-template-rows: auto 1fr auto; justify-items: center; gap: 1rem; width: 64px; padding: 1rem 0; border-radius: 32px; background: var(--carbon-1000); color: var(--bone-100); border: 1px solid rgba(244,241,234,.08); min-height: 420px; }
.nfn-rail__mark { width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(244,241,234,.3); display: grid; place-items: center; }
.nfn-rail__mark .nfn-icon { width: 20px; height: 20px; }
.nfn-rail__mid { display: grid; align-content: start; justify-items: center; gap: .9rem; }
.nfn-rail__v { writing-mode: vertical-rl; transform: rotate(180deg); font-size: .625rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; background: none; border: 0; color: inherit; cursor: pointer; padding: .5rem .25rem; border-radius: 6px; transition: color var(--dur-2) var(--ease-out); }
@media (hover: hover) { .nfn-rail__v:hover { color: var(--bone-400); } }
.nfn-rail__dots { display: grid; gap: 6px; }
.nfn-rail__dots span { width: 3px; height: 3px; border-radius: 50%; background: var(--bone-500); }

/* ==========================================================================
   Hero editorial (anexo 1 + Crisp) — cartão de foto com recorte côncavo
   ========================================================================== */
.nfn-hero { position: relative; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); grid-template-rows: auto 1fr; gap: 14px; padding: 14px; background: var(--bg); border-radius: var(--radius-xl); min-height: 640px; }
.nfn-hero__intro { display: grid; grid-template-columns: auto 1fr; gap: 1.25rem 2rem; align-content: start; padding: 1.25rem 1.25rem 0; }
.nfn-hero__intro .nfn-logo { --logo-h: 56px; }
.nfn-hero__tag { font-family: var(--font-serif); font-size: 1.15rem; line-height: 1.35; margin: 0; color: var(--text); }
.nfn-hero__tag span { color: var(--text-3); }
.nfn-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; position: relative; }
.nfn-steps::before { display: none; }
.nfn-steps li { position: relative; display: grid; grid-template-columns: 11px 1fr; gap: 1rem; padding: .55rem 0; }
.nfn-steps li:not(:last-child)::after { content: ""; position: absolute; left: 5px; top: 21px; bottom: -11px; width: 1px; background: var(--border); }
.nfn-steps li::before { content: ""; width: 11px; height: 11px; border-radius: 50%; margin-top: .25rem; background: var(--bg); border: 1px solid var(--border-strong); position: relative; z-index: 1; transition: background-color var(--dur-3) var(--ease-out), border-color var(--dur-3) var(--ease-out); }
.nfn-steps li.is-current::before { background: var(--text); border-color: var(--text); box-shadow: 0 0 0 4px var(--bg), 0 0 0 5px var(--border-strong); }
.nfn-steps b { display: block; font-size: var(--text-2xs); letter-spacing: var(--tracking-label); text-transform: uppercase; font-weight: 600; }
.nfn-steps span { font-size: var(--text-sm); color: var(--text-3); }
.nfn-steps li:not(.is-current) b { color: var(--text-2); }
.nfn-hero__tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; align-self: end; }
.nfn-hero__photo { grid-column: 2; grid-row: 1 / 3; position: relative; border-radius: var(--radius-xl); overflow: hidden; min-height: 520px; }
.nfn-hero__photo .nfn-photo { position: absolute; inset: 0; }
.nfn-hero__photo .nfn-photo img { object-position: 60% 30%; }
.nfn-hero__photo-meta { position: absolute; right: 1.5rem; top: 5.5rem; z-index: 3; text-align: right; max-width: 220px; font-size: var(--text-2xs); letter-spacing: var(--tracking-label); text-transform: uppercase; font-weight: 600; color: var(--bone-100); line-height: 1.6; }
.nfn-hero__photo-meta::after { content: ""; display: block; width: 40px; height: 1px; background: var(--ornament); margin: .75rem 0 0 auto; }
.nfn-hero__photo-top { position: absolute; top: 1.25rem; right: 1.25rem; left: 1.25rem; z-index: 3; display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.nfn-hero__title-wrap { position: absolute; left: 0; bottom: 0; z-index: 3; background: var(--bg); padding: 1.5rem 2rem 0 1.25rem; border-top-right-radius: var(--radius-xl); max-width: calc(100% - 3rem); }
.nfn-hero__title-wrap::before, .nfn-hero__title-wrap::after { content: ""; position: absolute; width: var(--radius-xl); height: var(--radius-xl); background: radial-gradient(circle at 100% 0, transparent calc(var(--radius-xl) - .5px), var(--bg) var(--radius-xl)); }
.nfn-hero__title-wrap::before { left: 0; top: calc(var(--radius-xl) * -1); }
.nfn-hero__title-wrap::after { right: calc(var(--radius-xl) * -1); bottom: 0; }
.nfn-hero__title { font-size: clamp(2.4rem, .8rem + 4.4vw, 5.25rem); }
.nfn-hero__title .nfn-serif-i { font-family: var(--font-serif); font-weight: 300; font-style: italic; text-transform: none; letter-spacing: -0.02em; font-variation-settings: normal; }
.nfn-hero__cta { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; padding: 0 1.25rem 1rem; align-self: end; }
@media (max-width: 960px) {
  .nfn-hero { grid-template-columns: 1fr; padding: 10px; }
  .nfn-hero__photo { grid-column: 1; grid-row: 1; min-height: 78svh; }
  .nfn-hero__title-wrap { padding: 1.1rem 1.25rem 0 1rem; }
  .nfn-hero__intro { grid-template-columns: 1fr; padding: .75rem .5rem 0; }
  .nfn-hero__tiles { grid-template-columns: repeat(3, 1fr); }
  .nfn-hero__cta { padding: 0 .5rem .75rem; }
}
@media (max-width: 520px) { .nfn-hero__photo-meta { display: none; } .nfn-hero__title { font-size: clamp(2.1rem, .6rem + 8.6vw, 3.4rem); } }

/* Tile fotográfico de serviço (anexo 1) */
.nfn-tile { position: relative; display: grid; align-content: end; aspect-ratio: 1 / 1; border-radius: var(--radius-md); overflow: hidden; text-decoration: none; color: var(--bone-100); background: var(--carbon-850); isolation: isolate; cursor: pointer; border: 0; padding: 0; text-align: left; }
.nfn-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: var(--photo-filter) brightness(.7); transition: transform var(--dur-6) var(--ease-out), filter var(--dur-4) var(--ease-out); z-index: -1; }
.nfn-tile::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, transparent 40%, rgba(7,7,6,.85)); }
.nfn-tile span { padding: .7rem .8rem; font-size: .625rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; line-height: 1.3; display: flex; justify-content: space-between; align-items: end; gap: .4rem; }
.nfn-tile span .nfn-icon { width: 14px; height: 14px; opacity: 0; transform: translate(-4px, 4px); transition: opacity var(--dur-3) var(--ease-out), transform var(--dur-3) var(--ease-out); flex: none; }
@media (hover: hover) { .nfn-tile:hover img { transform: scale(1.06); filter: var(--photo-filter) brightness(.85); } .nfn-tile:hover span .nfn-icon { opacity: 1; transform: none; } }
.nfn-tile:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.nfn-tile--tall { aspect-ratio: 3 / 4; }
.nfn-tile--tall span { font-size: .75rem; padding: 1rem; }

/* ==========================================================================
   Marquee duplo + "Próximo" gigante (Hagi's)
   ========================================================================== */
.nfn-marquee { position: relative; overflow: hidden; padding: 1rem 0; --speed: 38s; user-select: none; }
.nfn-marquee__row { display: flex; width: max-content; gap: 0; animation: nfn-marq calc(var(--speed) * var(--motion-scale)) linear infinite; }
.nfn-marquee__row--rev { animation-direction: reverse; }
.nfn-marquee__row span { flex: none; padding-right: .5em; font-family: var(--font-serif); font-weight: 300; text-transform: uppercase; font-size: clamp(2.5rem, 1.2rem + 5vw, 6rem); line-height: 1.02; letter-spacing: -0.02em; white-space: nowrap; }
/* estrela centrada na altura das maiúsculas (≈0,7em): base + .35em */
.nfn-marquee__star { display: inline-block; width: .34em; height: .34em; margin: 0 .28em; vertical-align: baseline; transform: translateY(-.18em); color: var(--ornament); }
.nfn-marquee__star svg { display: block; width: 100%; height: 100%; fill: currentColor; }
.nfn-marquee__row--rev span { font-family: var(--font-display); font-variation-settings: "wdth" 125; font-weight: 800; letter-spacing: -0.03em; -webkit-text-stroke: 1px var(--text); color: transparent; }
@keyframes nfn-marq { to { transform: translateX(-50%); } }
.nfn-marquee:hover .nfn-marquee__row { animation-play-state: paused; }
.nfn-marquee__photos { position: absolute; inset: 0; pointer-events: none; }

.nfn-next { display: grid; justify-items: center; gap: .25rem; padding: var(--section-y) var(--gutter); text-decoration: none; color: var(--text); border-top: 1px solid var(--border); text-align: center; }
.nfn-next small { font-family: var(--font-serif); font-style: italic; font-size: 1.15rem; color: var(--text-2); }
.nfn-next strong { font-family: var(--font-serif); font-weight: 300; text-transform: uppercase; font-size: var(--text-mega); line-height: .9; letter-spacing: -0.03em; transition: letter-spacing var(--dur-6) var(--ease-out); }
.nfn-next .nfn-cut { width: min(320px, 60%); margin-top: 1rem; color: var(--text-3); }
@media (hover: hover) { .nfn-next:hover strong { letter-spacing: 0; } .nfn-next:hover .nfn-cut { transform: scaleX(1); } }
.nfn-next:focus-visible { outline: 2px solid var(--focus); outline-offset: -8px; }

/* ==========================================================================
   Serviços e preços
   ========================================================================== */
.nfn-sec-head { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 1.5rem 2rem; margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.nfn-sec-head .nfn-eyebrow { grid-column: 1 / -1; margin: 0; }
@media (max-width: 640px) { .nfn-sec-head { grid-template-columns: 1fr; } }

/* Menu de preços com filete (Hagi's) */
.nfn-menu-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.nfn-menu-row { display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; gap: .9rem; padding: 1rem 0; border-bottom: 1px solid var(--border-subtle); cursor: default; }
.nfn-menu-row__name { font-family: var(--font-display); font-variation-settings: "wdth" 112; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; font-size: clamp(.95rem, .85rem + .4vw, 1.15rem); }
.nfn-menu-row__name small { display: block; font-family: var(--font-sans); font-variation-settings: normal; font-size: var(--text-xs); font-weight: 500; letter-spacing: .04em; color: var(--text-3); text-transform: none; margin-top: .2rem; }
.nfn-menu-row__lead { height: 1px; align-self: center; background: var(--border-strong); transform-origin: left; transform: scaleX(var(--lead, 1)); transition: transform var(--dur-6) var(--ease-in-out), background-color var(--dur-3) var(--ease-out); margin-top: .1rem; }
.nfn-menu-row__price { font-family: var(--font-serif); font-size: clamp(1.25rem, 1rem + .9vw, 1.75rem); font-weight: 500; font-variant-numeric: lining-nums tabular-nums; white-space: nowrap; }
.nfn-menu-row__dur { font-family: var(--font-mono); font-size: var(--text-xs); color: var(--text-3); margin-right: .6rem; }
@media (hover: hover) { .nfn-menu-row:hover .nfn-menu-row__lead { background: var(--text); } }
.nfn-menu-list.nfn-reveal .nfn-menu-row__lead { --lead: 0; }
.nfn-menu-list.nfn-reveal.is-in .nfn-menu-row__lead { --lead: 1; }
.nfn-menu-note { margin: 1.25rem 0 0; font-size: var(--text-2xs); letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--text-3); font-weight: 600; }
@media (max-width: 480px) { .nfn-menu-row { grid-template-columns: 1fr auto; } .nfn-menu-row__lead { display: none; } .nfn-menu-row__dur { display: block; margin: .25rem 0 0; } }

/* Tabela em colunas com borda (Crisp) */
.nfn-price-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--border-strong); }
.nfn-price-col { display: grid; grid-template-rows: auto 1fr auto; gap: 1.25rem; padding: 1.5rem; min-width: 0; }
.nfn-price-col + .nfn-price-col { border-left: 1px solid var(--border-strong); }
.nfn-price-col h3 { margin: 0; font-family: var(--font-display); font-variation-settings: "wdth" 125; font-weight: 800; text-transform: uppercase; font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem); line-height: 1; letter-spacing: -0.01em; }
.nfn-price-col p { margin: .5rem 0 0; font-size: var(--text-sm); color: var(--text-2); }
.nfn-price-col dl { margin: 0; display: grid; gap: .35rem; align-self: end; }
.nfn-price-col dl div { display: flex; justify-content: space-between; gap: 1rem; font-size: var(--text-sm); font-weight: 600; }
.nfn-price-col dd { margin: 0; font-variant-numeric: tabular-nums; }
@media (max-width: 800px) { .nfn-price-cols { grid-template-columns: 1fr; } .nfn-price-col + .nfn-price-col { border-left: 0; border-top: 1px solid var(--border-strong); } }

/* Cartão de serviço (evolução do atual) */
.nfn-svc { display: grid; grid-template-columns: 88px 1fr auto; gap: 1rem; align-items: center; padding: .75rem 1.25rem .75rem .75rem; border-radius: var(--radius-lg); background: var(--surface-1); border: 1px solid var(--border-subtle); transition: border-color var(--dur-2) var(--ease-out), transform var(--dur-3) var(--ease-out); min-width: 0; }
.nfn-svc__img { width: 88px; height: 88px; border-radius: calc(var(--radius-lg) - .75rem); overflow: hidden; }
.nfn-svc__img img { width: 100%; height: 100%; object-fit: cover; filter: var(--photo-filter); }
.nfn-svc__name { margin: .15rem 0 0; font-family: var(--font-serif); font-weight: 500; font-size: 1.2rem; line-height: 1.2; }
.nfn-svc__price { font-family: var(--font-serif); font-size: 1.6rem; font-weight: 500; font-variant-numeric: lining-nums; white-space: nowrap; }
@media (hover: hover) { .nfn-svc:hover { border-color: var(--border); } }
@media (max-width: 420px) { .nfn-svc { grid-template-columns: 64px 1fr auto; padding-right: 1rem; } .nfn-svc__img { width: 64px; height: 64px; } .nfn-svc__price { font-size: 1.3rem; } }

/* ==========================================================================
   Marcação (wizard de 4 passos)
   ========================================================================== */
.nfn-book { display: grid; grid-template-columns: 260px minmax(0, 1fr); border-radius: var(--radius-xl); background: var(--surface-1); border: 1px solid var(--border-subtle); overflow: hidden; box-shadow: var(--shadow-2); }
.nfn-book__side { padding: 1.75rem 1.5rem; background: var(--surface-2); border-right: 1px solid var(--border-subtle); display: grid; grid-template-rows: auto 1fr auto; gap: 1.5rem; }
.nfn-book__side h2 { margin: 0; font-family: var(--font-serif); font-weight: 400; font-size: 1.75rem; line-height: 1.05; }
.nfn-book__side h2 em { font-weight: 300; }
.nfn-book__main { display: grid; grid-template-rows: auto 1fr auto; min-width: 0; }
.nfn-book__head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.25rem 1.75rem; border-bottom: 1px solid var(--border-subtle); min-height: 72px; }
.nfn-book__head h3 { margin: 0; font-size: var(--text-2xs); letter-spacing: var(--tracking-label); text-transform: uppercase; font-weight: 600; }
.nfn-book__head h3 span { color: var(--text-3); margin-right: .6rem; font-family: var(--font-mono); letter-spacing: 0; }
.nfn-book__body { position: relative; padding: 1.5rem 1.75rem; overflow: hidden; }
.nfn-book__step { display: grid; gap: 1rem; align-content: start; }
.nfn-book__step[hidden] { display: none; }
.nfn-book__step.is-enter { animation: nfn-step-in var(--dur-5) var(--ease-out); }
.nfn-book__step.is-enter-back { animation: nfn-step-back var(--dur-5) var(--ease-out); }
@keyframes nfn-step-in { from { opacity: 0; transform: translateX(24px); } }
@keyframes nfn-step-back { from { opacity: 0; transform: translateX(-24px); } }
.nfn-book__foot { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 1.75rem; border-top: 1px solid var(--border-subtle); background: color-mix(in oklab, var(--surface-1) 80%, transparent); }
.nfn-book__total { display: grid; line-height: 1.2; }
.nfn-book__foot .nfn-btn-row { flex-wrap: nowrap; }
.nfn-book__total small { font-size: var(--text-2xs); letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--text-3); font-weight: 600; }
.nfn-book__total strong { font-family: var(--font-serif); font-size: 1.5rem; font-weight: 500; font-variant-numeric: tabular-nums; }
.nfn-book__total span { font-size: var(--text-xs); color: var(--text-3); }
.nfn-book .nfn-steps li { cursor: default; }
.nfn-book__side .nfn-steps { align-content: start; }
.nfn-book .nfn-steps li.is-done::before { background: var(--text-2); border-color: var(--text-2); }
.nfn-book .nfn-steps li.is-done b { color: var(--text-2); }
.nfn-book__mobile-steps { display: none; }
.nfn-book__step[data-step="1"] [role="group"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1100px) { .nfn-book__step[data-step="1"] [role="group"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 860px) {
  .nfn-book { grid-template-columns: minmax(0, 1fr); border-radius: var(--radius-lg); }
  .nfn-hold .nfn-hide-m { display: none; }
  .nfn-book__side { display: none; }
  .nfn-book__mobile-steps { display: flex; gap: 4px; }
  .nfn-book__mobile-steps span { width: 22px; height: 3px; border-radius: 3px; background: var(--border-strong); transition: background-color var(--dur-3) var(--ease-out), width var(--dur-4) var(--ease-out); }
  .nfn-book__mobile-steps span.is-on { background: var(--text); width: 34px; }
  .nfn-book__head, .nfn-book__body, .nfn-book__foot { padding-inline: 1.1rem; }
  .nfn-book__foot { position: sticky; bottom: 0; }
  .nfn-book__step[data-step="1"] [role="group"] { grid-template-columns: 1fr !important; }
}

/* serviço escolhível */
.nfn-svc-choice .nfn-check__box { margin-top: 0; }
.nfn-svc-choice__info { flex: 1; min-width: 0; }
.nfn-svc-choice__name { display: block; font-family: var(--font-serif); font-size: 1.1rem; font-weight: 500; line-height: 1.25; }
.nfn-svc-choice__meta { font-size: var(--text-xs); color: var(--text-3); font-family: var(--font-mono); }
.nfn-svc-choice__price { font-family: var(--font-serif); font-size: 1.3rem; font-weight: 500; white-space: nowrap; }
.nfn-svc-choice .nfn-check__box { pointer-events: none; }
.nfn-choice:has(input:checked) .nfn-check__box { background: var(--selected); border-color: var(--selected); }
.nfn-choice:has(input:checked) .nfn-check__box svg { stroke-dashoffset: 0; }

/* Calendário do mês (anexo 2) */
.nfn-cal { display: grid; gap: .75rem; }
.nfn-cal__head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.nfn-cal__month { font-family: var(--font-serif); font-size: 1.3rem; font-weight: 500; margin: 0; }
.nfn-cal__nav { display: flex; gap: .35rem; }
.nfn-cal__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.nfn-cal__dow { text-align: center; font-size: .625rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); padding-bottom: .25rem; }
.nfn-day { position: relative; aspect-ratio: 1; max-width: 52px; width: 100%; justify-self: center; border-radius: 50%; border: 1px solid transparent; background: var(--surface-2); color: var(--text); font-size: var(--text-sm); font-weight: 500; font-variant-numeric: tabular-nums; cursor: pointer; display: grid; place-items: center; transition: background-color var(--dur-2) var(--ease-out), color var(--dur-2) var(--ease-out), transform var(--dur-1) var(--ease-out), border-color var(--dur-2) var(--ease-out); }
@media (hover: hover) { .nfn-day:hover:not(:disabled):not([aria-pressed="true"]) { background: var(--surface-hover); } }
.nfn-day:active:not(:disabled) { transform: scale(.92); }
.nfn-day:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.nfn-day.is-today { border-color: var(--border-strong); }
.nfn-day.is-today::after { content: ""; position: absolute; bottom: 18%; width: 4px; height: 4px; border-radius: 50%; background: currentColor; }
.nfn-day.is-few::before { content: ""; position: absolute; top: 12%; right: 14%; width: 6px; height: 6px; border-radius: 50%; background: var(--warning); box-shadow: 0 0 0 2px var(--surface-1); }
.nfn-day[aria-pressed="true"] { background: var(--selected); color: var(--selected-text); }
.nfn-day:disabled { background: transparent; border: 1px dashed var(--border); color: var(--text-disabled); cursor: not-allowed; }
.nfn-day.is-closed:disabled { border-style: solid; border-color: transparent; text-decoration: line-through; text-decoration-color: var(--border-strong); }
.nfn-day.is-out { visibility: hidden; }
.nfn-cal__legend { display: flex; flex-wrap: wrap; gap: .4rem 1rem; font-size: var(--text-xs); color: var(--text-3); }
.nfn-cal__legend span { display: inline-flex; align-items: center; gap: .4rem; }
.nfn-cal__legend i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }

/* Grelha de horários */
.nfn-slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: .5rem; }
.nfn-slot { position: relative; height: 46px; border-radius: var(--radius-sm); border: 1px solid var(--border); background: transparent; color: var(--text); font-family: var(--font-mono); font-size: var(--text-sm); cursor: pointer; transition: background-color var(--dur-2) var(--ease-out), border-color var(--dur-2) var(--ease-out), color var(--dur-2) var(--ease-out), transform var(--dur-1) var(--ease-out); }
@media (hover: hover) { .nfn-slot:hover:not(:disabled):not([aria-pressed="true"]) { border-color: var(--text-2); } }
.nfn-slot:active:not(:disabled) { transform: scale(.95); }
.nfn-slot:focus-visible { box-shadow: var(--focus-ring); outline: none; }
.nfn-slot[aria-pressed="true"] { background: var(--selected); border-color: var(--selected); color: var(--selected-text); }
.nfn-slot:disabled { color: var(--text-disabled); border-color: var(--border-subtle); text-decoration: line-through; cursor: not-allowed; background: repeating-linear-gradient(135deg, transparent 0 6px, var(--border-subtle) 6px 7px); }
.nfn-slot.is-held:disabled { text-decoration: none; color: var(--warning); border-color: var(--warning-border); background: var(--warning-bg); }
.nfn-slot.is-held::after { content: ""; position: absolute; top: 5px; right: 5px; width: 6px; height: 6px; border-radius: 50%; background: var(--warning); }
.nfn-slots-empty { padding: 2rem 1rem; border-radius: var(--radius-md); border: 1px dashed var(--border-strong); text-align: center; color: var(--text-2); display: grid; gap: .75rem; justify-items: center; }
.nfn-hold { display: inline-flex; align-items: center; gap: .5rem; font-size: var(--text-xs); color: var(--text-2); }
.nfn-hold .nfn-mono { color: var(--text); }
.nfn-hold .nfn-ring span { font-size: .6rem; letter-spacing: -.02em; }
.nfn-book__split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.75rem; }
@media (max-width: 1100px) { .nfn-book__split { grid-template-columns: 1fr; } }

/* Checklist de progresso (Wafer) */
.nfn-checklist { position: relative; border-radius: var(--radius-lg); padding: 1.1rem 1.25rem; background: var(--carbon-1000); color: var(--bone-100); overflow: hidden; isolation: isolate; border: 1px solid transparent; background-clip: padding-box; }
.nfn-checklist::before { content: ""; position: absolute; inset: -1px; z-index: -2; border-radius: inherit; background: conic-gradient(from var(--a, 0deg), rgba(244,241,234,.06), rgba(244,241,234,.5), rgba(201,160,99,.55), rgba(244,241,234,.06) 40%); animation: nfn-spin-a calc(6s * var(--motion-scale)) linear infinite; }
.nfn-checklist::after { content: ""; position: absolute; inset: 1px; z-index: -1; border-radius: calc(var(--radius-lg) - 1px); background: radial-gradient(60% 120% at 92% 50%, rgba(244,241,234,.08), transparent 60%), var(--carbon-1000); }
@property --a { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@keyframes nfn-spin-a { to { --a: 360deg; } }
.nfn-checklist__head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: .6rem; font-size: var(--text-xs); color: var(--bone-400); }
.nfn-checklist ol { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.nfn-checklist li { display: flex; gap: .65rem; align-items: center; font-size: var(--text-sm); color: var(--bone-400); }
.nfn-checklist li i { flex: none; width: 20px; height: 20px; border-radius: 50%; border: 1px solid rgba(244,241,234,.3); display: grid; place-items: center; font-style: normal; }
.nfn-checklist li i .nfn-icon { width: 12px; height: 12px; stroke-width: 2.4; opacity: 0; transform: scale(.5); transition: opacity var(--dur-3) var(--ease-out), transform var(--dur-3) var(--ease-out); }
.nfn-checklist li.is-done { color: var(--bone-100); }
.nfn-checklist li.is-done i { background: var(--bone-100); border-color: var(--bone-100); color: var(--carbon-950); }
.nfn-checklist li.is-done i .nfn-icon { opacity: 1; transform: none; }
.nfn-checklist li.is-done span { text-decoration: line-through; text-decoration-color: rgba(244,241,234,.35); }
.nfn-checklist__burst { position: absolute; right: 1.5rem; top: 50%; width: 44px; height: 44px; margin-top: -22px; display: grid; place-items: center; border-radius: 10px; background: var(--bone-100); color: var(--carbon-950); box-shadow: 0 0 40px 10px rgba(244,241,234,.18); }
.nfn-checklist__burst::before { content: ""; position: absolute; inset: -40px; background: repeating-conic-gradient(from 0deg, rgba(244,241,234,.22) 0 1deg, transparent 1deg 15deg); -webkit-mask: radial-gradient(circle, #000 20%, transparent 70%); mask: radial-gradient(circle, #000 20%, transparent 70%); z-index: -1; animation: nfn-spin calc(30s * var(--motion-scale)) linear infinite; }
.nfn-checklist__burst .nfn-icon { width: 22px; height: 22px; }
@media (max-width: 520px) { .nfn-checklist__burst { display: none; } }

/* Confirmação */
.nfn-done { display: grid; justify-items: center; text-align: center; gap: 1rem; padding: 1.5rem 0; }
.nfn-done__mark { width: 84px; height: 84px; border-radius: 50%; border: 1px solid var(--border-strong); display: grid; place-items: center; }
.nfn-done__mark svg { width: 40px; height: 40px; stroke: var(--text); stroke-width: 1.5; fill: none; stroke-dasharray: 40; stroke-dashoffset: 40; animation: nfn-draw calc(600ms * var(--motion-scale)) var(--ease-out) calc(150ms * var(--motion-scale)) forwards; }
@keyframes nfn-draw { to { stroke-dashoffset: 0; } }
.nfn-ticket { width: min(100%, 420px); border-radius: var(--radius-lg); background: var(--surface-2); border: 1px solid var(--border-subtle); text-align: left; overflow: hidden; }
.nfn-ticket__top { padding: 1.1rem 1.25rem; display: grid; gap: .25rem; }
.nfn-ticket__when { font-family: var(--font-display); font-variation-settings: "wdth" 120; font-weight: 800; text-transform: uppercase; font-size: 1.35rem; line-height: 1.05; }
.nfn-ticket__cut { position: relative; height: 0; border-top: 1px dashed var(--border-strong); margin: 0 14px; }
.nfn-ticket__cut::before, .nfn-ticket__cut::after { content: ""; position: absolute; top: -10px; width: 20px; height: 20px; border-radius: 50%; background: var(--surface-1); }
.nfn-ticket__cut::before { left: -24px; } .nfn-ticket__cut::after { right: -24px; }
.nfn-ticket__bot { padding: 1rem 1.25rem 1.2rem; }

/* ==========================================================================
   Área do cliente — PIN em vidro sobre foto pontilhada (Wafer)
   ========================================================================== */
.nfn-access { position: relative; border-radius: var(--radius-xl); overflow: hidden; min-height: 640px; display: grid; place-items: center; padding: 2rem 1rem; isolation: isolate; }
.nfn-access > .nfn-photo { position: absolute; inset: 0; z-index: -1; }
.nfn-access > .nfn-photo img { filter: grayscale(1) contrast(1.15) brightness(.55); }
.nfn-access__card { width: min(100%, 400px); padding: 2rem 1.5rem 1.5rem; border-radius: var(--radius-xl); background: rgba(13,13,13,.62); border: 1px solid rgba(255,255,255,.12); box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 40px 80px -20px rgba(0,0,0,.8); backdrop-filter: blur(26px) saturate(140%); -webkit-backdrop-filter: blur(26px) saturate(140%); color: var(--bone-100); text-align: center; display: grid; gap: 1.25rem; }
.nfn-access__card .nfn-logo { --logo-h: 40px; justify-self: center; }
.nfn-access__title { margin: 0; font-family: var(--font-serif); font-weight: 400; font-size: 1.6rem; line-height: 1.1; }
.nfn-access__sub { margin: -.6rem 0 0; color: var(--bone-400); font-size: var(--text-sm); }
.nfn-opt { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .9rem; width: 100%; padding: 1rem 1.1rem; border-radius: var(--radius-md); border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.04); color: inherit; text-align: left; cursor: pointer; transition: background-color var(--dur-2) var(--ease-out), border-color var(--dur-2) var(--ease-out), transform var(--dur-1) var(--ease-out); }
.nfn-opt > .nfn-icon:first-child { width: 22px; height: 22px; color: var(--bone-400); }
.nfn-opt b { display: block; font-size: var(--text-2xs); letter-spacing: var(--tracking-label); text-transform: uppercase; font-weight: 600; }
.nfn-opt span { font-size: var(--text-sm); color: var(--bone-400); }
.nfn-opt > .nfn-icon:last-child { width: 18px; height: 18px; color: var(--bone-500); transition: transform var(--dur-3) var(--ease-out); }
@media (hover: hover) { .nfn-opt:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.2); } .nfn-opt:hover > .nfn-icon:last-child { transform: translateX(3px); } }
.nfn-opt:active { transform: scale(.985); }
.nfn-opt:focus-visible { outline: 2px solid var(--bone-100); outline-offset: 2px; }
.nfn-access__card .nfn-pin { --text: var(--bone-100); --text-2: var(--bone-400); --text-3: var(--bone-500); --border: rgba(255,255,255,.12); --surface-2: rgba(255,255,255,.06); --surface-hover: rgba(255,255,255,.14); }
.nfn-access__view[hidden] { display: none; }
.nfn-access__view { display: grid; gap: 1rem; animation: nfn-fade-up var(--dur-4) var(--ease-out); }

/* Lista "As tuas marcações" */
.nfn-appt { display: grid; grid-template-columns: 64px 1fr auto; gap: 1rem; align-items: center; padding: 1rem 1.1rem; border-radius: var(--radius-lg); background: var(--surface-1); border: 1px solid var(--border-subtle); transition: opacity var(--dur-4) var(--ease-out), border-color var(--dur-2) var(--ease-out); }
.nfn-appt__date { display: grid; justify-items: center; align-content: center; width: 64px; height: 72px; border-radius: var(--radius-md); background: var(--surface-2); line-height: 1; }
.nfn-appt__date small { font-size: .625rem; letter-spacing: .14em; text-transform: uppercase; color: var(--text-3); font-weight: 600; }
.nfn-appt__date strong { font-family: var(--font-display); font-variation-settings: "wdth" 120; font-weight: 800; font-size: 1.6rem; margin: .2rem 0; }
.nfn-appt__title { margin: 0 0 .15rem; font-weight: 600; font-size: var(--text-md); }
.nfn-appt__meta { margin: 0; font-size: var(--text-sm); color: var(--text-2); }
.nfn-appt__meta .nfn-mono { color: var(--text); }
.nfn-appt__side { display: grid; justify-items: end; gap: .5rem; }
.nfn-appt.is-cancelled { opacity: .55; }
.nfn-appt.is-cancelled .nfn-appt__title { text-decoration: line-through; }
.nfn-appt.is-past { background: transparent; }
@media (max-width: 560px) { .nfn-appt { grid-template-columns: 56px 1fr; } .nfn-appt__date { width: 56px; height: 64px; } .nfn-appt__side { grid-column: 1 / -1; grid-auto-flow: column; justify-content: space-between; align-items: center; } }

/* Ligar outro dispositivo */
.nfn-link-code { display: grid; justify-items: center; gap: 1rem; text-align: center; }
.nfn-link-code__digits { display: flex; gap: .4rem; font-family: var(--font-mono); font-size: clamp(1.75rem, 1.2rem + 2vw, 2.5rem); font-weight: 500; letter-spacing: 0; }
.nfn-link-code__digits span { display: grid; place-items: center; width: 1.45em; height: 1.8em; border-radius: var(--radius-sm); background: var(--surface-2); border: 1px solid var(--border-subtle); animation: nfn-fade-up var(--dur-4) var(--ease-out) both; animation-delay: calc(var(--i) * 40ms * var(--motion-scale)); }
.nfn-link-code__digits span:nth-child(3):nth-last-child(4) { margin-right: .5rem; }
.nfn-ring { --p: 1; --size: 56px; position: relative; width: var(--size); height: var(--size); display: grid; place-items: center; }
.nfn-ring svg { position: absolute; inset: 0; transform: rotate(-90deg); }
.nfn-ring circle { fill: none; stroke-width: 3; }
.nfn-ring .nfn-ring__bg { stroke: var(--border); }
.nfn-ring .nfn-ring__fg { stroke: var(--text); stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--p) * 100); transition: stroke-dashoffset var(--dur-5) var(--ease-out); }
.nfn-ring span { font-family: var(--font-mono); font-size: .8rem; font-variant-numeric: tabular-nums; }
.nfn-ring.is-low .nfn-ring__fg { stroke: var(--warning); }

/* ==========================================================================
   Galeria — carrossel líquido (Inspora) · leque · lightbox
   ========================================================================== */
.nfn-liquid { position: relative; height: clamp(420px, 56vw, 620px); overflow: hidden; touch-action: pan-y; user-select: none; cursor: grab; outline: none; border-radius: var(--radius-xl); background: var(--bg); }
.nfn-liquid:active { cursor: grabbing; }
.nfn-liquid:focus-visible { box-shadow: inset 0 0 0 2px var(--focus); }
.nfn-liquid__card { --d: 0; --ad: 0; position: absolute; top: 50%; left: 50%; width: clamp(220px, 30vw, 340px); aspect-ratio: 3 / 4; margin: calc(clamp(220px, 30vw, 340px) * -2 / 3) 0 0 calc(clamp(220px, 30vw, 340px) / -2); border-radius: var(--radius-lg); will-change: transform, filter; transform-style: preserve-3d; }
.nfn-liquid__smear { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; }
.nfn-liquid__smear img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: var(--photo-warm); }
.nfn-liquid__smear::after { /* aresta iridescente fina */ content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; background: linear-gradient(120deg, rgba(244,241,234,.45), rgba(201,160,99,.4), rgba(157,179,196,.35), rgba(244,241,234,.1)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; opacity: calc(var(--ad) * 1.2); }
.nfn-liquid__trail { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; opacity: calc(min(var(--ad), 1) * .9); pointer-events: none; }
.nfn-liquid__trail img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: var(--photo-warm) blur(calc(var(--ad) * 10px)); }
.nfn-liquid__ui { position: absolute; inset: 0; z-index: 2; padding: 1rem 1.1rem; display: grid; grid-template-rows: auto 1fr auto; color: var(--bone-100); opacity: calc(1 - min(var(--ad), 1) * 1.6); background: linear-gradient(180deg, rgba(7,7,6,.7), transparent 32%, transparent 62%, rgba(7,7,6,.75)); border-radius: inherit; pointer-events: none; }
.nfn-liquid__ui header { display: flex; justify-content: space-between; align-items: start; gap: .5rem; }
.nfn-liquid__ui h3 { margin: 0; font-size: var(--text-sm); font-weight: 600; line-height: 1.3; }
.nfn-liquid__ui h3 span { display: block; font-weight: 400; color: var(--bone-400); }
.nfn-liquid__ui footer { font-size: var(--text-xs); color: var(--bone-100); font-family: var(--font-mono); }
.nfn-liquid__hint { position: absolute; left: 50%; bottom: 1rem; transform: translateX(-50%); font-size: var(--text-xs); color: var(--text-3); display: flex; gap: .5rem; align-items: center; white-space: nowrap; }
.nfn-liquid__nav { position: absolute; right: 1rem; bottom: .75rem; display: flex; gap: .35rem; z-index: 3; }
@media (max-width: 640px) { .nfn-liquid__nav { display: none; } }

/* Leque da v1: leque no desktop (cartão cresce no hover), baralho com swipe no telemóvel */
.nfn-fan { --fan-scale: 1; position: relative; max-width: 1180px; height: clamp(280px, 42vw, 490px); margin: 0 auto; touch-action: pan-y; user-select: none; }
.nfn-fan__card { position: absolute; top: 46%; left: 50%; width: clamp(130px, 18vw, 228px); aspect-ratio: 3 / 4.3; margin: 0; transform-origin: 50% 145%; transform: translate(-50%, -50%) translate(calc(var(--x) * var(--fan-scale)), calc(var(--y) * var(--fan-scale))) rotate(calc(var(--r) * var(--fan-scale))); z-index: var(--z); transition: transform var(--dur-5) var(--ease-out); }
.nfn-fan__inner { width: 100%; height: 100%; overflow: hidden; background: var(--surface-1); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: 0 20px 40px -18px rgba(0,0,0,.65); cursor: pointer; transition: transform var(--dur-5) var(--ease-out), box-shadow var(--dur-4) var(--ease-out); }
.nfn-fan__inner img { width: 100%; height: 100%; object-fit: cover; display: block; filter: var(--photo-filter); transition: filter var(--dur-5) var(--ease-out); -webkit-user-drag: none; user-select: none; touch-action: pan-y; }
.nfn-fan__card:hover, .nfn-fan__card:focus-within { z-index: 20; }
.nfn-fan__card:hover .nfn-fan__inner, .nfn-fan__card:focus-within .nfn-fan__inner { transform: scale(1.18); }
/* no hover a foto ganha a cor natural; no telemóvel, a do topo do baralho */
.nfn-fan__card:hover .nfn-fan__inner img, .nfn-fan__card:focus-within .nfn-fan__inner img { filter: none; }
@media (max-width: 700px) { .nfn-fan__card[data-order="0"] .nfn-fan__inner img { filter: none; } }
@media (hover: hover) and (pointer: fine) { .nfn-fan:has(.nfn-fan__card:hover) .nfn-fan__card:not(:hover) { transform: translate(-50%, -50%) translate(calc(var(--x) * var(--fan-scale) * 1.16), calc(var(--y) * var(--fan-scale) * 1.1)) rotate(calc(var(--r) * var(--fan-scale) * 1.06)); } }
@media (max-width: 1180px) { .nfn-fan { --fan-scale: .78; } }
@media (max-width: 950px) { .nfn-fan { --fan-scale: .6; } }
.nfn-fan__hint { display: none; }
@media (max-width: 700px) {
  .nfn-fan { max-width: 340px; height: clamp(300px, 92vw, 400px); }
  .nfn-fan__card { width: clamp(200px, 62vw, 270px); top: 50%; transform-origin: center; transform: translate(-50%, -50%) translateY(calc(var(--order, 0) * 10px)) scale(calc(1 - var(--order, 0) * .045)) rotate(calc(var(--tilt, 0deg) * min(var(--order, 0), 1))); opacity: calc(1 - var(--order, 0) * .24); z-index: calc(6 - var(--order, 0)); transition: transform var(--dur-5) var(--ease-out), opacity var(--dur-5) var(--ease-out); }
  .nfn-fan__card:not([data-order="0"]) { pointer-events: none; }
  .nfn-fan__card:hover .nfn-fan__inner, .nfn-fan__card:focus-within .nfn-fan__inner { transform: none; }
  .nfn-fan__hint { display: block; margin: 0 0 1.2rem; text-align: center; font-size: var(--text-2xs); font-weight: 600; letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--text-3); }
}

.nfn-lightbox .nfn-modal__card { --w: 980px; padding: 0; background: var(--carbon-1000); border-color: rgba(255,255,255,.08); display: grid; grid-template-columns: minmax(0, 1fr) 300px; overflow: hidden; }
.nfn-lightbox__img { position: relative; background: #000; min-height: 60vh; max-height: 84vh; display: grid; place-items: center; }
.nfn-lightbox__img img { max-width: 100%; max-height: 84vh; object-fit: contain; }
.nfn-lightbox__img img.is-swap { animation: nfn-fade-up var(--dur-4) var(--ease-out); }
.nfn-lightbox__side { padding: 2rem 1.5rem 1.5rem; display: grid; align-content: space-between; gap: 1.5rem; color: var(--bone-100); }
.nfn-lightbox__nav { display: flex; gap: .5rem; align-items: center; }
@media (max-width: 760px) { .nfn-lightbox .nfn-modal__card { grid-template-columns: 1fr; } .nfn-lightbox__img { min-height: 0; max-height: 62vh; } .nfn-lightbox__img img { max-height: 62vh; } }

/* ==========================================================================
   Sobre · números · testemunhos
   ========================================================================== */
.nfn-about { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: start; }
.nfn-about__media { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.nfn-about__media .nfn-photo { border-radius: var(--radius-lg); aspect-ratio: 3 / 4; }
.nfn-about__media .nfn-photo:nth-child(2) { margin-top: 3rem; }
.nfn-about__since { position: absolute; left: 50%; bottom: -1.25rem; transform: translateX(-50%); padding: .55rem 1.1rem; border-radius: var(--radius-pill); background: var(--bg); border: 1px solid var(--border); font-family: var(--font-serif); font-style: italic; white-space: nowrap; }
.nfn-about__since b { font-style: normal; font-family: var(--font-display); font-variation-settings: "wdth" 120; color: var(--ornament); font-weight: 800; margin-left: .3rem; }
@media (max-width: 860px) { .nfn-about { grid-template-columns: 1fr; } }
.nfn-numbers { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--border); }
.nfn-number { padding: 1.5rem 1.25rem 1.5rem 0; display: grid; gap: .35rem; }
.nfn-number + .nfn-number { padding-left: 1.25rem; border-left: 1px solid var(--border); }
.nfn-number strong { font-family: var(--font-display); font-variation-settings: "wdth" 125; font-weight: 800; font-size: clamp(2.25rem, 1.5rem + 2.6vw, 3.75rem); line-height: 1; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.nfn-number span { font-size: var(--text-sm); color: var(--text-2); }
@media (max-width: 640px) { .nfn-numbers { grid-template-columns: 1fr 1fr; } .nfn-number:nth-child(3) { padding-left: 0; border-left: 0; } .nfn-number:nth-child(n+3) { border-top: 1px solid var(--border); } }
.nfn-quote { display: grid; gap: 1.25rem; align-content: space-between; padding: 1.5rem; border-radius: var(--radius-lg); background: var(--surface-1); border: 1px solid var(--border-subtle); min-width: 0; }
.nfn-quote blockquote { margin: 0; font-family: var(--font-serif); font-size: 1.2rem; line-height: 1.45; font-weight: 400; text-wrap: pretty; }
.nfn-quote blockquote::before { content: "“"; display: block; font-size: 3rem; line-height: .6; color: var(--ornament); margin-bottom: .5rem; }
.nfn-quote figcaption { display: flex; align-items: center; gap: .75rem; font-size: var(--text-sm); }
.nfn-quote figcaption b { display: block; font-weight: 600; }
.nfn-quote figcaption span { color: var(--text-3); }
.nfn-stars { display: inline-flex; gap: 2px; color: var(--text); }
.nfn-stars .nfn-icon { width: 14px; height: 14px; fill: currentColor; stroke: none; }
.nfn-stars .is-off { opacity: .25; }

/* ==========================================================================
   Painel do Fábio (anexos 2 e 3)
   ========================================================================== */
.nfn-admin { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; padding: 14px; border-radius: var(--radius-xl); background: var(--bg-sunken); min-height: 760px; }
.nfn-side { width: 260px; display: grid; grid-template-rows: auto 1fr auto; gap: 1rem; padding: 1.25rem .9rem; border-radius: var(--radius-lg); background: var(--surface-1); border: 1px solid var(--border-subtle); transition: width var(--dur-5) var(--ease-out), padding var(--dur-5) var(--ease-out); overflow: hidden; }
.nfn-side__top { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: 0 .35rem; min-height: 40px; }
.nfn-side__top .nfn-logo { --logo-h: 34px; transition: opacity var(--dur-3) var(--ease-out); }
.nfn-side__nav { display: grid; align-content: start; gap: 2px; }
.nfn-side__item { position: relative; display: flex; align-items: center; gap: .85rem; min-height: 46px; padding: 0 .85rem; border-radius: var(--radius-pill); border: 0; background: transparent; color: var(--text-2); font-size: var(--text-sm); text-decoration: none; cursor: pointer; white-space: nowrap; transition: background-color var(--dur-2) var(--ease-out), color var(--dur-2) var(--ease-out); }
.nfn-side__item .nfn-icon { width: 20px; height: 20px; flex: none; }
@media (hover: hover) { .nfn-side__item:hover:not([aria-current="page"]) { background: var(--surface-hover); color: var(--text); } }
.nfn-side__item[aria-current="page"] { background: var(--selected); color: var(--selected-text); }
.nfn-side__item .nfn-count { margin-left: auto; }
.nfn-side__item[aria-current="page"] .nfn-count { background: var(--selected-text); color: var(--selected); }
.nfn-side__item .nfn-side__dot { position: absolute; left: 1.65rem; top: .7rem; width: 7px; height: 7px; border-radius: 50%; background: var(--coral-500); box-shadow: 0 0 0 2px var(--surface-1); }
.nfn-side__label { transition: opacity var(--dur-3) var(--ease-out); }
.nfn-side__sub { display: grid; gap: 2px; margin: 2px 0 6px 1.7rem; padding-left: .9rem; border-left: 1px solid var(--border); }
.nfn-side__sub .nfn-side__item { min-height: 40px; }
.nfn-side__sub .nfn-side__item[aria-current="true"] { background: var(--surface-3); color: var(--text); }
.nfn-side__me { display: flex; align-items: center; gap: .75rem; padding: .6rem; border-radius: var(--radius-md); background: var(--surface-2); white-space: nowrap; overflow: hidden; }
.nfn-side__me b { display: block; font-size: var(--text-sm); }
.nfn-side__me span { font-size: var(--text-xs); color: var(--text-3); }
.nfn-side.is-collapsed { width: 76px; padding-inline: .7rem; }
.nfn-side.is-collapsed .nfn-side__label, .nfn-side.is-collapsed .nfn-side__top .nfn-logo, .nfn-side.is-collapsed .nfn-count, .nfn-side.is-collapsed .nfn-side__sub, .nfn-side.is-collapsed .nfn-side__me > div { opacity: 0; pointer-events: none; }
.nfn-side.is-collapsed .nfn-side__sub { display: none; }
.nfn-side.is-collapsed .nfn-side__top { justify-content: center; }
.nfn-side.is-collapsed .nfn-side__top .nfn-logo { display: none; }
.nfn-side.is-collapsed .nfn-side__item { padding: 0; justify-content: center; }
.nfn-side.is-collapsed .nfn-side__item .nfn-side__dot { left: 50%; margin-left: 4px; top: .65rem; }
.nfn-side.is-collapsed .nfn-side__me { padding: .35rem; justify-content: center; background: transparent; }
.nfn-dash { display: grid; gap: 14px; align-content: start; min-width: 0; }
.nfn-dash__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; padding: .5rem .5rem 0; }
.nfn-dash__head h2 { margin: 0; font-family: var(--font-serif); font-weight: 400; font-size: var(--text-h1); line-height: 1.1; }
.nfn-dash__head p { margin: .2rem 0 0; color: var(--text-3); font-size: var(--text-sm); }
.nfn-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.nfn-kpi { display: grid; gap: .6rem; padding: 1.15rem 1.25rem; border-radius: var(--radius-lg); background: var(--surface-1); border: 1px solid var(--border-subtle); min-width: 0; }
.nfn-kpi__label { font-size: var(--text-sm); color: var(--text-2); display: flex; justify-content: space-between; gap: .5rem; align-items: center; }
.nfn-kpi__val { font-family: var(--font-display); font-variation-settings: "wdth" 115; font-weight: 700; font-size: clamp(1.75rem, 1.4rem + 1vw, 2.4rem); line-height: 1; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.nfn-kpi__meta { display: grid; grid-template-columns: 1fr auto; font-size: var(--text-xs); color: var(--text-3); gap: .15rem .5rem; }
.nfn-kpi__meta b { color: var(--text-2); font-weight: 500; font-variant-numeric: tabular-nums; }
.nfn-kpi--ring { grid-template-columns: 1fr auto; align-items: center; }
.nfn-kpi--ring .nfn-ring { --size: 60px; }
.nfn-kpi--ring .nfn-ring circle { stroke-width: 3.5; }
.nfn-kpi--accent { background: var(--surface-inverse); color: var(--text-inverse); border-color: transparent; }
.nfn-kpi--accent .nfn-kpi__label, .nfn-kpi--accent .nfn-kpi__meta, .nfn-kpi--accent .nfn-kpi__meta b { color: color-mix(in oklab, var(--text-inverse) 70%, transparent); }
.nfn-bar { height: 8px; border-radius: 8px; background: var(--surface-3); overflow: hidden; }
.nfn-bar span { display: block; height: 100%; width: var(--v, 0%); border-radius: inherit; background: currentColor; transition: width var(--dur-6) var(--ease-out); }
@media (max-width: 1100px) { .nfn-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .nfn-admin { grid-template-columns: 1fr; padding: 8px; } .nfn-side { display: none; } .nfn-kpis { grid-template-columns: 1fr 1fr; gap: 8px; } }

.nfn-day-panel { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 14px; }
@media (max-width: 1100px) { .nfn-day-panel { grid-template-columns: 1fr; } }
.nfn-timeline { border-radius: var(--radius-lg); background: var(--surface-1); border: 1px solid var(--border-subtle); padding: .5rem 1.25rem 1rem; min-width: 0; }
.nfn-timeline__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .75rem; padding: .75rem 0 1rem; border-bottom: 1px solid var(--border-subtle); }
.nfn-tl-row { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 1rem; min-height: 64px; border-bottom: 1px solid var(--border-subtle); position: relative; }
.nfn-tl-row:last-child { border-bottom: 0; }
.nfn-tl-row__time { padding-top: .9rem; font-family: var(--font-mono); font-size: var(--text-xs); color: var(--text-3); }
.nfn-tl-row__slot { padding: .5rem 0; display: grid; gap: .5rem; align-content: center; }
.nfn-tl-row.is-now::before { content: ""; position: absolute; left: 50px; right: 0; top: var(--now, 40%); height: 1px; background: var(--coral-500); z-index: 2; }
.nfn-tl-row.is-now::after { content: ""; position: absolute; left: 46px; top: calc(var(--now, 40%) - 4px); width: 9px; height: 9px; border-radius: 50%; background: var(--coral-500); z-index: 2; }
.nfn-tl-free { height: 44px; border-radius: var(--radius-sm); border: 1px dashed var(--border); display: flex; align-items: center; justify-content: space-between; padding: 0 .4rem 0 .85rem; color: var(--text-3); font-size: var(--text-xs); transition: border-color var(--dur-2) var(--ease-out); }
@media (hover: hover) { .nfn-tl-free:hover { border-color: var(--border-strong); } }
.nfn-tl-block { height: 44px; border-radius: var(--radius-sm); display: flex; align-items: center; gap: .5rem; padding: 0 .85rem; font-size: var(--text-xs); color: var(--text-3); background: repeating-linear-gradient(135deg, transparent 0 6px, var(--border-subtle) 6px 7px); border: 1px solid var(--border-subtle); }
.nfn-tl-block .nfn-icon { width: 15px; height: 15px; }
.nfn-booking { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .85rem; align-items: center; padding: .7rem .75rem .7rem .7rem; border-radius: var(--radius-md); background: var(--surface-2); border: 1px solid var(--border-subtle); border-left: 3px solid var(--text); transition: opacity var(--dur-4) var(--ease-out), background-color var(--dur-2) var(--ease-out); animation: nfn-fade-up var(--dur-4) var(--ease-out); }
.nfn-booking__who { min-width: 0; }
.nfn-booking__who b { display: block; font-size: var(--text-sm); font-weight: 600; overflow-wrap: anywhere; }
.nfn-booking__who span { display: block; font-size: var(--text-xs); color: var(--text-3); }
.nfn-booking__who .nfn-mono { color: var(--text-2); }
.nfn-booking__end { display: flex; align-items: center; gap: .35rem; }
.nfn-booking.is-done { border-left-color: var(--text-3); opacity: .6; }
.nfn-booking.is-walkin { border-left-color: var(--info); }
.nfn-booking.is-cancelled { border-left-color: var(--danger); opacity: .5; }
.nfn-booking.is-cancelled b { text-decoration: line-through; }
@media (max-width: 560px) { .nfn-booking { grid-template-columns: minmax(0, 1fr) auto; } .nfn-booking > .nfn-avatar { display: none; } .nfn-booking__end .nfn-badge { display: none; } }
.nfn-panel-card { border-radius: var(--radius-lg); background: var(--surface-1); border: 1px solid var(--border-subtle); padding: 1.15rem 1.25rem; display: grid; gap: .9rem; align-content: start; }
.nfn-panel-card h3 { margin: 0; font-size: var(--text-md); font-weight: 600; display: flex; justify-content: space-between; gap: .5rem; align-items: center; }

/* ==========================================================================
   Rodapé
   ========================================================================== */
.nfn-footer { position: relative; overflow: hidden; padding: var(--section-y) var(--gutter) 1.5rem; background: var(--carbon-1000); color: var(--bone-100); border-radius: var(--radius-xl) var(--radius-xl) 0 0; }
.nfn-footer__grid { display: grid; grid-template-columns: 1.4fr repeat(3, minmax(0, 1fr)); gap: 2rem; }
.nfn-footer h4 { margin: 0 0 1rem; font-size: var(--text-2xs); letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--bone-500); font-weight: 600; }
.nfn-footer p, .nfn-footer address, .nfn-footer li { margin: 0; font-size: var(--text-sm); color: var(--bone-400); font-style: normal; line-height: 1.7; }
.nfn-footer ul { list-style: none; margin: 0; padding: 0; }
.nfn-footer a { color: var(--bone-100); text-decoration: none; }
@media (hover: hover) { .nfn-footer a:hover { text-decoration: underline; text-underline-offset: .25em; } }
.nfn-footer__big { margin-top: clamp(3rem, 8vw, 6rem); font-family: var(--font-display); font-variation-settings: "wdth" 125; font-weight: 800; text-transform: uppercase; font-size: clamp(3rem, 15.5vw, 15rem); line-height: .8; letter-spacing: -0.045em; color: transparent; -webkit-text-stroke: 1px rgba(244,241,234,.22); white-space: nowrap; text-align: center; user-select: none; }
.nfn-footer__base { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid rgba(244,241,234,.1); font-size: var(--text-xs); color: var(--bone-500); letter-spacing: .06em; }
.nfn-socials { display: flex; gap: .5rem; }
@media (max-width: 860px) { .nfn-footer__grid { grid-template-columns: 1fr 1fr; } .nfn-footer__grid > :first-child { grid-column: 1 / -1; } }
