:root{
  --navy-deep:#080B27;
  --navy-mid:#10163A;
  --navy-panel:#141B45;
  --blue-electric:#334DFF;
  --blue-glow:#6477FF;
  --blue-light:#A8B4FF;
  --white:#F5F6FA;
  --grey-muted:#747991;
  --hair:rgba(168,180,255,0.14);
  --serif:'Fraunces', 'Iowan Old Style', 'Palatino Linotype', serif;
  --sans:'Space Grotesk', 'Helvetica Neue', Arial, sans-serif;
  --sp-1:6px; --sp-2:10px; --sp-3:16px; --sp-4:24px; --sp-5:40px; --sp-6:64px; --sp-7:96px; --sp-8:140px;
  --dur-fast:180ms; --dur-med:420ms; --dur-slow:900ms;
  --ease: cubic-bezier(.22,.61,.36,1);
  color-scheme: dark;
}
*{box-sizing:border-box;}
html,body{
  height:100%;
  margin:0;
  background:var(--navy-deep);
  color:var(--white);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
  overscroll-behavior-y:none;
}
html{scroll-padding-top:env(safe-area-inset-top,0px);}
body{
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
  overflow-x:hidden;
}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}
a{color:inherit; text-decoration:none;}
button{font-family:inherit; cursor:pointer;}
img{display:block; max-width:100%;}
::selection{background:var(--blue-electric); color:var(--white);}

/* ---------- Atmosphere ---------- */
#atmosphere{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(ellipse 60% 45% at 22% 18%, rgba(51,77,255,0.16), transparent 60%),
    radial-gradient(ellipse 55% 50% at 82% 78%, rgba(100,119,255,0.14), transparent 60%),
    radial-gradient(ellipse 80% 70% at 50% 50%, var(--navy-mid), var(--navy-deep) 75%);
}
#atmosphere::after{
  content:"";
  position:absolute; inset:0;
  background-image:radial-gradient(rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size:3px 3px;
  opacity:0.5;
  mix-blend-mode:overlay;
}
canvas#particles{
  position:fixed; inset:0; z-index:1; pointer-events:none; width:100%; height:100%;
}

/* ---------- Corner typography ---------- */
.corner-mark{
  position:fixed; z-index:5; font-family:var(--sans); font-size:11px; font-weight:600;
  letter-spacing:0.22em; color:var(--grey-muted); pointer-events:none; opacity:0.55;
  writing-mode:vertical-rl;
}
.corner-mark.tl{top:var(--sp-6); left:var(--sp-4);}
.corner-mark.br{bottom:var(--sp-6); right:var(--sp-4); transform:rotate(180deg);}
@media (max-width:760px){ .corner-mark{display:none;} }

/* ---------- Nav ---------- */
.navwrap{
  position:fixed; top:var(--sp-4); left:50%; transform:translateX(-50%);
  z-index:40; display:flex; align-items:center; gap:var(--sp-2);
}
.navpill{
  display:flex; align-items:center; gap:2px;
  background:rgba(8,11,39,0.62);
  border:1px solid var(--hair);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  border-radius:999px;
  padding:6px 6px 6px 18px;
  box-shadow:0 10px 30px rgba(0,0,0,0.35);
}
.brandmark{display:flex; align-items:center; gap:8px; margin-right:var(--sp-3);}
.brandmark img{width:30px; height:30px; border-radius:50%; display:block; flex-shrink:0;}
.brandmark span{font-family:var(--serif); font-weight:600; font-size:15px; letter-spacing:0.02em; color:var(--white); white-space:nowrap;}
@media (max-width:400px){ .brandmark span{display:none;} }
.navlink{
  font-size:12px; letter-spacing:0.12em; font-weight:500; text-transform:uppercase;
  color:var(--grey-muted); padding:9px 15px; border-radius:999px;
  transition:color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
  white-space:nowrap;
}
.navlink:hover{color:var(--white);}
.navlink.active{color:var(--white); background:rgba(168,180,255,0.09);}
.navlink.cta{
  color:var(--white); background:var(--blue-electric); margin-left:4px;
}
.navlink.cta:hover{background:var(--blue-glow);}
.navburger{display:none;}
#accountBtn.accountburger{
  display:flex; position:relative; width:38px; height:38px; border-radius:50%;
  background:rgba(8,11,39,0.62); border:1px solid var(--hair); backdrop-filter:blur(16px);
  align-items:center; justify-content:center; margin-left:8px;
  transition:border-color var(--dur-fast) var(--ease);
}
#accountBtn.accountburger:hover{border-color:var(--blue-light);}

