/* Svalbardyacht: Hinlopen-Basis (Schwarz, Off-White, Silber, Cormorant und Jost) plus Galerie-Kapitel:
   Papier-Raeume mit gerahmten Abzuegen und Museumsetikett, Kapitelnummern, Bildraster mit Nummern,
   grosse Statements, Indexliste, Farbe beim Scrollen bei den Tieren, Lightbox in Farbe. */
:root{--bg:#0B0B0B;--bg2:#121212;--ink:#EDEAE4;--mut:#9C9A94;--dim:#5E5D59;--line:rgba(237,234,228,.14);--ease:cubic-bezier(.2,.6,.2,1);--w:1320px;--hh:5.2rem;
 --paper:#F4F2EE;--paper2:#ECE9E3;--paper-ink:#141412;--paper-mut:#6B6963;--paper-dim:#A9A6A0;--paper-line:rgba(20,20,18,.14);
 --curtain-bg:#0B0B0B;--curtain-ink:#EDEAE4;--progress:#EDEAE4;
 --map-sea:rgba(255,255,255,.025);--map-grat:rgba(237,234,228,.18);--map-land:rgba(237,234,228,.09);--map-coast:rgba(237,234,228,.6);--map-route:#EDEAE4;--map-ship:#EDEAE4;--map-ink:#EDEAE4;
 --polar-line:rgba(237,234,228,.28);--polar-coast:rgba(237,234,228,.7);--polar-accent:#EDEAE4;--polar-ink:#EDEAE4;
 --sun-line:rgba(20,20,18,.3);--sun-accent:#141412;--sun-ink:#141412;--sun-ghost:rgba(20,20,18,.1)}
html.gsap [data-reveal]{transition:none}
body{background:var(--bg);color:var(--ink);font:300 1.05rem/1.7 'jost',system-ui,sans-serif}
h1,h2,h3,.serif{font-family:'cormorant',Georgia,serif;font-weight:300;letter-spacing:.005em;margin:0}
h1{font-size:min(clamp(3rem,7.6vw,7.2rem),12.5vh);line-height:.98}
h2{font-size:clamp(2.1rem,4.6vw,4.2rem);line-height:1.02}
h3{font-size:clamp(1.5rem,2.4vw,2.1rem);line-height:1.15;font-weight:400}
p{margin:0}
.wrap{width:min(var(--w),calc(100% - 3rem));margin-inline:auto}
.wrap > *{min-width:0}
.k{font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--mut);font-weight:400}
.k::before{content:"";display:inline-block;width:1.6rem;height:1px;background:var(--mut);vertical-align:middle;margin-right:.8rem}
.k.plain::before{display:none}
.mut{color:var(--mut)}.mono{font-family:'plexmono',ui-monospace,monospace;font-size:.82rem;letter-spacing:.08em}
.tiny{font-size:.74rem;color:var(--dim);line-height:1.5}
.flag{display:inline-block;font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;border:1px solid var(--dim);padding:.25rem .5rem;color:var(--mut);vertical-align:middle;margin-left:.6rem}
.btn{display:inline-flex;align-items:center;gap:.9rem;padding:1rem 1.6rem;border:1px solid var(--ink);color:var(--ink);text-decoration:none;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;transition:background .3s,color .3s;background:transparent;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--ink);color:var(--bg)}
.btn.solid{background:var(--ink);color:var(--bg)}.btn.solid:hover{background:transparent;color:var(--ink)}
.lnk{font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--dim);padding-bottom:.3rem;transition:border-color .3s;color:inherit}.lnk:hover{border-color:currentColor}

