/* Fovea — Augenlaser in Hamburg (fictional eye-laser practice, demo by FIB Consulting).
   The high-tech look Filip asked for (1. 11. 2026) and approved from the prototype: a dark page, the name across the
   full width, in front of it the eye as a sphere of particles with a glass cornea (reference #8: a particle sphere
   behind the headline), cyan and violet accents, liquid-glass panels, small monospaced labels. Space Grotesk (text,
   headings) and JetBrains Mono (labels), both SIL OFL, served by the site itself. No serif, no italics in headings.
   Dark on every device (no theme switching). */
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:300 700;font-display:swap;src:url(fonts/space-grotesk-latin-wght-normal.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:100 800;font-display:swap;src:url(fonts/jetbrains-mono-latin-wght-normal.woff2) format("woff2")}

:root{
  --bg:#070A12;--bg-2:#0B1020;--bg-3:#101828;--ink:#F2F6FA;--mist:rgba(242,246,250,.74);--soft:rgba(242,246,250,.56);--line:rgba(242,246,250,.14);--line-2:rgba(242,246,250,.3);
  --cyan:#7DE3FF;--cyan-ink:#06111A;--violet:#C9A7FF;
  --glass:linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.03) 55%,rgba(255,255,255,.06));
  --sans:"Space Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --m:max(22px,4vw);--maxw:1560px;--ease:cubic-bezier(.2,.7,.2,1);
  --kit-bar-bg:#02040A;--kit-bar-fg:#B9C3D1;--kit-focus:#7DE3FF;--kit-accent:#7DE3FF;--kit-font:var(--sans);--kit-line:var(--line);
  --kit-msg-bg:#101A30;--kit-msg-fg:#F2F6FA;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);-webkit-text-size-adjust:100%;color-scheme:dark}
body{background:var(--bg);color:var(--ink);font:400 17px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-weight:700;line-height:1.02;letter-spacing:-.03em;text-wrap:balance}
p,li{text-wrap:pretty}
::selection{background:var(--cyan);color:var(--cyan-ink)}
:focus-visible{outline:2.5px solid var(--kit-focus);outline-offset:3px}
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--m);padding-right:var(--m)}
.mono{font:500 11.5px/1.45 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.muted{color:var(--soft)}
.link{color:var(--ink);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:.22em}
.link:hover{color:var(--cyan)}
.big{font:700 clamp(24px,2.4vw,34px)/1.05 var(--sans);letter-spacing:-.03em;text-decoration:none}
sup.fn{font:500 .62em var(--mono);line-height:0;margin-left:1px}sup.fn a{text-decoration:none;color:var(--cyan)}
.glass{position:relative;background:var(--glass);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:22px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 0 0 1px rgba(255,255,255,.1)}
.glass>*:not(.kit-sr){position:relative}
.kit-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- buttons: pills ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border:0;border-radius:999px;text-decoration:none;cursor:pointer;
  font:600 15px/1 var(--sans);white-space:nowrap;background:var(--ink);color:var(--cyan-ink);transition:background .2s,color .2s}