/* ---------- Reveal (always visible — no scroll-gating, avoids any chance of stuck-hidden content) ---------- */
.reveal{opacity:1; transform:none;}
@media (max-width:820px){
  .navpill .navlink:not(.cta){display:none;}
  #accountBtn.accountburger{display:none;}
  .navburger{
    display:flex; align-items:center; justify-content:center;
    width:36px; height:36px; border-radius:999px; background:rgba(255,255,255,0.06);
    border:none; margin-right:2px;
  }
  .navburger span, .navburger::before, .navburger::after{content:""; display:block; position:absolute; width:16px; height:1.5px; background:var(--white);}
  .navburger{position:relative;}
  .navburger span{position:absolute; top:50%; transform:translateY(-50%);}
  .navburger::before{top:13px;} .navburger::after{bottom:13px;}
}
.mobile-menu{
  position:fixed; inset:0; z-index:60; background:rgba(8,11,39,0.98);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--sp-4);
  opacity:0; pointer-events:none; transition:opacity var(--dur-med) var(--ease);
}
.mobile-menu.open{opacity:1; pointer-events:auto;}
.mobile-menu a{font-family:var(--serif); font-size:32px; color:var(--white);}
.mobile-menu .mclose{position:absolute; top:calc(var(--sp-4) + env(safe-area-inset-top,0px)); right:var(--sp-4); font-size:14px; letter-spacing:0.15em; color:var(--grey-muted); background:none; border:none;}

/* ---------- Pages ---------- */
.page{display:none; position:relative; z-index:2;}
.page.active{display:block; animation:pageIn 560ms var(--ease);}
@keyframes pageIn{ from{opacity:0; transform:translateY(16px);} to{opacity:1; transform:translateY(0);} }

/* ---------- Hero ---------- */
.hero{
  position:relative; min-height:100svh; display:flex; flex-direction:column; justify-content:center;
  padding:calc(var(--sp-8) + env(safe-area-inset-top,0px)) var(--sp-4) var(--sp-6);
  perspective:1400px; overflow:hidden;
}
.hero-label{
  font-size:12px; letter-spacing:0.24em; text-transform:uppercase; color:var(--blue-light);
  font-weight:600; text-align:center; margin-bottom:var(--sp-3);
}
.hero-title{
  font-family:var(--serif); font-weight:500; text-align:center;
  font-size:clamp(48px, 9vw, 128px); line-height:0.98; letter-spacing:-0.01em;
  margin:0 auto var(--sp-4); max-width:16ch; color:var(--white);
}
.hero-title em{font-style:italic; color:var(--blue-light); font-weight:400;}
.hero-sub{
  text-align:center; max-width:46ch; margin:0 auto var(--sp-5); color:var(--grey-muted);
  font-size:15px; line-height:1.6;
}
.hero-actions{display:flex; align-items:center; justify-content:center; gap:var(--sp-4); margin-bottom:var(--sp-7); flex-wrap:wrap;}
.orb-cta{
  width:60px; height:60px; border-radius:50%; background:var(--white); color:var(--navy-deep);
  display:flex; align-items:center; justify-content:center; font-size:20px; border:none;
  transition:transform var(--dur-med) var(--ease), background var(--dur-fast) var(--ease);
  flex-shrink:0;
}
.orb-cta:hover{transform:scale(1.08); background:var(--blue-light);}
.orb-cta svg{transition:transform var(--dur-med) var(--ease);}
.orb-cta:hover svg{transform:translate(3px,-3px);}
.text-cta{font-size:13px; letter-spacing:0.1em; text-transform:uppercase; color:var(--white); border-bottom:1px solid var(--hair); padding-bottom:4px;}
.text-cta:hover{border-color:var(--white);}