/* Papier-Raeume: Variablen kippen, alles darunter folgt */
.paper{background:var(--paper);color:var(--paper-ink);--ink:var(--paper-ink);--mut:var(--paper-mut);--dim:var(--paper-dim);--line:var(--paper-line);--bg:var(--paper);--bg2:var(--paper2)}
.paper .btn{border-color:var(--paper-ink);color:var(--paper-ink)}.paper .btn:hover{background:var(--paper-ink);color:var(--paper)}
.paper .btn.solid{background:var(--paper-ink);color:var(--paper)}.paper .btn.solid:hover{background:transparent;color:var(--paper-ink)}
.paper .credit{color:#111;text-shadow:0 0 6px rgba(255,255,255,.7)}
.paper2{background:var(--paper2)}

/* Header */
.hd{position:fixed;inset:0 0 auto;z-index:50;padding:calc(1.1rem + env(safe-area-inset-top)) 0 1.1rem;transition:background .5s,padding .5s,color .5s}
.hd.scrolled{background:rgba(11,11,11,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding-block:calc(.7rem + env(safe-area-inset-top)) .7rem}
.hd .wrap{display:flex;align-items:center;justify-content:space-between;gap:2rem}
.brand{display:inline-flex;flex-direction:column;text-decoration:none;color:var(--ink);white-space:nowrap}
.brand .wm{font:400 1.25rem/1 'cormorant',serif;letter-spacing:.4em;text-transform:uppercase}
.brand .wm b{font-weight:500}
.brand small{font:300 .56rem/1 'jost',sans-serif;letter-spacing:.3em;text-transform:uppercase;color:var(--mut);margin-top:.45rem}
.nav{display:flex;gap:1.9rem;align-items:center;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase}
.nav a{text-decoration:none;color:var(--ink);opacity:.82;transition:opacity .3s;white-space:nowrap}.nav a:hover{opacity:1}
.nav .btn{padding:.7rem 1.1rem;color:var(--ink);font-size:.66rem;opacity:1}
.mbtn{display:none;background:none;border:1px solid var(--line);color:var(--ink);font:400 .7rem/1 'jost',sans-serif;letter-spacing:.2em;text-transform:uppercase;padding:.7rem 1rem;cursor:pointer}
@media (max-width:1200px){.nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:flex-start;gap:0;background:#0B0B0B;padding:.5rem 1.5rem 1.5rem;border-bottom:1px solid var(--line)}.nav.open{display:flex}.nav a{padding:.8rem 0;font-size:.8rem}.nav .btn{margin-top:.6rem}.mbtn{display:inline-block}.hd{background:rgba(11,11,11,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}}

/* Hero (Video, gescrubbt) */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;isolation:isolate;padding-top:calc(var(--hh) + env(safe-area-inset-top));overflow:hidden}
.hero__media{position:absolute;inset:0;z-index:-1;will-change:transform}
.hero__media .fig,.hero__media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;margin:0}
.hero video{filter:grayscale(1) contrast(1.05) brightness(.9)}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,rgba(11,11,11,.7) 0%,rgba(11,11,11,0) 34%),linear-gradient(to top,rgba(11,11,11,.94) 0%,rgba(11,11,11,.38) 45%,rgba(11,11,11,.1) 100%)}
.hero .k{color:var(--ink);opacity:.85}.hero .k::before{background:var(--ink)}
.hero__copy{padding-block:2rem clamp(3.5rem,9vh,6rem);display:grid;grid-template-columns:1fr auto;align-items:end;gap:2rem}
.hero h1{max-width:12ch;margin-top:1.2rem;overflow:hidden}
.hero .sub{max-width:44ch;margin-top:1.4rem;color:var(--mut);font-size:1.02rem}
.hero .cta{display:flex;gap:1.8rem;align-items:center;margin-top:2rem;flex-wrap:wrap}
.coord{font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--mut);text-align:right;line-height:2}
.hero .credit{bottom:auto;top:calc(var(--hh) + 1rem + env(safe-area-inset-top))}
.hero__scroll{position:absolute;left:50%;bottom:1.4rem;width:1px;height:2.6rem;background:var(--line);overflow:hidden}
.hero__scroll span{position:absolute;inset:0;background:var(--ink);transform-origin:top;animation:scrollcue 2.2s var(--ease) infinite}
@keyframes scrollcue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@media (max-width:900px){.hero__copy{grid-template-columns:1fr}.coord{text-align:left}.hero h1{font-size:clamp(2.6rem,12.5vw,4.2rem)}.hero__scroll{display:none}}
@media (prefers-reduced-motion:reduce){.hero__scroll span{animation:none;transform:none}}

/* Endorsement */
.endorse{border-block:1px solid var(--line);padding:1.6rem 0;position:relative;z-index:2;background:var(--bg)}
.endorse .wrap{display:flex;align-items:center;gap:2.4rem;flex-wrap:wrap}
.endorse img{height:34px;width:auto}
.endorse .t{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
.endorse .facts{margin-left:auto;display:flex;gap:2.4rem;font-size:.78rem;letter-spacing:.06em;color:var(--mut);flex-wrap:wrap}
.endorse .facts b{color:var(--ink);font-weight:400}
@media (max-width:900px){.endorse .facts{margin-left:0}}

section{padding:clamp(5rem,11vw,9.5rem) 0}
.head{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:end;margin-bottom:clamp(2.5rem,6vw,4.5rem)}
.head h2,.wild__head h2{margin-top:1.4rem}
.head p{color:var(--mut);max-width:48ch}
@media (max-width:900px){.head{grid-template-columns:1fr}}

/* Kapitelkopf: grosse Konturziffer, Titel, Kapitelzeile rechts (Magazinprinzip) */
.ch{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:1.6rem 2.4rem;padding-bottom:1.4rem;border-bottom:1px solid var(--line);margin-bottom:clamp(2.5rem,6vw,4.5rem)}
.ch__n{font:300 clamp(4.2rem,9vw,8.4rem)/0.82 'cormorant',serif;color:transparent;-webkit-text-stroke:1px var(--mut);letter-spacing:-.02em}
.ch__t{font:300 clamp(2rem,4.2vw,3.8rem)/1 'cormorant',serif;margin:0}
.ch__k{font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--mut);text-align:right;line-height:1.8;padding-bottom:.35rem}
@media (max-width:900px){.ch{grid-template-columns:auto 1fr}.ch__k{grid-column:1/-1;text-align:left}}

