
:root{
  --ink:#e6f1ff;
  --muted:#88a0b5;
  --line:rgba(255,255,255,.1);
  --bg:#040e14;
  --panel:rgba(255,255,255,.03);
  --panel-strong:rgba(255,255,255,.08);
  --brand:#00e5ff;
  --brand-dark:#00b8cc;
  --accent:#00ffaa;
  --shadow:0 30px 60px rgba(0,0,0,.5);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,Arial,Helvetica,sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.6;
}
a{color:var(--brand);text-decoration:none;transition:all .2s ease;}
a:hover{color:#fff;text-shadow:0 0 10px rgba(0,229,255,.5);}
img{max-width:100%;display:block;border-radius:24px;}
.wrap{width:min(1280px,calc(100vw - 64px));margin:auto}

/* Typography */
h1, h2 {
  font-family: "Georgia", "Times New Roman", serif;
  font-weight: 400;
}
h1 {
  font-size: clamp(48px, 6vw, 84px);
  line-height: 1.05;
  margin: 0 0 24px;
  color: #fff;
  letter-spacing: -1px;
}
h2 {
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.15;
  margin: 0 0 24px;
  color: #fff;
}
h3 { margin: 0 0 12px; font-weight: 700; font-size: 18px; color: #fff; text-transform: uppercase; letter-spacing: 1px; }
p { margin-top: 0; }
.lead { font-size: clamp(18px, 2vw, 22px); line-height: 1.6; color: rgba(255,255,255,.8); font-weight: 300; margin: 0; }
.hero-note{margin:18px 0 0;color:rgba(230,241,255,.72);max-width:620px;font-size:16px;}

/* Header - FIXED FOR WRAPPING */
.site-header{
  position:sticky;
  top:24px;
  z-index:50;
  display:flex;
  align-items:center;
  gap:16px;
  width:min(1200px,calc(100vw - 48px)); /* Made wider */
  margin:0 auto;
  padding:12px 24px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.15);
  border-top:1px solid rgba(255,255,255,.3);
  border-radius:999px;
  box-shadow:0 12px 40px rgba(0,0,0,.4);
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
}
.logo{display:grid;grid-template-columns:38px auto;grid-template-rows:auto auto;align-items:center;column-gap:10px;font-weight:900;color:#fff;}
.logo img{width:38px;height:38px;border-radius:10px;box-shadow:0 8px 16px rgba(0,229,255,.2);}
.logo span{line-height:1.05;font-size:16px;letter-spacing:1px;text-transform:uppercase;font-weight:500;}
.logo small{grid-column:2;font-size:10px;line-height:1.1;color:var(--brand);font-weight:800;letter-spacing:1px;}
.main-nav{display:flex;gap:20px;align-items:center;justify-content:center;flex:1}
.main-nav a{font-size:13px;font-weight:500;color:rgba(255,255,255,.7);white-space:nowrap;} /* Prevent wrapping */
.main-nav a:hover{color:#fff;}
.header-cta{display:flex;gap:12px;align-items:center}
.nav-toggle,.menu-button{display:none}

/* Buttons - FIXED GHOST AND PRIMARY */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:44px;
  padding:10px 20px;
  border-radius:999px;
  font-weight:700;
  background:transparent;
  border:1px solid var(--brand);
  color:var(--brand);
  transition:all .25s ease;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.btn:hover{
  background:rgba(0,229,255,.1);
  box-shadow:0 0 20px rgba(0,229,255,.3);
}
.btn.primary{
  background:var(--brand);
  border:none;
  color:#000;
  box-shadow:0 8px 20px rgba(0,229,255,.3);
}
.btn.primary:hover{
  background:#fff;
  color:#000;
  box-shadow:0 12px 30px rgba(255,255,255,.4);
}
.btn.ghost{
  border-color: rgba(255,255,255,.2);
  color: #fff;
}
.btn.ghost:hover{
  background: rgba(255,255,255,.1);
  border-color: #fff;
  box-shadow: none;
}

.breadcrumbs{position:relative;z-index:2;width:min(1280px,calc(100vw - 64px));margin:28px auto -40px;display:flex;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:13px;}
.breadcrumbs a{color:#fff;}

/* Hero Section */
.hero{
  position:relative;
  min-height:920px;
  display:flex;
  align-items:center;
  overflow:hidden;
  margin-top:-106px;
  padding:160px 0 100px;
  background:var(--bg);
}
.hero-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:brightness(0.6) contrast(1.1) saturate(0.8);
  transform:scale(1.05);
  animation:heroZoom 25s ease-out forwards;
}
@keyframes heroZoom { 100% { transform:scale(1); } }
.hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(4,14,20,.9) 0%, rgba(4,14,20,.4) 50%, rgba(4,14,20,.2) 100%),
             linear-gradient(180deg, rgba(4,14,20,.3), rgba(4,14,20,1) 95%);
}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.hero-copy{max-width:600px;}
.hero .cta-row{margin-top:40px;}

/* 2x2 Dark Glass Grid */
.hero-visual{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}
.hero-card{
  min-height:260px;
  padding:36px 24px;
  border-radius:24px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.1);
  border-top:1px solid rgba(255,255,255,.3);
  box-shadow:0 24px 60px rgba(0,0,0,.4), inset 0 0 40px rgba(255,255,255,.02);
  backdrop-filter:blur(30px);
  -webkit-backdrop-filter:blur(30px);
  transition:all .4s ease;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
.hero-card:hover{
  transform:translateY(-8px);
  border-color:rgba(255,255,255,.4);
  background:rgba(255,255,255,.06);
  box-shadow:0 34px 70px rgba(0,0,0,.6), inset 0 0 60px rgba(0,229,255,.05);
}
.hero-icon{
  width:64px;height:64px;
  margin-bottom:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
}
.hero-icon svg { width:100%; height:100%; filter: drop-shadow(0 0 10px rgba(255,255,255,.4)); }
.hero-card h3{
  font-family:Inter,sans-serif;
  font-size:15px;
  letter-spacing:1px;
}
.hero-card p{color:var(--muted);margin:0;font-size:14px;line-height:1.5;font-weight:400;}

/* Other sections using the dark theme */
.section{position:relative;padding:120px 0;background:var(--bg);}
.section.alt{background:linear-gradient(180deg, rgba(255,255,255,.02), var(--bg));}
.section-head{text-align:center;max-width:880px;margin:0 auto 64px}
.eyebrow{display:inline-block;text-transform:uppercase;font-size:12px;font-weight:700;letter-spacing:2px;color:var(--brand);margin-bottom:16px;}
.section-head p{color:var(--muted);font-size:20px;}

.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.card,.location-card,.contact-panel,.answer-grid article{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:24px;
  padding:36px;
  transition:all .3s ease;
}
.card:hover,.location-card:hover,.answer-grid article:hover{
  transform:translateY(-4px);
  border-color:rgba(255,255,255,.2);
  background:var(--panel-strong);
}
.card-icon{width:48px;height:48px;margin-bottom:24px;display:grid;place-items:center;border-radius:12px;background:rgba(0,229,255,.1);color:var(--brand);font-weight:900;font-size:18px;}
.card p,.location-card span,.answer-grid p{color:var(--muted);font-size:15px;line-height:1.6;}
.card a{display:inline-block;margin-top:20px;font-weight:700;color:var(--brand);font-size:14px;text-transform:uppercase;letter-spacing:1px;}

.link-cloud{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0 36px}
.link-cloud a{border:1px solid var(--line);border-radius:999px;padding:12px 20px;background:var(--panel);color:#fff;font-size:14px;transition:all .2s ease;}
.link-cloud a:hover{background:var(--brand);color:#000;border-color:var(--brand);}

.location-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}

.steps{counter-reset:step;display:grid;gap:16px;padding:0;margin:24px 0;list-style:none}
.steps li{position:relative;padding:24px 24px 24px 64px;border:1px solid var(--line);border-radius:16px;background:var(--panel);font-size:16px;}
.steps li:before{counter-increment:step;content:counter(step);position:absolute;left:20px;top:24px;width:28px;height:28px;border-radius:50%;background:var(--brand);color:#000;display:grid;place-items:center;font-weight:800;font-size:14px;}

.process-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
.process-grid article{text-align:center;padding:32px 20px;border-radius:24px;background:var(--panel);border:1px solid var(--line);}
.process-grid span{width:64px;height:64px;margin:0 auto 20px;display:grid;place-items:center;border-radius:50%;background:rgba(0,229,255,.1);color:var(--brand);font-size:24px;font-weight:900;}
.process-grid p{color:var(--muted);font-size:14px;}
.center-cta{display:flex;justify-content:center;margin-top:48px}

.gallery-grid{columns:4 280px;column-gap:24px}
.gallery-grid figure{break-inside:avoid;margin:0 0 24px;border-radius:16px;overflow:hidden;}
.gallery-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:16px;}
.gallery-grid figcaption{padding:12px 0;font-size:14px;color:var(--muted);}

.visual-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.visual-grid article{border-radius:24px;background:var(--panel);border:1px solid var(--line);overflow:hidden;}
.visual-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:0;}
.visual-grid div{padding:24px}
.visual-grid p{color:var(--muted);font-size:14px;}

.safety-list{display:grid;gap:16px}
.safety-list p{padding:20px;margin:0;border-radius:16px;background:var(--panel);border:1px solid var(--line);font-size:15px;}
.answer-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}