.scene{
  position:relative; width:100%; max-width:1200px; margin:0 auto; height:min(58vw, 560px); min-height:320px;
  transform-style:preserve-3d; touch-action:pan-y;
}
.orbit-card{
  position:absolute; border-radius:6px; overflow:hidden; cursor:pointer;
  border:1px solid rgba(168,180,255,0.22);
  box-shadow:0 30px 60px -20px rgba(0,0,0,0.65), 0 0 0 1px rgba(255,255,255,0.02) inset;
  transition:transform var(--dur-med) var(--ease), box-shadow var(--dur-med) var(--ease);
  will-change:transform;
}
.orbit-card img{width:100%; height:100%; object-fit:cover; display:block;}
.orbit-card::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(8,11,39,0.62) 0%, rgba(8,11,39,0) 40%);
}
.orbit-card .oc-label{
  position:absolute; left:10px; top:8px; z-index:2; font-size:10px; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--white); opacity:0.92; font-weight:600;
}
.orbit-card:hover{box-shadow:0 40px 70px -18px rgba(51,77,255,0.35), 0 0 0 1px rgba(168,180,255,0.35) inset;}

.center-card{
  position:absolute; left:50%; top:50%;
  width:min(58%, 460px); aspect-ratio:4/5;
  transform:translate(-50%,-50%);
  border-radius:8px; overflow:hidden; z-index:5; cursor:pointer;
  box-shadow:0 50px 90px -20px rgba(0,0,0,0.75), 0 0 80px -10px rgba(100,119,255,0.25);
  border:1px solid rgba(168,180,255,0.3);
}
.center-card img{width:100%; height:100%; object-fit:cover;}
.center-card::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,11,39,0.68) 0%, rgba(8,11,39,0) 38%);}
.center-card .cc-meta{position:absolute; left:16px; top:14px; z-index:2;}
.cc-meta .n{font-size:11px; color:var(--blue-light); letter-spacing:0.16em; font-weight:600;}
.cc-meta .t{font-family:var(--serif); font-size:20px; margin-top:2px;}

.card-p1{width:19%; aspect-ratio:3/4; left:2%; top:14%; z-index:2;}
.card-p2{width:15%; aspect-ratio:3/4; left:16%; top:60%; z-index:3;}
.card-p3{width:17%; aspect-ratio:3/4; right:3%; top:10%; z-index:2;}
.card-p4{width:20%; aspect-ratio:3/4; right:13%; top:58%; z-index:3;}
.card-p5{width:13%; aspect-ratio:3/4; right:-1%; top:38%; z-index:1; opacity:0.85;}

@media (max-width:760px){
  .scene{height:420px;}
  .card-p1{width:26%; left:0; top:8%;}
  .card-p2{width:24%; left:8%; top:66%;}
  .card-p3{width:26%; right:0; top:6%;}
  .card-p4{width:26%; right:6%; top:64%;}
  .card-p5{display:none;}
  .center-card{width:56%;}
}

.scroll-cue{
  position:absolute; bottom:var(--sp-5); left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:10px; z-index:3;
}
.scroll-cue .mouse{width:20px; height:32px; border:1.5px solid var(--grey-muted); border-radius:12px; position:relative;}
.scroll-cue .mouse::after{
  content:""; position:absolute; top:6px; left:50%; transform:translateX(-50%);
  width:2.5px; height:6px; background:var(--blue-light); border-radius:2px;
  animation:scrolldrop 1.8s ease-in-out infinite;
}
@keyframes scrolldrop{ 0%{opacity:1; top:6px;} 70%{opacity:0; top:16px;} 100%{opacity:0; top:6px;} }
.scroll-cue span{font-size:10px; letter-spacing:0.2em; color:var(--grey-muted); text-transform:uppercase;}
.drag-hint{position:absolute; bottom:var(--sp-5); right:var(--sp-4); font-size:10px; letter-spacing:0.18em; color:var(--grey-muted); text-transform:uppercase; z-index:3;}
@media (max-width:900px){ .drag-hint{display:none;} }