/* Statements (Papier, zentriert) */
.statement{text-align:center;padding:clamp(4rem,9vw,7rem) 0}
.statement .rule{display:block;width:2.4rem;height:1px;background:var(--mut);margin:0 auto 1.8rem}
.statement p{font:300 clamp(1.7rem,3.2vw,2.8rem)/1.25 'cormorant',serif;max-width:26ch;margin:0 auto}
.statement .src{font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:var(--mut);margin-top:1.6rem}

/* Gerahmte Abzuege mit Etikett (aus dem White Room) */
.exhibit{margin:0;display:grid;gap:0;align-content:start}
.frame{border:1px solid var(--ink);padding:14px;background:var(--bg)}
.frame .fig{aspect-ratio:3/2;background:var(--bg2)}
.frame .fig img{width:100%;height:100%;object-fit:cover;display:block}
.frame.tall .fig{aspect-ratio:4/5}.frame.wide .fig{aspect-ratio:16/9}.frame.sq .fig{aspect-ratio:1}
.label{display:grid;gap:.12rem;padding-top:.85rem;font-size:.78rem;line-height:1.5;color:var(--mut);max-width:48ch}
.label b{font-weight:500;color:var(--ink)}
.label .p{font-size:.64rem;letter-spacing:.06em}
.label .no{font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--mut);margin-bottom:.3rem}
.label--right{text-align:right;justify-self:end}
[data-gallery] .fig{cursor:zoom-in}

/* Bildraster mit Nummern */
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.2rem 1.6rem}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2.2rem 1.6rem}
.grid3 .fig,.grid2 .fig{aspect-ratio:3/2}
.grid3 .tall .fig,.grid2 .tall .fig{aspect-ratio:4/5}
.cap{display:flex;justify-content:space-between;gap:1rem;padding-top:.7rem;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mut)}
.cap b{font-weight:400;color:var(--ink)}
@media (max-width:900px){.grid3{grid-template-columns:1fr 1fr;gap:1.6rem 1rem}.grid2{grid-template-columns:1fr}}
@media (max-width:560px){.grid3{grid-template-columns:1fr}}

/* Vollbreites Bild mit Unterschrift */
.bleed{padding:0}
.bleed .fig{aspect-ratio:21/9;max-height:88svh}
.bleed .fig img{width:100%;height:100%;object-fit:cover}
.bleed .cap{padding:1rem 0}
@media (max-width:900px){.bleed .fig{aspect-ratio:4/3}}

/* Premise: Statement plus Zahlen plus zwei Rahmen */
.premise{display:grid;grid-template-columns:1.1fr .9fr;gap:5rem;align-items:start}
.premise .wall{font:300 clamp(1.35rem,1.9vw,1.8rem)/1.4 'cormorant',serif;max-width:34rem;width:100%}
.premise .wall + .wall{margin-top:1.2rem}
.nums{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:3rem;border-top:1px solid var(--line);padding-top:1.6rem}
.num b{display:block;font:300 clamp(2.6rem,5vw,4.6rem)/1 'cormorant',serif}
.num > span{display:block;color:var(--mut);font-size:.88rem;margin-top:.7rem;max-width:26ch}
.num .src{display:block;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-top:.5rem}
.premise__pics{display:grid;gap:2rem}
.premise__pics .exhibit:nth-child(2){width:72%;justify-self:end}
@media (max-width:900px){.premise{grid-template-columns:1fr;gap:3rem}.nums{grid-template-columns:1fr}}