.btn:hover{background:var(--cyan)}
.btn-glass{background:var(--glass);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 0 0 1px rgba(255,255,255,.14)}
.btn-glass:hover{background:rgba(255,255,255,.16);color:#fff}
.btn:disabled{opacity:.4;cursor:default}
.btn:disabled:hover{background:var(--ink)}
.acts{display:flex;flex-wrap:wrap;gap:12px}

/* ---------- header ---------- */
.top{position:relative;z-index:50;background:var(--bg)}
.top-bar{display:flex;align-items:center;gap:24px;min-height:74px}
.brand{display:grid;gap:3px;text-decoration:none;line-height:1}
.brand b{font:700 25px/1 var(--sans);letter-spacing:-.04em}
.brand span{color:var(--mist)}
.menu{margin-left:auto;display:flex;align-items:center;gap:26px}
.menu ul{display:flex;gap:24px;list-style:none;font-size:15.5px}
.menu ul a{display:block;padding:8px 0;text-decoration:none;white-space:nowrap}
.menu ul a:hover,.menu ul a[aria-current="page"]:not([href*="#"]){text-decoration:underline;text-underline-offset:.35em;text-decoration-thickness:1.5px}
.menu .btn{min-height:44px;padding:0 20px}
.menu-btn{display:none;margin-left:auto;width:46px;height:46px;border:0;background:transparent;cursor:pointer;position:relative;color:var(--ink)}
.burger,.burger::before,.burger::after{position:absolute;left:12px;width:22px;height:2px;background:currentColor;transition:transform .3s var(--ease),opacity .2s}
.burger{top:22px}.burger::before,.burger::after{content:"";left:0}.burger::before{top:-7px}.burger::after{top:7px}
.menu-btn[aria-expanded="true"] .burger{background:transparent}
.menu-btn[aria-expanded="true"] .burger::before{transform:translateY(7px) rotate(45deg)}
.menu-btn[aria-expanded="true"] .burger::after{transform:translateY(-7px) rotate(-45deg)}
@media(max-width:1060px){
  .menu-btn{display:block}
  .menu{position:absolute;left:0;right:0;top:100%;display:none;flex-direction:column;align-items:stretch;gap:16px;padding:8px var(--m) 24px;background:var(--bg);border-bottom:1px solid var(--line-2)}
  .menu.is-open{display:flex}
  .menu ul{flex-direction:column;gap:0}
  .menu ul a{font:700 30px/1.1 var(--sans);letter-spacing:-.03em;padding:8px 0}
}
.crumb{display:flex;gap:10px;padding-top:18px;color:var(--soft)}
.crumb a{color:var(--soft)}

/* ---------- page head of sub pages ---------- */
.ph{padding-top:clamp(24px,4vw,56px);padding-bottom:clamp(40px,5vw,72px);border-bottom:1px solid var(--line)}
.ph-in{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:28px 48px;align-items:end}
.ph h1{font-size:clamp(48px,8vw,140px);line-height:.9;letter-spacing:-.05em}
.ph .lead{font-size:clamp(17px,1.35vw,20px);line-height:1.5;color:var(--mist);max-width:30em}
.ph .acts{margin-top:22px}
@media(max-width:860px){.ph-in{grid-template-columns:1fr}}

/* ---------- the cover (home): the name across the page, the eye in front of it ---------- */
.cover{position:relative;min-height:max(720px,calc(100svh - 74px - 37px));overflow:hidden;background:var(--bg);isolation:isolate}
.stage{position:absolute;inset:0;z-index:0}
.stage canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block;opacity:0;transition:opacity 1.2s ease}
.cover.is-live .stage canvas{opacity:1}
.word{position:relative;z-index:1;display:block;margin-top:clamp(10px,1.4vw,22px);padding:0 var(--m);font:700 23.5vw/.72 var(--sans);letter-spacing:-.04em;white-space:nowrap;text-transform:uppercase;color:var(--ink);transition:color .6s}
.cover.is-live .word{color:transparent}
.meta{position:relative;z-index:3;display:flex;justify-content:space-between;gap:16px;padding:14px var(--m) 0;color:var(--mist);line-height:1.7}
.eyebox{position:absolute;z-index:0;left:50%;right:4vw;top:110px;bottom:70px;pointer-events:none}
.eyebox img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity 1.2s ease}
.cover.is-live .eyebox img{opacity:0}
.cover-foot{position:absolute;z-index:3;left:var(--m);right:var(--m);bottom:clamp(26px,3vw,44px);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:end}
.cover-foot h1{font:700 clamp(34px,3.8vw,62px)/1 var(--sans);letter-spacing:-.03em;max-width:9em}
.cover-foot .lead{margin-top:16px;max-width:27em;font-size:clamp(16px,1.15vw,18px);line-height:1.5;color:var(--mist)}
.cover-foot .r{display:grid;justify-items:end;gap:14px}
/* the eye reaches down behind the buttons: the glass button gets a dark frosted fill so its text stays readable */
.cover-foot .btn-glass{background:rgba(7,10,18,.78);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.cover-foot .btn-glass:hover{background:rgba(30,36,52,.86)}
.sos{font-size:14px;color:var(--soft);text-align:right;max-width:26em}
.cover .kit-sr{position:absolute}
@media(max-width:760px){
  .cover{min-height:0;display:flex;flex-direction:column;padding-bottom:30px}
  .word{order:1;font-size:27vw}
  .eyebox{order:2;position:relative;left:auto;right:auto;top:auto;bottom:auto;height:92vw;margin:-10vw 0 0}
  .meta{order:3;padding-top:0;margin-top:-6vw}
  .cover-foot{order:4;position:relative;left:auto;right:auto;bottom:auto;margin:22px var(--m) 0;grid-template-columns:minmax(0,1fr)}
  .cover-foot .r{justify-items:start}.sos{text-align:left}
}

/* ---------- the notice (Aushang), the sign on the door ---------- */
.notice{margin-top:clamp(28px,4vw,48px)}
.notice-in{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:20px 40px;padding:26px 28px 30px}
.notice-in h2{font-size:clamp(24px,2.6vw,38px);letter-spacing:-.03em;margin:8px 0 10px}
.notice-in p{color:var(--mist)}
.notice-in ul{display:grid;gap:8px;list-style:none;align-self:center;font-size:15px;color:var(--mist)}
.notice-in ul a{color:var(--ink)}
@media(max-width:860px){.notice-in{grid-template-columns:1fr}}

/* ---------- sections ---------- */
.sec{padding-top:clamp(60px,7vw,110px);padding-bottom:clamp(20px,3vw,40px)}
.sec-h{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px 48px;align-items:end;margin-bottom:clamp(28px,4vw,48px)}
.sec-h h2,h2.xl{font-size:clamp(36px,4.6vw,76px);line-height:.95;letter-spacing:-.035em}
.sec-h p{color:var(--mist);max-width:31em}
.k{display:block;margin-bottom:14px;color:var(--cyan)}
.sec-foot{display:flex;flex-wrap:wrap;gap:12px 28px;margin-top:clamp(24px,3vw,40px)}
@media(max-width:760px){.sec-h{grid-template-columns:1fr;gap:14px}}

/* the laser at work: the viewer and its panel */
.lab{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:18px;align-items:start}
.viewer{position:relative;height:min(74vh,720px);min-height:440px;border-radius:26px;overflow:hidden;
  background:var(--bg-2) radial-gradient(rgba(242,246,250,.11) 1px,transparent 1.3px) 0 0/22px 22px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.viewer canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block;opacity:0;transition:opacity .9s ease}
.viewer.is-live canvas{opacity:1}
.viewer .still{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .9s ease}
.viewer.is-live .still{opacity:0}
.viewer .hint{position:absolute;left:18px;bottom:16px;color:var(--soft);pointer-events:none}
.viewer .scale{position:absolute;right:18px;bottom:18px;display:grid;gap:4px;justify-items:end;color:var(--soft);pointer-events:none}
.viewer .scale i{display:block;width:60px;height:1px;background:var(--mist)}
.viewer .tags{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .6s}
.viewer.is-live .tags{opacity:1}
.tag{position:absolute;transform:translate(0,-50%);padding-left:14px;font:500 11.5px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink);white-space:nowrap}
.tag i{font-style:normal;display:inline-block;padding:3px 8px;border-radius:6px;background:rgba(7,10,18,.72);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.tag::before{content:"";position:absolute;left:0;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 3px rgba(125,227,255,.25)}
.tag.l{transform:translate(-100%,-50%);padding-left:0;padding-right:14px}.tag.l::before{left:auto;right:0}
.panel{padding:22px 24px 26px;display:grid;gap:16px;align-content:start}
.tabs{display:flex;gap:6px;padding:4px;border-radius:999px;background:rgba(255,255,255,.08)}
.tabs button{flex:1;min-height:40px;border:0;border-radius:999px;background:transparent;color:#fff;font:600 14px var(--sans);cursor:pointer}
.tabs button[aria-selected="true"]{background:var(--ink);color:var(--cyan-ink)}
.steps{list-style:none;display:grid;gap:6px}
.steps button{width:100%;text-align:left;display:grid;grid-template-columns:30px minmax(0,1fr);gap:10px;align-items:baseline;padding:10px 12px;border:0;border-radius:14px;background:transparent;color:#fff;font:600 15px var(--sans);cursor:pointer}
.steps button:hover{background:rgba(255,255,255,.08)}
.steps button[aria-current="step"]{background:rgba(125,227,255,.16);box-shadow:inset 0 0 0 1px rgba(125,227,255,.5)}
.steps button>span:first-child{font:500 12px var(--mono);color:var(--cyan)}
.steps small{display:block;font-weight:400;font-size:13px;color:var(--mist);margin-top:2px}
.st p{color:var(--mist);font-size:15.5px}.st p+p{margin-top:8px}
.panel .note{font-size:13.5px;color:var(--soft)}
.replay{justify-self:start;min-height:40px;padding:0 18px;border:0;border-radius:999px;background:rgba(255,255,255,.1);color:#fff;font:600 14px var(--sans);cursor:pointer}
.replay:hover{background:rgba(255,255,255,.18)}
.lab-text{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 28px;margin-top:clamp(28px,4vw,48px)}
.lab-text h3{font-size:22px;margin-bottom:10px}
.lab-text ol{padding-left:20px;display:grid;gap:8px;color:var(--mist);font-size:15.5px}
/* the teaser of the laser page on the home page */
.teaser{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:24px 48px;align-items:center}
.teaser-pic{display:block;position:relative;border-radius:26px;overflow:hidden;background:var(--bg-2) radial-gradient(rgba(242,246,250,.11) 1px,transparent 1.3px) 0 0/22px 22px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.teaser-pic img{width:100%;height:auto;aspect-ratio:1200/900;object-fit:contain}
.teaser-pic span{position:absolute;left:18px;bottom:16px;color:var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.chips a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;text-decoration:none;font:600 14px var(--sans);background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.chips a:hover{background:rgba(125,227,255,.16)}
@media(max-width:1100px){.lab{grid-template-columns:minmax(0,1fr)}.lab-text{grid-template-columns:minmax(0,1fr)}.teaser{grid-template-columns:minmax(0,1fr)}}
@media(max-width:760px){.viewer{margin:0 calc(var(--m) * -1);border-radius:0;height:110vw;min-height:0}.viewer .scale{display:none}}

/* methods */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.card{padding:24px 26px 26px}
.card h3{font-size:24px;line-height:1.1;letter-spacing:-.02em}
.card .sub{color:var(--cyan);margin:6px 0 14px}
.card p{color:var(--mist);font-size:15.5px}.card p+p{margin-top:8px}
.card dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin-top:16px;font-size:14px;border-top:1px solid var(--line);padding-top:14px}
.card dt{color:var(--soft)}.card dd{font-family:var(--mono);font-size:13px;color:var(--ink)}
/* eligibility */
.elig{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,60px);align-items:start}
.tbl{overflow-x:auto}
table.data{width:100%;border-collapse:collapse;font-size:15.5px}
table.data caption{text-align:left;font-size:14px;color:var(--mist);margin-bottom:10px}
table.data th,table.data td{text-align:left;padding:12px 12px 12px 0;border-bottom:1px solid var(--line);vertical-align:baseline}
table.data thead th{font-weight:600;font-size:13.5px;color:var(--mist);border-bottom:1.5px solid var(--ink)}
table.data td.v{font:500 14.5px var(--mono);white-space:nowrap}
.list{list-style:none;display:grid;gap:10px}
.list li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;color:var(--mist);font-size:15.5px}
.list li::before{content:"—";color:var(--cyan)}
/* timeline, risks, two columns, practice */
.tl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.tl>div{padding:20px 22px;border-top:1.5px solid var(--ink)}
.tl b{display:block;font:500 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--cyan);margin-bottom:8px}
.tl h3{font-size:19px;line-height:1.2;margin-bottom:6px}
.tl p{color:var(--mist);font-size:15px}
.risk{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.risk>div{padding:20px 22px}
.risk .n{font:700 clamp(28px,3vw,44px)/1 var(--sans);letter-spacing:-.03em}
.risk .n small{font-size:.45em;letter-spacing:0;color:var(--mist);margin-left:6px}
.risk p{margin-top:8px;color:var(--mist);font-size:14.5px}
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,60px)}
.two p{color:var(--mist)}.two p+p{margin-top:10px}
.two h3{font-size:22px;margin-bottom:10px}
.prax{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.prax>div{padding:22px 24px}
.prax h3{font-size:17px;line-height:1.3;margin-bottom:8px}
.prax p{color:var(--mist);font-size:16px}.prax p+p{margin-top:10px}.prax .tiny{font-size:13.5px;color:var(--soft)}
.prax a{color:var(--ink)}
.kit-hours{font-size:15px;color:var(--mist)}
.kit-hours th{font-weight:400}
.kit-hours tr.is-today th,.kit-hours tr.is-today td{color:var(--ink)}
.status{display:inline-block;margin-top:14px;color:var(--cyan)}
.callout{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px 28px;align-items:center;padding:24px 26px;margin-top:22px}
.callout b{font:700 clamp(30px,3.6vw,54px)/1 var(--sans);letter-spacing:-.04em;color:var(--cyan)}
.callout p{color:var(--mist)}
.ray{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ray figure{padding:20px 22px 22px}
.ray svg{width:100%;height:auto}
.ray figcaption{margin-top:12px;color:var(--mist);font-size:14.5px}
.ray figcaption b{display:block;color:var(--ink);font-size:17px;margin-bottom:4px}
@media(max-width:1100px){.cards,.risk,.prax,.ray{grid-template-columns:repeat(2,minmax(0,1fr))}.tl{grid-template-columns:repeat(2,minmax(0,1fr))}.elig,.two{grid-template-columns:minmax(0,1fr)}}
@media(max-width:760px){.cards,.risk,.prax,.tl,.ray{grid-template-columns:minmax(0,1fr)}.callout{grid-template-columns:1fr}}

/* ---------- booking ---------- */
.book{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:28px 48px;align-items:start}
.reasons{display:grid;border:0;border-top:1.5px solid var(--ink)}
.reason{position:relative;display:block;cursor:pointer}
.reason input{position:absolute;opacity:0;inset:0}
.reason span{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:15px 14px;border-bottom:1px solid var(--line);transition:background .2s}
.reason b{font-weight:700;font-size:18px}.reason small{grid-column:1;color:var(--mist);font-size:14px}
.reason em{grid-row:1/3;grid-column:2;align-self:center;font:500 12px var(--mono);font-style:normal;color:var(--mist)}
.reason:hover span{background:rgba(255,255,255,.06)}
.reason input:checked+span{background:rgba(125,227,255,.14)}
.reason input:checked+span b::before{content:"→ "}
.reason input:focus-visible+span{outline:2.5px solid var(--kit-focus);outline-offset:-3px}
.panel-b{padding:22px;border-radius:22px;background:var(--glass);box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 0 0 1px rgba(255,255,255,.1)}
.cal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.cal-head h3{font-size:18px;letter-spacing:-.01em}
.cal-nav{display:flex;gap:6px}
.cal-nav button{width:42px;height:42px;border:0;border-radius:999px;background:rgba(255,255,255,.1);cursor:pointer;font-size:17px;color:var(--ink)}
.cal-nav button:hover{background:rgba(255,255,255,.2)}
.cal-nav button:disabled{opacity:.35;cursor:default}
.days{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.day h4{font:500 11.5px var(--mono);text-transform:uppercase;letter-spacing:.05em;color:var(--mist);margin-bottom:8px;text-align:center}
.day h4 b{display:block;font:700 16px var(--sans);text-transform:none;letter-spacing:0;color:var(--ink)}
.day ul{list-style:none;display:grid;gap:6px}
.slot{width:100%;min-height:42px;border:0;border-radius:12px;background:rgba(255,255,255,.08);font:500 14px var(--mono);color:var(--ink);cursor:pointer;transition:background .2s,color .2s}
.slot:hover{background:rgba(125,227,255,.2)}
.slot[aria-pressed="true"]{background:var(--ink);color:var(--cyan-ink)}
.day .off{font-size:13px;color:var(--soft);text-align:center;padding:8px 0}
.cal-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.cal-foot p{font-size:14.5px;color:var(--mist)}
.form{display:grid;gap:14px;margin-top:16px}
.field{display:grid;gap:5px}
.field label{font-weight:600;font-size:15px}
.field input{min-height:48px;padding:0 14px;border:1px solid var(--line-2);border-radius:12px;background:rgba(255,255,255,.06);font:400 16px var(--sans);color:var(--ink)}
.field input:focus{outline:2.5px solid var(--kit-focus);outline-offset:1px}
.hint,.form-note{font-size:14px;color:var(--mist)}
.phone-card{margin-top:20px;padding:20px 0;border-top:1.5px solid var(--ink)}
@media(max-width:900px){.book{grid-template-columns:minmax(0,1fr)}.days{grid-template-columns:repeat(5,minmax(112px,1fr));overflow-x:auto;padding-bottom:6px}}

/* holographic appointment ticket (reference #19), cyan and violet on dark */
.ticket-wrap{margin-top:18px;perspective:1100px}
.ticket{--mx:.5;--my:.3;position:relative;display:grid;grid-template-columns:minmax(0,1fr) 124px;max-width:580px;color:var(--ink);transform-style:preserve-3d;border-radius:22px;overflow:hidden;
  transform:rotateX(calc((var(--my) - .5) * -10deg)) rotateY(calc((var(--mx) - .5) * 14deg));transition:transform .15s linear;
  background:linear-gradient(115deg,#111B33,#0B1020 40%,#1A1433);box-shadow:0 30px 60px -30px rgba(0,0,0,.8),inset 0 0 0 1px rgba(255,255,255,.18)}
.ticket::before{content:"";position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;opacity:.45;
  background:linear-gradient(calc(110deg + var(--mx) * 60deg),#7DE3FF 0%,#C9A7FF 25%,#58A6FF 50%,#C9A7FF 75%,#7DE3FF 100%);
  background-size:220% 220%;background-position:calc(var(--mx) * 100%) calc(var(--my) * 100%)}
.ticket::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at calc(var(--mx) * 100%) calc(var(--my) * 100%),rgba(255,255,255,.35),rgba(255,255,255,0) 42%)}
.ticket-main{position:relative;z-index:1;padding:20px 22px;display:grid;gap:10px}
.ticket-main h3{font-size:30px;letter-spacing:-.04em}
.ticket-main dl{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:14.5px}
.ticket-main dt{font:500 11px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--mist);padding-top:3px}
.ticket-bar{height:34px;margin-top:4px;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 4px,var(--ink) 4px 5px,transparent 5px 8px,var(--ink) 8px 11px,transparent 11px 12px);opacity:.85}
.ticket-stub{position:relative;z-index:1;display:grid;place-content:center;gap:8px;text-align:center;padding:16px 10px;border-left:2px dashed rgba(255,255,255,.4);cursor:grab;touch-action:none;transition:transform .6s var(--ease),opacity .6s}
.ticket-stub b{font:700 32px var(--sans);letter-spacing:-.04em}
.ticket-stub small{font:500 10.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mist)}
.ticket-stub button{border:0;border-radius:999px;background:var(--ink);color:var(--cyan-ink);padding:8px 10px;font:600 11px var(--mono);letter-spacing:.04em;text-transform:uppercase;cursor:pointer}
.ticket.is-torn .ticket-stub{transform:translate(40px,30px) rotate(14deg);opacity:0}
.ticket-note{margin-top:12px;font-size:14px;color:var(--mist);max-width:580px}
.link-btn{border:0;background:none;padding:0;font:inherit;color:var(--ink);text-decoration:underline;text-underline-offset:.2em;cursor:pointer}
.ticket-wrap .kit-form-msg{max-width:580px;border-radius:14px}
@media(max-width:560px){.ticket{grid-template-columns:1fr}.ticket-stub{border-left:0;border-top:2px dashed rgba(255,255,255,.4)}}

/* ---------- prose, FAQ, sources, footer, dock ---------- */
.prose{max-width:780px;padding-top:36px;padding-bottom:48px}
.prose h1{font-size:clamp(44px,6vw,84px);line-height:.92;letter-spacing:-.045em;margin-bottom:22px}
.prose h2{font-size:22px;letter-spacing:-.02em;margin:30px 0 8px}
.prose p,.prose li{color:var(--mist)}
.prose ul{padding-left:20px;display:grid;gap:4px}
.prose a{color:var(--ink)}
.faq{max-width:900px;border-top:1.5px solid var(--ink)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{display:flex;justify-content:space-between;gap:20px;cursor:pointer;list-style:none;padding:22px 2px;font-weight:600;font-size:clamp(18px,1.5vw,21px);letter-spacing:-.015em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:400 24px/1 var(--mono);color:var(--mist);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 2px 22px;color:var(--mist);max-width:64ch}
.src{padding-top:56px;padding-bottom:72px}
.src h2{font-size:16px;letter-spacing:-.005em}.src h2 span{font-weight:400;color:var(--mist);margin-left:8px}
.src ol{margin-top:10px;padding-left:22px;display:grid;gap:4px;font-size:14px;color:var(--mist)}
.src a{color:var(--mist)}
.foot{position:relative;background:var(--bg);padding:0 0 calc(28px + env(safe-area-inset-bottom,0px));overflow:hidden;border-top:1px solid var(--line)}
.foot-word{font:700 31vw/.78 var(--sans);letter-spacing:-.05em;text-transform:uppercase;white-space:nowrap;width:max-content;margin-left:-.04em;padding-top:2vw;color:var(--ink)}
.foot-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:32px 48px;margin-top:clamp(28px,4vw,56px);padding-top:24px;border-top:1px solid var(--line-2)}
.foot h2{font:500 11.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mist);margin-bottom:10px}
.foot nav h2+ul+h2{margin-top:18px}
.foot ul{list-style:none;display:grid;gap:4px;font-size:15.5px}
.foot a{color:var(--ink)}
.foot-brand p+p{margin-top:12px;font-size:15.5px;color:var(--mist)}
.foot-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;margin-top:40px;padding-top:16px;border-top:1px solid var(--line);color:var(--mist)}
.foot-base strong{font-weight:500;color:var(--ink)}
@media(max-width:860px){.foot-grid{grid-template-columns:1fr}}
.dock{display:none}
@media(max-width:760px){
  .dock{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:45;gap:0;padding-bottom:env(safe-area-inset-bottom,0px);background:#02040A;border-top:1px solid var(--line)}
  .dock a{flex:1;display:flex;align-items:center;justify-content:center;min-height:54px;text-decoration:none;font:600 14px var(--sans);color:#fff}
  .dock .dock-main{background:var(--ink);color:var(--cyan-ink)}
  .foot{padding-bottom:84px}
}
[hidden]{display:none!important}
@media(prefers-reduced-motion:reduce){.ticket{transform:none}.ticket-stub{transition:none}.stage canvas,.viewer canvas{transition:none}}