/* ---------- Sections (home, below hero) ---------- */
.section{padding:var(--sp-7) var(--sp-4); position:relative;}
.section-inner{max-width:1280px; margin:0 auto;}
.eyebrow{font-size:11px; letter-spacing:0.2em; text-transform:uppercase; color:var(--blue-light); font-weight:600; margin-bottom:var(--sp-3);}
.section-head{display:flex; align-items:flex-end; justify-content:space-between; gap:var(--sp-4); margin-bottom:var(--sp-6); flex-wrap:wrap;}
.section-title{font-family:var(--serif); font-weight:500; font-size:clamp(30px,4vw,52px); line-height:1.05; max-width:14ch;}
.section-link{font-size:12px; letter-spacing:0.1em; text-transform:uppercase; border-bottom:1px solid var(--hair); padding-bottom:4px; white-space:nowrap;}
.section-link:hover{border-color:var(--white);}
.rule{height:1px; background:var(--hair); border:none; margin:0;}

/* Statement */
.statement{
  font-family:var(--serif); font-weight:400; font-size:clamp(26px, 4.4vw, 56px);
  line-height:1.2; max-width:20ch; color:var(--white);
}
.statement .muted{color:var(--grey-muted);}

/* Services list (home teaser + full page) */
.service-row{
  display:grid; grid-template-columns:60px 1fr auto; align-items:center; gap:var(--sp-4);
  padding:var(--sp-5) 0; border-top:1px solid var(--hair);
  transition:background var(--dur-fast) var(--ease);
}
.service-list .service-row:last-child{border-bottom:1px solid var(--hair);}
.service-row:hover{background:rgba(168,180,255,0.04);}
.service-num{font-family:var(--sans); font-size:13px; color:var(--grey-muted); font-weight:600;}
.service-name{font-family:var(--serif); font-size:clamp(22px,3vw,36px); font-weight:500;}
.service-desc{font-size:13px; color:var(--grey-muted); margin-top:6px; max-width:52ch; font-weight:400;}
.service-arrow{
  width:40px; height:40px; border-radius:50%; border:1px solid var(--hair);
  display:flex; align-items:center; justify-content:center; transition:transform var(--dur-med) var(--ease), border-color var(--dur-fast) var(--ease);
}
.service-row:hover .service-arrow{transform:translate(4px,-4px); border-color:var(--blue-light);}
@media (max-width:640px){
  .service-row{grid-template-columns:36px 1fr auto;}
}

/* Home project teaser strip */
.teaser-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:var(--sp-3);}
.teaser-item{position:relative; border-radius:6px; overflow:hidden; aspect-ratio:4/5; border:1px solid var(--hair);}
.teaser-item.wide{aspect-ratio:16/11;}
.teaser-item img{width:100%; height:100%; object-fit:cover; transition:transform var(--dur-slow) var(--ease);}
.teaser-item:hover img{transform:scale(1.045);}
.teaser-item .ti-tag{position:absolute; left:14px; top:12px; z-index:2; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; font-weight:600;}
.teaser-item::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,11,39,0.6) 0%, rgba(8,11,39,0) 42%);}
@media (max-width:760px){ .teaser-grid{grid-template-columns:1fr 1fr;} .teaser-item.wide{grid-column:1/3;} }

/* Full-bleed image band */
.band{width:100%; aspect-ratio:16/7; overflow:hidden; position:relative;}
.band img{width:100%; height:100%; object-fit:cover;}
.band::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,11,39,0.55) 0%, rgba(8,11,39,0) 35%); pointer-events:none;}
.band-caption{position:absolute; left:var(--sp-4); top:var(--sp-4); z-index:2; font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--blue-light); font-weight:600;}
@media (max-width:760px){ .band{aspect-ratio:4/5;} }