/* Flotte: drei Yachten als Exponate */
.fleet__intro{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-bottom:3.5rem}
.fleet__intro p{color:var(--mut);max-width:52ch}
.yex{display:grid;grid-template-columns:7fr 5fr;gap:3.5rem;align-items:end;padding:3.5rem 0;border-top:1px solid var(--line)}
.yex:nth-child(even){grid-template-columns:5fr 7fr}
.yex:nth-child(even) .exhibit{order:2}
.yex .n{font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--mut)}
.yex h3{font-size:clamp(2.2rem,4vw,3.6rem);font-weight:300;letter-spacing:.06em;text-transform:uppercase;margin-top:.8rem}
.yex .line{color:var(--mut);margin-top:.6rem;font-size:.98rem;max-width:44ch}
.specs{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem 1.4rem;margin-top:1.8rem;padding-top:1.2rem;border-top:1px solid var(--line)}
.specs div b{display:block;font:300 1.5rem/1.1 'cormorant',serif;color:var(--ink)}
.specs div span{display:block;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);margin-top:.3rem}
.yex .lnk{display:inline-block;margin-top:1.8rem}
@media (max-width:900px){.yex,.yex:nth-child(even){grid-template-columns:1fr;gap:1.6rem}.yex:nth-child(even) .exhibit{order:0}.specs{grid-template-columns:1fr 1fr}}

/* Drei Wege als Exponate */
.tiers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3rem;max-width:60rem}
.tier{position:relative;display:flex;flex-direction:column;gap:1rem}
.tier .rn{font:300 2.2rem/1 'cormorant',serif;color:var(--dim)}
.tier h3{margin-top:.4rem}
.tier .meta{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mut)}
.tier p{color:var(--mut);font-size:.96rem}
.tier .price{margin-top:auto;padding-top:1rem;border-top:1px solid var(--line);font-size:.78rem;letter-spacing:.1em;color:var(--mut)}
@media (max-width:900px){.tiers{grid-template-columns:1fr;gap:3rem}}

/* Route mit Karte */
.route{background:var(--bg2)}
.route__grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start}
.route__map{align-self:stretch}
.route__sticky{position:sticky;top:calc(var(--hh) + 1rem)}
.route .map svg{max-height:calc(100svh - var(--hh) - 10rem);margin:0 auto}
.route .map{margin-top:1.4rem;border:1px solid var(--line)}
.route__pos{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.9rem 0;border-bottom:1px solid var(--line);margin-bottom:.8rem}
.route__days h2{margin-bottom:1rem}
.route__days .mut{margin-bottom:2.5rem}
.day{display:grid;grid-template-columns:4rem 1fr;gap:1rem;padding:1.6rem 0;border-top:1px solid var(--line);opacity:.35;transition:opacity .5s}
.day.on{opacity:1}
.day .d{font:300 1.6rem/1.2 'cormorant',serif;color:var(--dim)}
.day.on .d{color:var(--ink)}
.day h4{margin:0;font:400 1.1rem/1.4 'jost',sans-serif;letter-spacing:.02em}
.day p{color:var(--mut);font-size:.95rem;margin-top:.3rem}
@media (max-width:900px){.route__grid{grid-template-columns:1fr;gap:2.5rem}.route__sticky{position:static}.day{opacity:1}}