.faq-list{display:grid;gap:16px;max-width:980px;margin:auto}
details{border:1px solid var(--line);border-radius:16px;background:var(--panel);}
summary{padding:24px;font-weight:700;font-size:18px;color:#fff;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;}
summary::-webkit-details-marker{display:none}
summary:after{content:"+";font-size:24px;color:var(--brand);}
details[open] summary:after{content:"-";}
details p{padding:0 24px 24px;margin:0;color:var(--muted);}

.cta-band{padding:100px 0;background:linear-gradient(180deg, var(--bg), #02080a);}
.cta-panel{border-radius:32px;background:rgba(0,229,255,.05);border:1px solid rgba(0,229,255,.2);padding:80px 40px;text-align:center;}
.cta-panel h2{font-size:42px;}
.cta-panel p{max-width:600px;margin:0 auto;color:var(--muted);font-size:18px;}
.cta-panel .cta-row{justify-content:center;margin-top:40px;}

.site-footer{background:#020608;color:var(--muted);padding:80px 0 60px;border-top:1px solid var(--line);}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;}
.site-footer a{display:block;color:var(--muted);margin:8px 0;font-size:14px;}
.site-footer a:hover{color:#fff;}
.site-footer h2{font-size:14px;text-transform:uppercase;letter-spacing:1px;color:#fff;margin-bottom:24px;}
.footer-logo{display:grid;margin-bottom:24px;width:max-content}
.footer-actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}
.footer-address{font-size:14px;}
.footer-bottom{display:flex;justify-content:space-between;margin-top:60px;padding-top:24px;border-top:1px solid var(--line);font-size:13px;}
.mobile-bar{display:none}

@media(max-width:1180px){
  .site-header{flex-wrap:wrap;border-radius:28px}
  .menu-button{display:inline-flex;margin-left:auto}
  .main-nav{display:none;width:100%;order:4;flex-direction:column;align-items:flex-start;padding:16px 0}
  .nav-toggle:checked~.main-nav{display:flex}
  .header-cta{display:none}
  .hero-grid{grid-template-columns:1fr;gap:40px;}
  .card-grid,.location-grid,.process-grid,.visual-grid,.answer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .wrap,.breadcrumbs{width:min(100% - 32px,1280px)}
  .site-header{top:12px;padding:12px 16px;}
  .logo span{font-size:16px}
  .menu-button{display:inline-flex;margin-left:auto;}
  .main-nav{display:none;width:100%;order:4;flex-direction:column;align-items:flex-start;padding:16px 0}
  .nav-toggle:checked~.main-nav{display:flex}
  .hero{padding:120px 0 60px}
  h1{font-size:40px}
  .hero-visual{grid-template-columns:1fr;}
  .section{padding:80px 0}
  .card-grid,.location-grid,.process-grid,.visual-grid,.footer-grid,.split,.answer-grid{grid-template-columns:1fr}
  .gallery-grid{columns:1}
  .mobile-bar{position:fixed;display:grid;grid-template-columns:1fr 1fr;gap:8px;left:0;right:0;bottom:0;z-index:60;background:#040e14;border-top:1px solid var(--line);padding:12px 16px 24px;}
  body{padding-bottom:90px}
}