/* Testimonial / rating */
.rating-block{display:flex; gap:var(--sp-5); align-items:flex-start; flex-wrap:wrap;}
.rating-num{font-family:var(--serif); font-size:clamp(60px,9vw,110px); line-height:1; color:var(--white);}
.rating-meta{padding-top:12px;}
.stars{color:var(--blue-light); letter-spacing:3px; font-size:15px; margin-bottom:6px;}
.rating-meta p{color:var(--grey-muted); font-size:13px; max-width:44ch; line-height:1.6; margin:0;}
.quote{font-family:var(--serif); font-style:italic; font-size:clamp(18px,2.4vw,26px); line-height:1.5; max-width:34ch; color:var(--blue-light);}

/* CTA band */
.cta-band{
  background:var(--navy-panel); border-radius:10px; padding:var(--sp-7) var(--sp-5);
  text-align:center; border:1px solid var(--hair);
}
.cta-band h3{font-family:var(--serif); font-weight:500; font-size:clamp(28px,5vw,60px); margin:0 0 var(--sp-4);}
.btn{
  display:inline-flex; align-items:center; gap:10px; padding:15px 28px; border-radius:3px;
  font-size:12px; letter-spacing:0.12em; text-transform:uppercase; font-weight:600;
  border:1px solid var(--white); transition:background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.btn.solid{background:var(--white); color:var(--navy-deep);}
.btn.solid:hover{background:var(--blue-light); border-color:var(--blue-light);}
.btn.ghost{background:transparent; color:var(--white);}
.btn.ghost:hover{background:rgba(255,255,255,0.08);}
.btn.accent{background:var(--blue-electric); border-color:var(--blue-electric); color:var(--white);}
.btn.accent:hover{background:var(--blue-glow); border-color:var(--blue-glow);}

/* ---------- Projects page ---------- */
.page-hero-title{
  padding:calc(var(--sp-8) + env(safe-area-inset-top,0px)) var(--sp-4) var(--sp-5); max-width:1280px; margin:0 auto;
}
.page-hero-title .eyebrow{margin-bottom:var(--sp-3);}
.page-hero-title h1{font-family:var(--serif); font-weight:500; font-size:clamp(38px,6vw,86px); max-width:16ch; line-height:1.02;}
.page-hero-title p{color:var(--grey-muted); max-width:56ch; margin-top:var(--sp-3); font-size:15px; line-height:1.6;}

.project-index{max-width:1280px; margin:0 auto; padding:0 var(--sp-4) var(--sp-7);}
.project-row{
  display:grid; grid-template-columns:70px 1fr 340px; gap:var(--sp-5); align-items:center;
  padding:var(--sp-6) 0; border-top:1px solid var(--hair); cursor:pointer;
}
.project-index .project-row:last-child{border-bottom:1px solid var(--hair);}
.project-row:hover .project-thumb img{transform:scale(1.05);}
.project-row:hover .project-title{color:var(--blue-light);}
.pr-num{font-size:13px; color:var(--grey-muted); font-weight:600;}
.pr-info .project-title{font-family:var(--serif); font-size:clamp(24px,3.4vw,44px); font-weight:500; transition:color var(--dur-fast) var(--ease);}
.pr-meta{display:flex; gap:var(--sp-3); flex-wrap:wrap; margin-top:10px;}
.pr-meta span{font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--grey-muted);}
.pr-meta span:not(:last-child)::after{content:"/"; margin-left:var(--sp-3); color:var(--hair);}
.project-thumb{border-radius:6px; overflow:hidden; aspect-ratio:16/10; position:relative; border:1px solid var(--hair);}
.project-thumb img{width:100%; height:100%; object-fit:cover; transition:transform var(--dur-slow) var(--ease);}
.pr-view{display:flex; align-items:center; gap:8px; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--white); margin-top:14px; opacity:0.8;}
@media (max-width:900px){
  .project-row{grid-template-columns:1fr; gap:var(--sp-3);}
  .project-thumb{order:-1; aspect-ratio:16/11;}
  .pr-num{display:none;}
}