/* Polar */
.polar__grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.polar canvas{width:100%;aspect-ratio:1;display:block}
.polar h2{margin-top:1rem}
.polar .mut{margin-top:1.4rem;max-width:50ch}
.polar__facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:2.4rem;border-top:1px solid var(--line);padding-top:1.4rem}
.polar__facts b{display:block;font-size:1.9rem;line-height:1.1}
.polar__facts span{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
@media (max-width:900px){.polar__grid{grid-template-columns:1fr;gap:2rem}.polar__facts{grid-template-columns:1fr 1fr}}

/* Saison auf Papier */
.sun{border:1px solid var(--line);padding:1.4rem 1.6rem;margin-bottom:3rem}
.sun__tabs{display:flex;gap:.4rem;flex-wrap:wrap}
.sun__tabs button{background:none;border:1px solid var(--line);color:var(--ink);font:400 .66rem/1 'jost',sans-serif;letter-spacing:.2em;text-transform:uppercase;padding:.55rem .9rem;cursor:pointer}
.sun__tabs button[aria-selected="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.sun canvas{width:100%;height:clamp(220px,32vw,340px);display:block;margin-top:1rem}
.sun__out{font-size:.9rem;color:var(--mut);margin-top:.6rem}
.months{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.month{padding:1.8rem 1.4rem 1.8rem 0;border-right:1px solid var(--line)}
.month:last-child{border-right:0}
.month .m,.month .s{display:block}
.month .m{font:300 2.4rem/1 'cormorant',serif}
.month .s{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);margin:.5rem 0 1rem}
.month p{font-size:.9rem;color:var(--mut)}
@media (max-width:900px){.months{grid-template-columns:1fr 1fr}.month{border-bottom:1px solid var(--line)}}
.avail{margin-top:4rem;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.avail table{width:100%;border-collapse:collapse;font-size:.92rem}
.avail td{padding:.9rem 0;border-top:1px solid var(--line);vertical-align:middle}
.avail td:last-child{text-align:right;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase}
.st{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;margin-right:.6rem;background:var(--ink);vertical-align:middle}
.st.res{background:transparent;border:1px solid var(--dim)}.st.req{background:var(--dim)}
@media (max-width:900px){.avail{grid-template-columns:1fr;gap:2rem}}

/* Tiere: Raster, Farbe beim Zentrieren */
.wild__head{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:end;margin-bottom:2.5rem}
.wild__head p{color:var(--mut);max-width:48ch}
.wild__note{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-top:2rem}
@media (max-width:900px){.wild__head{grid-template-columns:1fr}}

/* Regeln und Indexliste */
.rules__grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start}
.rules .nums{grid-template-columns:1fr 1fr;margin-top:2.4rem}
.index{margin-top:0;border-top:1px solid var(--line)}
.index .row{display:grid;grid-template-columns:3rem 1fr auto;gap:1.6rem;align-items:baseline;padding:1.25rem 0;border-bottom:1px solid var(--line)}
.index .row .i{font:300 .9rem/1 'cormorant',serif;color:var(--dim)}
.index .row .t{font:300 clamp(1.25rem,2vw,1.7rem)/1.2 'cormorant',serif}
.index .row .r{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);text-align:right;max-width:26ch}
@media (max-width:900px){.rules__grid{grid-template-columns:1fr;gap:3rem}.index .row{grid-template-columns:2.4rem 1fr}.index .row .r{grid-column:2;text-align:left}}

/* Stimmen */
.voices{display:grid;grid-template-columns:1fr 1fr;gap:4rem}
.voice{font:300 clamp(1.4rem,2.2vw,1.9rem)/1.35 'cormorant',serif;margin:0}
.voice cite{display:block;font:400 .72rem/1 'jost',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);margin-top:1.4rem;font-style:normal}
@media (max-width:900px){.voices{grid-template-columns:1fr}}

/* FAQ */
.faq__grid{display:grid;grid-template-columns:2fr 3fr;gap:4rem;align-items:start}
.faq__grid h2{margin-top:1rem}.faq__grid .mut{margin-top:1.2rem}
.acc__btn{font-family:'cormorant',serif;font-size:1.35rem;font-weight:400;background:none;border:0;color:inherit;cursor:pointer}
@media (max-width:900px){.faq__grid{grid-template-columns:1fr;gap:2rem}}

/* Anfrage */
.enq{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start}
.enq h2{margin-top:1rem}
.form{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem 1.6rem;margin-top:2rem}
.form label{display:block;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);margin-bottom:.5rem}
.form input,.form select,.form textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--dim);padding:.7rem 0;color:var(--ink);outline:none;transition:border-color .3s;font:inherit;border-radius:0}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--ink)}
.form select option{color:#000}
.form .full{grid-column:1/-1}.form textarea{min-height:5rem;resize:vertical}
.demo-note{font-size:.78rem;color:var(--mut);margin-top:.8rem}
.direct{padding-top:2rem}
.direct .big{font:300 clamp(1.6rem,2.6vw,2.4rem)/1.3 'cormorant',serif}
.direct dl{margin:2rem 0 0;display:grid;grid-template-columns:auto 1fr;gap:.8rem 2rem;font-size:.95rem}
.direct dt{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);padding-top:.2rem}.direct dd{margin:0}
.direct a{color:inherit;text-decoration:none}
@media (max-width:900px){.enq{grid-template-columns:1fr;gap:3rem}.form{grid-template-columns:1fr}}

footer{border-top:1px solid var(--line);padding:3rem 0 calc(2rem + env(safe-area-inset-bottom));font-size:.78rem;color:var(--mut)}
footer .wrap{display:grid;grid-template-columns:1.3fr 1fr;gap:2rem}
footer a{text-decoration:none;color:inherit}footer a:hover{color:var(--ink)}
footer .cols{display:flex;flex-direction:column;gap:.5rem}
footer .wm{font:400 1rem/1 'cormorant',serif;letter-spacing:.4em;text-transform:uppercase;color:var(--ink)}
@media (max-width:900px){footer .wrap{grid-template-columns:1fr}}

