@layer reset,tokens,base,components,responsive,motion;

@layer tokens{
:root{
  --ink:#090c11;
  --ink-2:#0e131a;
  --panel:#121820;
  --panel-2:#171f29;
  --line:#273241;
  --line-soft:color-mix(in srgb,var(--line) 66%,transparent);
  --amber:#e8a33d;
  --amber-2:#f3b95e;
  --blue:#6e9fd0;
  --red:#cf4b43;
  --fg:#eef2f6;
  --muted:#a6b0bd;
  --paper:#f3f0e9;
  --paper-2:#ebe6dc;
  --paper-ink:#171a1f;
  --max:1180px;
  --g:8px;
  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:48px;--s6:64px;--s7:96px;--s8:144px;
  --t0:12px;--t1:16px;--t2:24px;--t3:36px;--t4:54px;--t5:81px;
  --shadow:0 24px 64px rgba(0,0,0,.28);
  --shadow-soft:0 12px 30px rgba(0,0,0,.12);
}
}

@layer reset{
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;background:var(--ink)}
body{margin:0}
a{color:inherit}
img{display:block;max-width:100%;height:auto}
button,input,select,textarea{font:inherit}
button{color:inherit}
}

@layer base{
body{
  background:var(--ink);
  color:var(--fg);
  font:16px/1.6 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body.dialog-open{overflow:hidden}
::selection{background:var(--amber);color:var(--ink)}
:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.wrap{width:min(var(--max),calc(100% - 40px));margin-inline:auto}
.eyebrow,.mono{font:700 var(--t0)/1.25 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.12em;text-transform:uppercase}
.eyebrow{color:var(--blue)}
.muted{color:var(--muted)}
.skip{position:fixed;left:16px;top:12px;z-index:1000;padding:10px 14px;background:var(--amber);color:var(--ink);font-weight:850;transform:translateY(-180%)}
.skip:focus{transform:none}
.noscript{padding:12px;background:#40260c;color:#fff0d6;text-align:center}
}

@layer components{
/* Top navigation: flat, precise, slightly translucent. */
.topbar{position:absolute;inset:0 0 auto;z-index:20;padding:20px 0}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:24px}
.brand{font-weight:900;text-decoration:none;letter-spacing:-.02em}
.topnav{display:flex;align-items:center;gap:6px;padding:5px;border:1px solid rgba(255,255,255,.11);background:rgba(9,12,17,.30);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.topnav a{padding:8px 10px;font-size:13px;color:#d9e0e8;text-decoration:none;transition:background .18s ease,color .18s ease}
.topnav a:hover,.topnav a:focus-visible{background:rgba(255,255,255,.07);color:var(--amber)}

/* Hero: image first, but text is never allowed to lose contrast. */
.hero{min-height:min(880px,100svh);display:grid;align-items:end;position:relative;overflow:hidden;isolation:isolate}
.hero-media{position:absolute;inset:0;z-index:-2;background:#111821}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 45%;filter:saturate(.94) contrast(1.035);transform:scale(1.003)}
.hero-media:before{content:"";position:absolute;inset:0;z-index:1;background:rgba(7,10,15,.17);pointer-events:none}
.hero-media:after{content:"";position:absolute;inset:0;z-index:2;background:
  linear-gradient(180deg,rgba(6,9,13,.44) 0%,rgba(6,9,13,.14) 28%,rgba(6,9,13,.34) 56%,rgba(6,9,13,.88) 88%,rgba(6,9,13,.97) 100%),
  linear-gradient(90deg,rgba(6,9,13,.34) 0%,rgba(6,9,13,.06) 55%,rgba(6,9,13,.10) 100%);
pointer-events:none}
.hero-inner{position:relative;z-index:2;padding:164px 0 64px}
.hero-inner:before{content:"";position:absolute;left:-32px;bottom:38px;width:1px;height:168px;background:linear-gradient(var(--amber),transparent);opacity:.72}
.hero .eyebrow{color:#bfd2e5}
.hero h1{max-width:920px;margin:12px 0 18px;font-size:clamp(52px,8.1vw,var(--t5));line-height:.88;letter-spacing:-.052em;text-transform:uppercase;text-wrap:balance}
.hero h1 span{color:var(--amber-2)}
.hero-copy{max-width:720px;margin:0;color:#eef3f8;font-size:clamp(18px,2vw,23px);line-height:1.45;text-wrap:pretty;text-shadow:0 2px 18px rgba(0,0,0,.45)}
.factline{display:flex;flex-wrap:wrap;gap:8px 0;margin:26px 0 0;color:#fff;font-weight:780}
.factline span{display:inline-flex;align-items:center;min-height:28px;padding-right:16px;margin-right:16px;border-right:1px solid rgba(255,255,255,.24)}
.factline span:last-child{border-right:0;margin-right:0;padding-right:0}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 22px;border:1px solid var(--amber);background:var(--amber);color:var(--ink);font-weight:900;text-decoration:none;cursor:pointer;border-radius:0;transition:transform .18s ease,background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease}
.btn:hover{transform:translateY(-2px);background:var(--amber-2);box-shadow:0 10px 26px rgba(232,163,61,.17)}
.btn.ghost{background:rgba(9,12,17,.30);color:var(--amber-2);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.btn.dark{background:var(--ink);color:var(--fg);border-color:var(--ink)}
.btn.dark:hover{background:#202731;color:#fff;box-shadow:none}

/* Fact instrument strip */
.facts{background:var(--panel);border-block:1px solid var(--line);position:relative}
.facts:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(110,159,208,.055),transparent 34%,transparent 66%,rgba(232,163,61,.045));pointer-events:none}
.facts-grid{display:grid;grid-template-columns:repeat(6,1fr);position:relative}
.fact{min-width:0;padding:26px 18px 28px;border-right:1px solid var(--line)}
.fact:last-child{border-right:0}
.fact dt{color:#9eb0c2;font:700 11px/1.25 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;text-transform:uppercase;letter-spacing:.1em}
.fact dd{margin:7px 0 0;font-size:26px;font-weight:900;line-height:1.02;letter-spacing:-.025em}
.fact small{display:block;margin-top:8px;color:#a5b0bd;font-size:12px;font-weight:560;line-height:1.3}

.section{padding:88px 0;scroll-margin-top:74px;position:relative}
.section.tight{padding:56px 0}
.section.paper{background:var(--paper);color:var(--paper-ink)}
.section.panel{background:var(--panel)}
.section h2{max-width:940px;margin:0 0 22px;font-size:clamp(38px,5vw,64px);line-height:.96;letter-spacing:-.045em;text-transform:uppercase;text-wrap:balance}
.section h2 em{font-style:normal;color:#a76512}
.section:not(.paper) h2 em{color:var(--amber)}
.lede{max-width:760px;margin:0 0 16px;font-size:clamp(18px,2vw,22px);line-height:1.55;text-wrap:pretty}
.paper .muted{color:#5c646d}

/* Media preview: deliberate asymmetric Bauhaus composition */
.photo-preview{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:repeat(2,minmax(190px,1fr));gap:8px;margin-top:32px}
.photo-preview a{position:relative;overflow:hidden;min-height:220px;background:#20242a;isolation:isolate}
.photo-preview a:first-child{grid-row:1/3}
.photo-preview a:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 56%,rgba(4,7,10,.62));z-index:1;transition:opacity .25s ease}
.photo-preview img{width:100%;height:100%;object-fit:cover;transition:transform .45s cubic-bezier(.2,.65,.2,1),filter .3s ease}
.photo-preview a:hover img{transform:scale(1.025);filter:saturate(1.04)}
.photo-preview span{position:absolute;left:12px;bottom:11px;z-index:2;background:rgba(9,12,17,.86);color:#fff;padding:6px 9px;font:700 11px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;text-transform:uppercase;letter-spacing:.08em}

.two{display:grid;grid-template-columns:7fr 5fr;gap:64px;align-items:start}
.card{border:1px solid var(--line);background:linear-gradient(180deg,var(--panel-2),#121922);padding:28px;border-radius:0;box-shadow:none}
.paper .card{background:rgba(255,255,255,.70);border-color:#d5cfc3;box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.clean-list{list-style:none;padding:0;margin:0}
.clean-list li{display:grid;grid-template-columns:160px 1fr;gap:20px;padding:15px 0;border-bottom:1px solid var(--line-soft)}
.paper .clean-list li{border-color:#d7d0c5}
.clean-list li:last-child{border-bottom:0}
.clean-list strong{font-size:14px}
.plan{display:block;background:#fff;border-radius:0;padding:18px;border:1px solid #d1cbc0;color:var(--paper-ink);text-decoration:none;box-shadow:var(--shadow-soft);transition:transform .2s ease,box-shadow .2s ease}
.plan:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(0,0,0,.14)}
.plan img{width:100%;max-height:520px;object-fit:contain}
.plan-cap{margin:12px 0 0;color:#60656d;font-size:14px}
.details-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:30px}
.detail{padding:22px;border:1px solid var(--line);background:var(--panel-2);border-radius:0}
.detail h3{margin:0 0 8px;font-size:17px;line-height:1.2}
.detail p{margin:0;color:var(--muted);font-size:15px}
.paper .detail{background:rgba(255,255,255,.74);border-color:#d6d0c6}
.paper .detail p{color:#5d6570}

.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.gallery button{position:relative;aspect-ratio:3/2;padding:0;border:0;background:#20262e;cursor:zoom-in;overflow:hidden;border-radius:0;isolation:isolate}
.gallery button:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(7,10,14,.55));z-index:1;transition:opacity .2s ease}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .4s cubic-bezier(.2,.65,.2,1),filter .25s ease}
.gallery button:hover img{transform:scale(1.03);filter:saturate(1.04)}
.gallery span{position:absolute;left:10px;bottom:10px;z-index:2;background:rgba(9,12,17,.82);padding:5px 8px;color:#fff;font:700 11px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;text-transform:uppercase;letter-spacing:.07em}

.media-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.media-box{border:1px solid var(--line);background:linear-gradient(180deg,var(--panel-2),#111821);padding:18px;border-radius:0}
.media-box h3{margin-top:0}
.video{aspect-ratio:16/9;background:#000;overflow:hidden}
.video video,.video iframe{width:100%;height:100%;border:0;display:block}
.tour-cover{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#1a2028}
.tour-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(9,12,17,.22),rgba(9,12,17,.62))}
.tour-cover img{width:100%;height:100%;object-fit:cover;filter:brightness(.82)}
.tour-cover span{position:absolute;inset:0;z-index:1;display:grid;place-items:center;text-align:center;font-size:20px;font-weight:900;color:white;padding:30px;text-transform:uppercase;letter-spacing:-.02em}
.tour-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}

.faq{max-width:820px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:18px 0;font-weight:850;font-size:18px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";float:right;color:var(--amber);font:700 22px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.faq details[open] summary:after{content:"−"}
.faq p{margin:0;padding:0 0 20px;color:var(--muted)}

.showing{display:grid;grid-template-columns:5fr 7fr;gap:64px}
.form{display:grid;gap:15px;padding:24px;border:1px solid var(--line);background:linear-gradient(180deg,#111821,#0d1218)}
.field{display:grid;gap:7px}
.field label{font-weight:800;font-size:14px}
.field small{color:var(--muted)}
.field input,.field select,.field textarea{width:100%;padding:13px 14px;border:1px solid #3a4655;border-radius:0;background:#0b1016;color:var(--fg);outline:none;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--amber);background:#0e141c;box-shadow:0 0 0 3px rgba(232,163,61,.09)}
.field textarea{min-height:112px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-note{font-size:13px;color:var(--muted)}
.status{display:none;padding:12px;border:1px solid #4d7b5e;background:#13271b}
.status.show{display:block}
.contact-stack{display:flex;flex-wrap:wrap;gap:10px}

.footer{border-top:1px solid var(--line);padding:36px 0 104px;color:#9ca8b5;background:#080b0f}
.footer .wrap{display:grid;grid-template-columns:1fr auto;gap:24px}
.footer a{color:#dfe6ed}

.sticky{position:fixed;top:0;left:0;right:0;z-index:30;display:flex;align-items:center;gap:10px;padding:8px max(20px,calc((100vw - var(--max))/2));background:rgba(9,12,17,.88);border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);transform:translateY(-110%);visibility:hidden;pointer-events:none;transition:transform .25s ease,visibility .25s}
.sticky.show{transform:none;visibility:visible;pointer-events:auto}
.sticky .address{font-size:13px;color:#aab4bf}.sticky .price{margin-left:auto;font-weight:900}
.sticky .btn{min-height:38px;padding:7px 14px}
.mobile-actions{display:none}

dialog.lightbox{width:min(94vw,1500px);max-width:none;padding:0;border:1px solid #303946;background:#080a0e;color:#fff;box-shadow:var(--shadow)}
dialog.lightbox::backdrop{background:rgba(0,0,0,.91);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.lb-inner{position:relative;padding:50px 64px 24px}
.lb-image{width:100%;max-height:78vh;object-fit:contain}
.lb-caption{text-align:center;margin:12px auto 0;color:#c8d0d9}
.lb-close,.lb-prev,.lb-next{position:absolute;z-index:2;width:44px;height:44px;border:1px solid #46515e;background:rgba(19,25,34,.88);color:white;border-radius:0;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.lb-close{right:12px;top:12px}.lb-prev{left:10px;top:50%}.lb-next{right:10px;top:50%}
.privacy{max-width:780px}.privacy h1{font-size:44px;line-height:1;margin:0 0 24px}.privacy h2{font-size:26px;margin-top:34px}
}

@layer responsive{
@media(max-width:900px){
  .topnav{display:none}
  .hero{min-height:min(820px,100svh)}
  .hero-inner{padding:138px 0 48px}
  .hero-inner:before{left:-18px;bottom:28px;height:132px}
  .facts-grid{grid-template-columns:repeat(3,1fr)}
  .fact:nth-child(3){border-right:0}.fact:nth-child(-n+3){border-bottom:1px solid var(--line)}
  .two,.showing{grid-template-columns:1fr;gap:36px}
  .details-grid{grid-template-columns:repeat(3,1fr)}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .media-grid{grid-template-columns:1fr}
  .photo-preview{grid-template-columns:1.45fr 1fr;grid-template-rows:240px 180px 180px}
  .photo-preview a:first-child{grid-column:1/3;grid-row:auto;min-height:240px}
  .photo-preview a{min-height:180px}
  .photo-preview a:nth-child(2),.photo-preview a:nth-child(4){grid-column:1}
  .photo-preview a:nth-child(3),.photo-preview a:nth-child(5){grid-column:2}
  .sticky{display:none}
  .mobile-actions{display:flex;position:fixed;z-index:40;left:0;right:0;bottom:0;gap:6px;padding:8px max(10px,env(safe-area-inset-left)) calc(8px + env(safe-area-inset-bottom));background:rgba(9,12,17,.91);border-top:1px solid rgba(255,255,255,.12);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
  .mobile-actions .btn{flex:1;min-height:46px;padding:8px 10px}
  .footer{padding-bottom:116px}
}

@media(max-width:620px){
  .wrap{width:min(100% - 28px,var(--max))}
  .topbar{padding-top:15px}.brand{font-size:14px;letter-spacing:0}
  .hero{min-height:100svh;max-height:none}
  .hero-media img{object-position:54% 44%}
  .hero-media:before{background:rgba(7,10,15,.23)}
  .hero-media:after{background:
    linear-gradient(180deg,rgba(6,9,13,.54) 0%,rgba(6,9,13,.20) 25%,rgba(6,9,13,.33) 46%,rgba(6,9,13,.88) 73%,rgba(6,9,13,.985) 100%),
    linear-gradient(90deg,rgba(6,9,13,.24),rgba(6,9,13,.06) 62%)}
  .hero-inner{padding:116px 0 88px}
  .hero h1{font-size:clamp(46px,15vw,66px);max-width:9ch;line-height:.87}
  .hero-copy{font-size:17px;line-height:1.48;max-width:35ch}
  .factline{font-size:13px;gap:7px 0;margin-top:20px}
  .factline span{min-height:auto;padding-right:9px;margin-right:9px}
  .hero .actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:22px}
  .hero .actions .btn{width:100%;min-height:48px;padding:10px 12px;font-size:14px}
  .hero .actions .btn:first-child{grid-column:1/3}
  .hero .actions .btn:nth-child(3){display:none}

  /* On phones the fact strip becomes a compact horizontal instrument rail. */
  .facts{overflow:hidden}
  .facts-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-left:14px;padding-right:14px;overscroll-behavior-inline:contain}
  .facts-grid::-webkit-scrollbar{display:none}
  .fact{flex:0 0 42vw;max-width:168px;min-width:142px;padding:18px 15px 20px;border-right:1px solid var(--line)!important;border-bottom:0!important;scroll-snap-align:start}
  .fact:first-child{border-left:1px solid var(--line)}
  .fact dd{font-size:22px}.fact small{font-size:11px}

  .section{padding:58px 0}.section.tight{padding:42px 0}
  .section h2{font-size:clamp(35px,11vw,48px);line-height:.96;margin-bottom:18px}
  .lede{font-size:17px;line-height:1.53}

  /* Keep the visual sell dense: one large room, four supporting frames. */
  .photo-preview{grid-template-columns:1fr 1fr;grid-template-rows:260px 148px 148px;gap:6px;margin-top:24px}
  .photo-preview a:first-child{grid-column:1/3;min-height:260px}
  .photo-preview a{min-height:148px}
  .photo-preview span{left:8px;bottom:8px;padding:5px 7px;font-size:10px}
  #photos .actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  #photos .actions .btn{padding:10px 8px;font-size:14px}

  .details-grid{grid-template-columns:1fr;gap:6px}
  .detail{padding:18px}
  .card{padding:18px}
  .clean-list li{grid-template-columns:1fr;gap:4px;padding:13px 0}
  .plan{padding:10px}
  .gallery{grid-template-columns:1fr 1fr;gap:5px}
  .gallery button{aspect-ratio:1.15}
  .gallery span{left:7px;bottom:7px;font-size:9px;padding:4px 5px}
  .media-box{padding:12px}
  .tour-links{display:grid;grid-template-columns:1fr}
  .tour-links .btn{width:100%}
  .showing{gap:26px}
  .form{padding:16px;gap:13px}
  .form-row{grid-template-columns:1fr}
  .contact-stack{display:grid;grid-template-columns:1fr 1fr}
  .contact-stack .btn{width:100%;padding-inline:10px}
  .footer .wrap{grid-template-columns:1fr}
  .lb-inner{padding:54px 8px 18px}.lb-prev{left:4px}.lb-next{right:4px}
  .mobile-actions .btn{font-size:13px;min-height:44px}
}

@media(max-width:390px){
  .hero h1{font-size:44px}
  .hero-copy{font-size:16px}
  .fact{flex-basis:46vw}
  .mobile-actions .btn{font-size:12px;padding-inline:7px}
}
}

@layer motion{
@media(prefers-reduced-motion:no-preference){
  @supports(animation-timeline:view()){
    .section h2,.section .lede,.details-grid,.media-grid,.gallery,.card,.plan{
      animation:future-rise both linear;
      animation-timeline:view();
      animation-range:entry 0% entry 24%;
    }
    @keyframes future-rise{from{opacity:.01;transform:translateY(14px)}to{opacity:1;transform:none}}
  }
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
}