/* ---------- Project detail overlay ---------- */
.detail-overlay{
  position:fixed; inset:0; z-index:80; background:var(--navy-deep);
  overflow-y:auto; -webkit-overflow-scrolling:touch;
  opacity:0; pointer-events:none; transform:translateY(16px);
  transition:opacity var(--dur-med) var(--ease), transform var(--dur-med) var(--ease);
}
.detail-overlay.open{opacity:1; pointer-events:auto; transform:translateY(0);}
.detail-close{
  position:fixed; top:calc(var(--sp-4) + env(safe-area-inset-top,0px)); right:var(--sp-4); z-index:85;
  width:42px; height:42px; border-radius:50%; background:rgba(8,11,39,0.7); border:1px solid var(--hair);
  color:var(--white); font-size:16px; display:flex; align-items:center; justify-content:center;
  backdrop-filter:blur(10px);
}
.detail-hero{position:relative; width:100%; aspect-ratio:16/9; max-height:78vh; overflow:hidden;}
.detail-hero img{width:100%; height:100%; object-fit:cover;}
.detail-hero::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,11,39,0.78) 0%, rgba(8,11,39,0.05) 42%, rgba(8,11,39,0.5) 100%);}
.detail-hero .dh-info{position:absolute; left:var(--sp-4); top:calc(var(--sp-6) + env(safe-area-inset-top,0px)); right:var(--sp-4); z-index:2; max-width:1280px; margin:0 auto;}
.detail-hero .dh-num{font-size:12px; letter-spacing:0.18em; color:var(--blue-light); font-weight:600;}
.detail-hero h2{font-family:var(--serif); font-weight:500; font-size:clamp(32px,6vw,80px); margin:8px 0 0;}
.detail-body{max-width:1280px; margin:0 auto; padding:var(--sp-6) var(--sp-4) var(--sp-8);}
.detail-meta-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:var(--sp-4); padding:var(--sp-5) 0; border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); margin-bottom:var(--sp-6);}
.dm-label{font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:var(--grey-muted); margin-bottom:6px;}
.dm-value{font-size:15px; font-weight:500;}
.detail-desc{max-width:62ch; color:var(--grey-muted); font-size:15px; line-height:1.75; margin-bottom:var(--sp-6);}
.detail-gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-3);}
.detail-gallery .dg-item{border-radius:6px; overflow:hidden; aspect-ratio:4/5; border:1px solid var(--hair);}
.detail-gallery .dg-item.tall{aspect-ratio:3/4.4;}
.detail-gallery img{width:100%; height:100%; object-fit:cover;}
@media (max-width:700px){
  .detail-gallery{grid-template-columns:1fr 1fr;}
  .detail-hero .dh-info{right:calc(var(--sp-4) + 54px);}
}

/* ---------- About ---------- */
.about-grid{display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-7); align-items:start;}
.about-photo{border-radius:8px; overflow:hidden; aspect-ratio:4/5; border:1px solid var(--hair);}
.about-photo img{width:100%; height:100%; object-fit:cover;}
.stat-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-4); margin-top:var(--sp-6); padding-top:var(--sp-5); border-top:1px solid var(--hair);}
.stat-num{font-family:var(--serif); font-size:clamp(28px,3.6vw,46px);}
.stat-label{font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--grey-muted); margin-top:6px;}
@media (max-width:840px){ .about-grid{grid-template-columns:1fr;} .stat-grid{grid-template-columns:1fr 1fr;} }