/* Yachtseiten */
.ypage .hero{min-height:70svh}
.ypage .hero video,.ypage .hero .fig img{filter:none}
.yhero{padding-top:calc(var(--hh) + 3rem)}
.yhero__grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:end}
.yhero h1{font-size:clamp(3rem,7vw,6.4rem);line-height:1}
.yhero .line{color:var(--mut);margin-top:1.2rem;max-width:44ch;font-size:1.02rem}
.yhero .cta{display:flex;gap:1.8rem;align-items:center;margin-top:2rem;flex-wrap:wrap}
@media (max-width:900px){.yhero__grid{grid-template-columns:1fr;gap:2rem}}
.vitrine{border:1px solid var(--line);padding:1.6rem 1.8rem}
.vitrine .vh{display:flex;justify-content:space-between;gap:1rem;font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--mut);padding-bottom:1rem;border-bottom:1px solid var(--line)}
.vitrine dl{margin:0;display:grid;grid-template-columns:2.4rem 1fr 1fr;gap:0 1rem}
.vitrine dl > *{padding:.7rem 0;border-bottom:1px solid var(--line);font-size:.92rem}
.vitrine dl .i{font-family:'plexmono',ui-monospace,monospace;font-size:.7rem;color:var(--dim);letter-spacing:.1em}
.vitrine dl dt{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);align-self:center}
.vitrine dl dd{margin:0;font-family:'plexmono',ui-monospace,monospace;font-size:.8rem;letter-spacing:.04em}
.ydetail{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start}
.ydetail .wall{font:300 clamp(1.3rem,1.9vw,1.75rem)/1.4 'cormorant',serif;max-width:34rem;width:100%}
.ydetail .wall + .wall{margin-top:1.1rem}
.ydetail ul{margin:1.6rem 0 0;padding:0;list-style:none;border-top:1px solid var(--line)}
.ydetail li{padding:.8rem 0;border-bottom:1px solid var(--line);font-size:.95rem;color:var(--mut)}
@media (max-width:900px){.ydetail{grid-template-columns:1fr;gap:3rem}}
.ynext{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem;border-top:1px solid var(--line);padding-top:2.5rem}
.ynext a{text-decoration:none;color:inherit;display:grid;gap:.4rem}
.ynext a .k{margin-bottom:.4rem}
.ynext a b{font:300 1.8rem/1 'cormorant',serif;letter-spacing:.08em;text-transform:uppercase}
.ynext a:last-child{text-align:right}.ynext a:last-child .k::before{display:none}

/* Brand-Seite */
.brand-page .sheet{display:grid;gap:2rem}
.logo-card{border:1px solid var(--line);padding:3rem 1rem;display:grid;place-items:center;min-height:16rem;position:relative;overflow:hidden}
.logo-card .tag{position:absolute;left:1rem;top:.8rem;font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:var(--mut)}
.logo-card.on-paper{background:var(--paper);color:var(--paper-ink)}
.logo-card.on-paper .tag{color:var(--paper-mut)}
.lg{display:inline-grid;justify-items:center;gap:.6rem;text-align:center}
.lg .w{font:300 clamp(1.05rem,3vw,2.6rem)/1 'cormorant',serif;letter-spacing:.42em;text-transform:uppercase;margin-right:-.42em;white-space:nowrap}
.lg .w b{font-weight:500}
.lg .s{font:300 .6rem/1 'jost',sans-serif;letter-spacing:.34em;text-transform:uppercase;opacity:.75}
.lg .r{width:100%;height:1px;background:currentColor;opacity:.6}
.lg.v2 .w{display:grid;line-height:.9}
.lg.v2 .w span{display:block}
.lg .em{display:block;width:5.4rem;height:5.4rem}
.lg .em *{fill:none;stroke:currentColor;stroke-width:1;vector-effect:non-scaling-stroke}
.lg.v4 .mono{font:300 clamp(3rem,8vw,5rem)/1 'cormorant',serif;letter-spacing:.1em;position:relative;padding:0 .4em}
.lg.v4 .mono::after{content:"";position:absolute;left:0;right:0;top:56%;height:1px;background:currentColor;opacity:.6}
.hd{transition:background .5s,padding .5s,transform .35s var(--ease),visibility 0s}
.hd.away{transform:translateY(-102%);visibility:hidden;transition:background .5s,padding .5s,transform .08s ease-out,visibility 0s .06s}
/* Geschlossene Panels und inaktive Phasen sind auch fuer Screenreader und Pruefskripte unsichtbar */
.acc__panel{visibility:hidden;transition:grid-template-rows .4s var(--ease),visibility 0s .4s}
.acc__item.open .acc__panel{visibility:visible;transition:grid-template-rows .4s var(--ease),visibility 0s}
.phase{visibility:hidden;transition:opacity .7s var(--ease),transform .7s var(--ease),visibility 0s .7s}
.phase.on{visibility:visible;transition:opacity .7s var(--ease),transform .7s var(--ease),visibility 0s}