/* ---------- Contact ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-8);}
.contact-info h1{font-family:var(--serif); font-weight:500; font-size:clamp(38px,5.6vw,72px); max-width:12ch; line-height:1.02; margin-bottom:var(--sp-4);}
.contact-info p.lede{color:var(--grey-muted); max-width:44ch; margin-bottom:var(--sp-6); line-height:1.6; font-size:15px;}
.contact-line{display:flex; align-items:center; gap:var(--sp-3); padding:var(--sp-3) 0; border-top:1px solid var(--hair);}
.contact-info .contact-line:last-of-type{border-bottom:1px solid var(--hair);}
.cl-icon{width:34px; height:34px; border-radius:50%; border:1px solid var(--hair); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.cl-text .cl-label{font-size:10px; letter-spacing:0.12em; text-transform:uppercase; color:var(--grey-muted);}
.cl-text .cl-value{font-size:15px; margin-top:2px;}
.quick-links{display:flex; gap:var(--sp-3); margin-top:var(--sp-5); flex-wrap:wrap;}

.form-panel{background:var(--navy-panel); border:1px solid var(--hair); border-radius:10px; padding:var(--sp-6);}
.form-panel h3{font-family:var(--serif); font-weight:500; font-size:24px; margin:0 0 var(--sp-2);}
.form-panel .fp-sub{color:var(--grey-muted); font-size:13px; margin-bottom:var(--sp-5);}
.field{margin-bottom:var(--sp-4);}
.field label{display:block; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--grey-muted); margin-bottom:8px;}
.field input, .field select, .field textarea{
  width:100%; background:transparent; border:none; border-bottom:1px solid var(--hair);
  color:var(--white); font-family:var(--sans); font-size:15px; padding:10px 2px; outline:none;
  transition:border-color var(--dur-fast) var(--ease);
}
.field select{appearance:none; -webkit-appearance:none;}
.field select option{background:var(--navy-mid); color:var(--white);}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--blue-light);}
.field textarea{resize:vertical; min-height:80px;}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-3);}
.form-note{font-size:12px; color:var(--grey-muted); margin-top:var(--sp-3); line-height:1.6;}
.form-success{display:none; padding:var(--sp-4); border:1px solid var(--blue-light); border-radius:6px; margin-top:var(--sp-4); font-size:13px; color:var(--blue-light);}
.form-success.show{display:block;}
@media (max-width:840px){ .contact-grid{grid-template-columns:1fr;} .field-row{grid-template-columns:1fr;} }

/* map link block */
.map-block{margin-top:var(--sp-6); border-top:1px solid var(--hair); padding-top:var(--sp-5);}
.map-block a{display:inline-flex; align-items:center; gap:8px; font-size:12px; letter-spacing:0.1em; text-transform:uppercase; border-bottom:1px solid var(--hair); padding-bottom:4px;}
.map-block a:hover{border-color:var(--white);}

/* ---------- Footer ---------- */
footer{border-top:1px solid var(--hair); padding:var(--sp-7) var(--sp-4) var(--sp-5); position:relative; z-index:2;}
.footer-inner{max-width:1280px; margin:0 auto;}
.footer-top{display:flex; justify-content:space-between; align-items:center; gap:var(--sp-5); flex-wrap:wrap; margin-bottom:var(--sp-6);}
.footer-brand{display:flex; align-items:center; gap:18px;}
.footer-brand img{width:84px; height:84px; border-radius:50%; flex-shrink:0;}
.footer-brand .fb-word{font-family:var(--serif); font-size:clamp(26px,4vw,44px); line-height:1.05;}
.footer-brand .fb-tagline{font-family:var(--serif); font-style:italic; font-size:14px; color:var(--grey-muted); margin-top:4px;}
@media (max-width:500px){ .footer-brand img{width:64px; height:64px;} }
.footer-links{display:flex; gap:var(--sp-5); flex-wrap:wrap;}
.footer-links a{font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--grey-muted);}
.footer-links a:hover{color:var(--white);}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; gap:var(--sp-3); flex-wrap:wrap; padding-top:var(--sp-4); border-top:1px solid var(--hair); font-size:11px; color:var(--grey-muted); letter-spacing:0.04em;}
.footer-bottom .fb-right{display:flex; gap:var(--sp-4);}

/* ---------- Bottom-left quick contact / bottom-right info (home only) ---------- */
.floating-ui{position:fixed; z-index:30; display:flex; align-items:center; gap:10px; bottom:var(--sp-4);}
.floating-ui.left{left:var(--sp-4);}
.floating-ui.right{right:var(--sp-4); flex-direction:row-reverse;}
.fui-circle{
  width:38px; height:38px; border-radius:50%; border:1px solid var(--hair); background:rgba(8,11,39,0.5);
  display:flex; align-items:center; justify-content:center; backdrop-filter:blur(10px);
  transition:border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
}
.fui-circle:hover{border-color:var(--blue-light); transform:translateY(-2px);}
.fui-text{font-size:10px; color:var(--grey-muted); letter-spacing:0.08em;}
.floating-ui{transition:opacity var(--dur-med) var(--ease), transform var(--dur-med) var(--ease);}
.floating-ui.hide{opacity:0; transform:translateY(8px); pointer-events:none;}
@media (max-width:900px){ .floating-ui{display:none;} }

/* ---------- Gallery ---------- */
.gallery-grid{columns:4 220px; column-gap:var(--sp-3);}
.gallery-item{break-inside:avoid; margin-bottom:var(--sp-3); border-radius:6px; overflow:hidden; border:1px solid var(--hair); cursor:zoom-in; position:relative;}
.gallery-item img{width:100%; display:block; transition:transform var(--dur-slow) var(--ease);}
.gallery-item:hover img{transform:scale(1.04);}
.gallery-filters{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:var(--sp-6);}
.gfilter{font-size:11px; letter-spacing:0.1em; text-transform:uppercase; padding:9px 16px; border-radius:999px; border:1px solid var(--hair); color:var(--grey-muted);}
.gfilter.active{color:var(--white); border-color:var(--blue-light); background:rgba(168,180,255,0.08);}
@media (max-width:700px){ .gallery-grid{columns:2 120px; column-gap:10px;} }

.lightbox{position:fixed; inset:0; z-index:90; background:rgba(5,7,26,0.94); display:flex; align-items:center; justify-content:center; padding:var(--sp-5); opacity:0; pointer-events:none; transition:opacity var(--dur-med) var(--ease);}
.lightbox.open{opacity:1; pointer-events:auto;}
.lightbox img{max-width:100%; max-height:88vh; border-radius:4px; box-shadow:0 40px 100px rgba(0,0,0,0.6);}
.lightbox-close{position:fixed; top:calc(var(--sp-4) + env(safe-area-inset-top,0px)); right:var(--sp-4); width:42px; height:42px; border-radius:50%; background:rgba(8,11,39,0.7); border:1px solid var(--hair); color:var(--white); display:flex; align-items:center; justify-content:center; z-index:91;}

/* ---------- Account ---------- */
.account-wrap{max-width:480px; margin:0 auto; padding:var(--sp-4);}
.tab-switch{display:flex; border:1px solid var(--hair); border-radius:999px; padding:4px; margin-bottom:var(--sp-6);}
.tab-btn{flex:1; text-align:center; padding:10px; font-size:12px; letter-spacing:0.1em; text-transform:uppercase; border-radius:999px; color:var(--grey-muted); border:none; background:none;}
.tab-btn.active{background:var(--blue-electric); color:var(--white);}
.auth-form{display:none;}
.auth-form.active{display:block;}
.account-note{font-size:12px; color:var(--grey-muted); line-height:1.6; background:var(--navy-panel); border:1px solid var(--hair); border-radius:8px; padding:var(--sp-4); margin-bottom:var(--sp-6);}
.account-panel{background:var(--navy-panel); border:1px solid var(--hair); border-radius:10px; padding:var(--sp-6); text-align:center;}
.account-avatar{width:64px; height:64px; border-radius:50%; background:var(--blue-electric); display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-size:26px; margin:0 auto var(--sp-4);}
.form-error{color:#FF8FA3; font-size:12px; margin-top:-6px; margin-bottom:var(--sp-3); display:none;}
.form-error.show{display:block;}

/* ---------- Footer social ---------- */
.footer-social{display:flex; gap:10px;}
.social-circle{width:36px; height:36px; border-radius:50%; border:1px solid var(--hair); display:flex; align-items:center; justify-content:center; transition:border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);}
.social-circle:hover{border-color:var(--blue-light); transform:translateY(-2px);}