.ypage .yhero h1{letter-spacing:.08em;text-transform:uppercase}
.brand-page .yhero h1{letter-spacing:.005em;text-transform:none}
/* Farbe fuer alle Abzuege: beim Zentrieren (Engine) und unter dem Zeiger; Szene und Hero-Video ueber den Container */
.scene__sticky:hover .fig .dual__col{--col:1}
.hero video{transition:filter .9s var(--ease)}
.hero:hover video{filter:contrast(1.05) brightness(.9)}
.climb__img .dual__col{transition:opacity .9s var(--ease)}

/* Fotogitter im Kapitel "The wall": Salonhaengung auf zwoelf Spalten, ungleiche Formate.
   Eigener Klassenname .mosaic, damit er nicht mit .wall (grosse Fliesstext-Absaetze) kollidiert. */
.mosaic{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:2rem 1.4rem;align-items:start}
.mosaic .fig{aspect-ratio:3/2}
.mosaic .w-a{grid-column:1/8}.mosaic .w-a .fig{aspect-ratio:16/10}
.mosaic .w-b{grid-column:8/13;margin-top:4rem}.mosaic .w-b .fig{aspect-ratio:4/5}
.mosaic .w-c{grid-column:1/5;margin-top:-2rem}.mosaic .w-c .fig{aspect-ratio:4/5}
.mosaic .w-d{grid-column:5/13}.mosaic .w-d .fig{aspect-ratio:21/10}
.mosaic .w-e{grid-column:1/6;margin-top:3rem}.mosaic .w-e .fig{aspect-ratio:3/2}
.mosaic .w-f{grid-column:6/10}.mosaic .w-f .fig{aspect-ratio:1}
.mosaic .w-g{grid-column:10/13;margin-top:5rem}.mosaic .w-g .fig{aspect-ratio:4/5}
.mosaic .w-h{grid-column:1/4}.mosaic .w-h .fig{aspect-ratio:1}
.mosaic .w-i{grid-column:4/10;margin-top:-2rem}.mosaic .w-i .fig{aspect-ratio:16/9}
.mosaic .w-j{grid-column:10/13;margin-top:2rem}.mosaic .w-j .fig{aspect-ratio:4/5}
.mosaic .w-k{grid-column:1/8;margin-top:1rem}.mosaic .w-k .fig{aspect-ratio:16/9}
.mosaic .w-l{grid-column:8/13;margin-top:4rem}.mosaic .w-l .fig{aspect-ratio:3/2}
@media (max-width:900px){.mosaic{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6rem 1rem}.mosaic [class*="w-"]{grid-column:auto;margin-top:0}.mosaic .w-a,.mosaic .w-d,.mosaic .w-i,.mosaic .w-k{grid-column:1/-1}.mosaic .fig{aspect-ratio:3/2!important}.mosaic .w-b .fig,.mosaic .w-c .fig,.mosaic .w-g .fig,.mosaic .w-j .fig{aspect-ratio:4/5!important}}

/* Siegel im Footer */
footer .cols .footseal{width:7.5rem;color:var(--ink);margin-bottom:1rem}
footer .footseal svg{width:100%;height:auto;display:block}

/* Cookie-Hinweis: unten links, monochrom, kein Tracking */
.notice{position:fixed;left:1rem;bottom:1rem;z-index:60;width:min(24rem,calc(100% - 2rem));background:var(--paper);color:var(--paper-ink);--ink:var(--paper-ink);--mut:var(--paper-mut);--dim:var(--paper-dim);--line:var(--paper-line);padding:1.4rem 1.5rem;border:1px solid var(--paper-ink);box-shadow:0 20px 50px rgba(0,0,0,.35);opacity:0;transform:translateY(12px);transition:opacity .4s var(--ease),transform .4s var(--ease)}
.notice.in{opacity:1;transform:none}
.notice p{font-size:.86rem;line-height:1.55;margin-top:.6rem}
.notice .k{font-size:.62rem}
.notice__row{display:flex;gap:1.2rem;align-items:center;margin-top:1.1rem;flex-wrap:wrap}
.notice .btn{padding:.7rem 1.1rem;font-size:.66rem;border-color:var(--paper-ink);color:var(--paper-ink)}
.notice .btn:hover{background:var(--paper-ink);color:var(--paper)}
.notice .lnk{font-size:.62rem;color:var(--paper-mut)}
body:has(.lightbox.open) .notice{opacity:0;pointer-events:none}

/* Brand-Seite: Kartensiegel gross */
.lg.v5 .em{width:12rem;height:12rem}
.lg.v5 .em *{stroke-width:1}

/* Gesamtdurchgang: Kapitelkopf ohne Kickerzeile, Etikett auf zwei Zeilen */
.ch{grid-template-columns:auto 1fr;align-items:baseline}
.label{gap:.2rem}
.label span{font-size:.74rem}
.fleet__intro{grid-template-columns:1fr;max-width:60ch}
.route .map{margin-top:1.4rem}
.route__pos,.route .tiny{display:none}

/* Anfrage: leichtes Formular, gleiche Feldsprache wie der Rest der Site, kein zweites Bausystem */
.enq{align-items:start}
.trap{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.sealbox{width:min(13rem,50%);margin-top:2.6rem;color:var(--dim);opacity:.8}

.premise > *,.ydetail > *,.enq > *,.yex > *{min-width:0}

/* Fotonachweis: kleines i-Symbol statt dauerhaft sichtbarem Text. Klick/Tap oeffnet eine
   Sprechblase mit dem vollen Nachweis; Text wird zur Laufzeit per sy.js in .credit__txt
   gewickelt, build.py bleibt unveraendert. */
.credit{position:absolute;right:.5rem;bottom:.5rem;z-index:5;display:flex;align-items:center;justify-content:flex-end;max-width:calc(100% - 1rem);pointer-events:auto;cursor:pointer;opacity:1;text-shadow:none;color:#fff}
.credit::before{content:"i";flex:0 0 1.3rem;width:1.3rem;height:1.3rem;border-radius:50%;background:rgba(10,10,10,.62);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);color:#fff;font:italic 600 .72rem/1.3rem Georgia,'Times New Roman',serif;text-align:center;transition:background .25s}
.credit:hover::before,.credit.open::before{background:rgba(10,10,10,.85)}
.credit__txt{display:inline-block;max-width:0;overflow:hidden;white-space:nowrap;font-size:.64rem;letter-spacing:.04em;text-transform:none;color:#fff;background:rgba(10,10,10,.82);border-radius:.9rem;transition:max-width .3s var(--ease),padding .3s var(--ease);vertical-align:middle}
.credit.open .credit__txt{max-width:14rem;padding:.4rem .7rem;margin-right:.35rem;white-space:normal;line-height:1.4}
.credit a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.paper .credit{color:#fff;text-shadow:none}
.paper .credit::before{background:rgba(20,20,18,.8)}
.paper .credit:hover::before,.paper .credit.open::before{background:rgba(20,20,18,.95)}
.paper .credit__txt{background:rgba(20,20,18,.9)}
@media (max-width:640px){.credit.open .credit__txt{max-width:9.5rem}}
/* Die Kachel schneidet Bilder zu; waehrend ihr Credit offen ist, muss die Sprechblase darueber hinauswachsen duerfen */
.fig:has(.credit.open){overflow:visible}
.credit.open{max-width:none}
.legal{max-width:54rem}
.legal h2{font:500 clamp(1.25rem,2vw,1.6rem)/1.25 'cormorant',serif;margin:3rem 0 1rem}
.legal h2:first-child{margin-top:0}
.legal p{font-size:.98rem;line-height:1.75;color:var(--mut);max-width:62ch}
.legal p+p{margin-top:.9rem}
.legal a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
footer .legalbar{border-top:1px solid var(--line);margin-top:2.4rem;padding-top:1.4rem;display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;font-size:.72rem;color:var(--dim)}
footer .legalbar a{text-decoration:underline;text-underline-offset:2px}
.notice{max-height:calc(100vh - 2rem);overflow-y:auto}
.notice__row{gap:.7rem 1.1rem}
.notice .btn.solid{background:var(--paper-ink);color:var(--paper)}
.notice .btn.solid:hover{background:transparent;color:var(--paper-ink)}
.notice .lnk{background:none;border:0;cursor:pointer;font-family:inherit;letter-spacing:.2em;text-transform:uppercase}
.notice__detail{margin-top:1.1rem;border-top:1px solid var(--paper-line);padding-top:.4rem}
.notice__cat{display:flex;gap:.7rem;align-items:flex-start;padding:.75rem 0;border-bottom:1px solid var(--paper-line);font-size:.78rem;line-height:1.5;cursor:pointer}
.notice__cat:last-child{border-bottom:0}
.notice__cat input{margin-top:.2rem;flex:0 0 auto;accent-color:var(--paper-ink);width:1rem;height:1rem}
.notice__cat b{display:block;font-weight:500;letter-spacing:.02em}
.notice__cat span{color:var(--paper-mut)}
.notice__legal{margin-top:.9rem;font-size:.68rem}
.notice__legal a{color:var(--paper-mut);text-decoration:underline;text-underline-offset:2px}
footer .consent-reopen{background:none;border:0;padding:0;cursor:pointer;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:2px}
footer .consent-reopen:hover{color:var(--ink)}
[hidden]{display:none!important}