:root{
  --bg: #0b0f14;
  --surface: #0f1620;
  --surface-2: #121b26;
  --card: rgba(255,255,255,.06);
  --card-2: rgba(255,255,255,.08);
  --border: rgba(255,255,255,.14);
  --text: rgba(255,255,255,.9);
  --muted: rgba(255,255,255,.68);
  --soft: rgba(255,255,255,.08);
  --gold: #c9a85c;
  --gold-2: #b89042;
  --ok: #44d19d;
  --danger: #ff5c5c;
  --shadow: 0 18px 60px rgba(0,0,0,.55);
  --shadow-soft: 0 10px 30px rgba(0,0,0,.35);
  --radius: 16px;
  --radius-sm: 12px;
  --radius-xs: 10px;
  --container: 1180px;
  --gutter: 24px;
  --h1: clamp(2.3rem, 3.6vw, 3.5rem);
  --h2: clamp(1.7rem, 2.5vw, 2.3rem);
  --h3: 1.25rem;
  --p: 1.02rem;
  --tracking: .02em;
  --ease: cubic-bezier(.2,.8,.2,1);
}

*{box-sizing:border-box}
html{color-scheme:dark;scroll-behavior:smooth}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: radial-gradient(1200px 900px at 10% -10%, rgba(201,168,92,.24), transparent 55%),
              radial-gradient(900px 700px at 95% 10%, rgba(255,255,255,.10), transparent 55%),
              linear-gradient(180deg, #070a0d 0%, var(--bg) 35%, #070a0d 100%);
  color: var(--text);
  line-height: 1.6;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}

.container{max-width:var(--container);margin:0 auto;padding:0 var(--gutter)}
.section{padding:84px 0}
.section.tight{padding:56px 0}
.section-header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:34px}
.kicker{
  font-size:.84rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color: var(--muted);
}
.title{
  font-family: Fraunces, ui-serif, Georgia, serif;
  letter-spacing: -.02em;
  margin: 10px 0 0;
}
.title.h1{font-size:var(--h1);line-height:1.08}
.title.h2{font-size:var(--h2);line-height:1.15}
.subtitle{margin:14px 0 0;color:var(--muted);font-size:var(--p);max-width:62ch}
.stack{display:flex;flex-direction:column}
.muted{color:var(--muted)}
.sr-only{
  position:absolute;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border-radius: 999px;
  padding: 12px 18px;
  font-weight: 650;
  letter-spacing: .02em;
  border: 1px solid transparent;
  transition: transform .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease), color .18s var(--ease), box-shadow .18s var(--ease);
  cursor:pointer;
  user-select:none;
  white-space:nowrap;
}
.btn:focus-visible{outline:3px solid rgba(201,168,92,.35);outline-offset:3px}
.btn-primary{
  background: linear-gradient(180deg, rgba(201,168,92,1) 0%, rgba(184,144,66,1) 100%);
  color: #0b0f14;
  box-shadow: 0 12px 30px rgba(201,168,92,.18);
}
.btn-primary:hover{transform:translateY(-1px);box-shadow: 0 16px 40px rgba(201,168,92,.24)}
.btn-ghost{
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.14);
}
.btn-ghost:hover{background: rgba(255,255,255,.09);transform:translateY(-1px)}
.btn-link{
  padding: 10px 0;
  border-radius: 10px;
  background: transparent;
  border-color: transparent;
  color: rgba(201,168,92,.95);
}
.btn-link:hover{color: rgba(201,168,92,1)}

.pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  color: var(--muted);
  font-size: .92rem;
}
.pill strong{color:var(--text);font-weight:650}

.grid{display:grid;gap:18px}
.grid.cols-2{grid-template-columns:repeat(2, minmax(0,1fr))}
.grid.cols-3{grid-template-columns:repeat(3, minmax(0,1fr))}
.grid.cols-4{grid-template-columns:repeat(4, minmax(0,1fr))}

.card{
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(255,255,255,.07) 0%, rgba(255,255,255,.04) 100%);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: var(--shadow-soft);
}
.card.pad{padding:22px}
.card.soft{
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.12);
  box-shadow: none;
}
.card.hover{transition: transform .2s var(--ease), border-color .2s var(--ease), background .2s var(--ease)}
.card.hover:hover{transform:translateY(-2px);border-color: rgba(201,168,92,.35);background: rgba(255,255,255,.07)}

.icon{
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: rgba(201,168,92,.12);
  border: 1px solid rgba(201,168,92,.25);
  color: rgba(201,168,92,.95);
}

/* Email fix: break long words */
.card.pad.soft div[style*="font-weight: 750"] {
  word-break: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
}

/* Quote Box Fix */
.quote p {
  word-break: break-word;
  overflow-wrap: break-word;
}

.topbar{
  position:sticky;
  top:0;
  z-index:50;
  backdrop-filter: blur(14px);
  background: rgba(7,10,13,.72);
  border-bottom: 1px solid rgba(255,255,255,.10);
}
.topbar-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 18px;
  height: 72px;
}
.brand{
  display:block;
  width: 180px;
}
.brand img{
  height: 42px;
  width: 180px;
  object-fit: contain;
  display: block;
}

.nav{
  display:flex;
  align-items:center;
  gap: 18px;
}
.nav a{
  display:inline-flex;
  padding: 10px 10px;
  border-radius: 12px;
  color: rgba(255,255,255,.82);
  font-weight: 560;
  letter-spacing: .01em;
}
.nav a:hover{background: rgba(255,255,255,.06);color: rgba(255,255,255,.92)}
.nav a[aria-current="page"]{background: rgba(201,168,92,.12);color: rgba(201,168,92,.95);border: 1px solid rgba(201,168,92,.22)}
.nav-cta{display:flex;align-items:center;gap:10px}
.nav-toggle{
  display:none;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 14px;
  width: 44px;height: 44px;
  padding:0;
}
.nav-toggle svg{width:22px;height:22px}

.hero{
  position:relative;
  overflow:hidden;
  padding: 86px 0 34px;
}
.hero-grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 34px;
  align-items: center;
}
.hero-card{
  padding: 22px;
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,.04) 100%);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: var(--shadow);
}
.hero-media{
  position:relative;
  border-radius: 22px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: var(--shadow);
  min-height: 420px;
  background: radial-gradient(500px 400px at 20% 20%, rgba(201,168,92,.18), transparent 60%),
              linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.02));
}
.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.92;filter:saturate(1.05) contrast(1.02)}
.hero-media::after{
  content:"";
  position:absolute;inset:0;
  background: radial-gradient(700px 450px at 20% 20%, rgba(0,0,0,.15), transparent 60%),
              linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.55));
}
.hero-copy{position:relative;z-index:1}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.hero-badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.hero-badges .pill{backdrop-filter: blur(10px)}

.trustbar{
  padding: 24px 0 0;
}
.trustrow{
  display:flex;
  flex-wrap:wrap;
  gap: 12px;
  justify-content: space-between;
}
.trustrow .card{padding:16px 16px;border-radius: 18px;flex: 1;min-width: 220px}
.metric{display:flex;align-items:center;gap:12px}
.metric strong{font-size:1.02rem}
.metric span{display:block;color:var(--muted);font-size:.92rem}

.split{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 22px;
  align-items: start;
}

.list{
  display:grid;
  gap: 10px;
  margin: 16px 0 0;
  padding: 0;
  list-style:none;
}
.list li{
  display:flex;
  gap: 10px;
  align-items:flex-start;
  padding: 12px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
}
.list svg{width:18px;height:18px;flex:0 0 auto;margin-top:2px;color: rgba(201,168,92,.95)}

.media-card{
  padding: 14px;
  border-radius: 22px;
  overflow:hidden;
}
.media-card img{border-radius: 16px;aspect-ratio: 4/3;object-fit: cover}
.media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}

.service{display:flex;flex-direction:column;gap:10px}
.service h3{margin:8px 0 0;font-size: 1.1rem}
.service p{margin:0;color:var(--muted)}
.service a{margin-top:6px}

/* Select Dropdown Dark Mode Fix */
select option {
  background-color: var(--surface);
  color: var(--text);
}

.showcase{
  display:grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.showcase-grid{
  display:grid;
  grid-template-columns: repeat(12, minmax(0,1fr));
  gap: 14px;
}
.shot{
  border-radius: 18px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  position:relative;
}
.shot img{width:100%;height:100%;object-fit:cover;transform: scale(1.02);transition: transform .5s var(--ease), filter .5s var(--ease)}
.shot:hover img{transform: scale(1.06);filter:saturate(1.08)}
.shot .cap{
  position:absolute;
  left: 12px;right: 12px;bottom: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(7,10,13,.55);
  border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(12px);
  color: rgba(255,255,255,.88);
  font-weight: 560;
}
.shot.span-6{grid-column: span 6}
.shot.span-4{grid-column: span 4}
.shot.span-8{grid-column: span 8}
.shot.tall{min-height: 340px}
.shot.mid{min-height: 260px}

.steps{counter-reset: step}
.step{
  position:relative;
  padding: 18px 18px 18px 18px;
}
.step::before{
  counter-increment: step;
  content: counter(step);
  position:absolute;
  top: 18px;right: 18px;
  width: 34px;height:34px;
  display:grid;place-items:center;
  border-radius: 12px;
  background: rgba(201,168,92,.12);
  border: 1px solid rgba(201,168,92,.22);
  color: rgba(201,168,92,.95);
  font-weight: 750;
}
.step h3{margin:8px 0 0}
.step p{margin:8px 0 0;color:var(--muted)}

.quote{
  display:flex;
  flex-direction:column;
  gap: 10px;
}
.quote p{margin:0;color:rgba(255,255,255,.88);font-size:1.02rem}
.quote footer{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--muted);font-size:.92rem}
.stars{letter-spacing: .12em;color: rgba(201,168,92,.95)}

.faq{
  display:grid;
  gap: 12px;
}
details.faq-item{
  border-radius: 16px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.12);
  padding: 14px 16px;
}
details.faq-item summary{
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  font-weight: 650;
  color: rgba(255,255,255,.9);
}
details.faq-item summary::-webkit-details-marker{display:none}
details.faq-item summary .chev{transition: transform .18s var(--ease);opacity:.85}
details.faq-item[open] summary .chev{transform: rotate(180deg)}
details.faq-item .answer{margin-top:10px;color:var(--muted)}

.form{
  display:grid;
  gap: 12px;
}
.field{
  display:grid;
  gap: 8px;
}
.label{font-size:.92rem;color:var(--muted)}
.input,.textarea,select.select{
  width:100%;
  border-radius: 14px;
  padding: 12px 14px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  transition: border-color .18s var(--ease), background .18s var(--ease), box-shadow .18s var(--ease);
}
.textarea{min-height: 128px;resize: vertical}
.input:focus,.textarea:focus,select.select:focus{
  outline:none;
  border-color: rgba(201,168,92,.40);
  box-shadow: 0 0 0 4px rgba(201,168,92,.12);
  background: rgba(255,255,255,.075);
}
.help{font-size:.88rem;color:var(--muted)}
.form-row{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:12px}

.map{
  border-radius: 18px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  min-height: 280px;
}
.map iframe{width:100%;height:100%;border:0;filter:saturate(1.1) contrast(1.03)}

.footer{
  padding: 44px 0 32px;
  border-top: 1px solid rgba(255,255,255,.10);
  background: rgba(7,10,13,.55);
}
.footer-grid{
  display:grid;
  grid-template-columns: 1.2fr .8fr .8fr;
  gap: 22px;
}
.footer h4{margin:0 0 10px;font-size:1rem;color:rgba(255,255,255,.88)}
.footer a{color:var(--muted)}
.footer a:hover{color:rgba(255,255,255,.9)}
.footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.footer-bottom{
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.10);
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  color: rgba(255,255,255,.55);
  font-size: .92rem;
}

.page-hero{
  padding: 64px 0 22px;
}
.breadcrumbs{
  display:flex;
  gap: 10px;
  flex-wrap:wrap;
  color: rgba(255,255,255,.55);
  font-size: .92rem;
}
.breadcrumbs a{color: rgba(255,255,255,.72)}
.breadcrumbs a:hover{color: rgba(255,255,255,.92)}

.filters{display:flex;flex-wrap:wrap;gap:10px}
.chip{
  border-radius: 999px;
  padding: 10px 14px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.78);
  cursor:pointer;
  font-weight: 600;
}
.chip[aria-pressed="true"]{background: rgba(201,168,92,.14);border-color: rgba(201,168,92,.28);color: rgba(201,168,92,.95)}

/* Masonry Gallery */
.masonry{
  column-count: 3;
  column-gap: 16px;
}
.m-item{
  display:block;
  margin-bottom: 16px;
  position:relative;
  overflow:hidden;
  border-radius: 20px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.12);
  cursor: pointer;
}
.m-item img{
  display:block;
  width:100%;
  height:auto;
  transition: transform .6s var(--ease);
  border-radius: 20px;
}
.m-item:hover img{transform: scale(1.05)}
.m-item .cap{
  position:absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(0,0,0,.8));
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding: 24px;
  opacity: 0;
  transition: opacity .3s var(--ease);
}
.m-item:hover .cap{opacity:1}
.m-item .cap span:first-child{font-weight:650;color:#fff}

.lightbox{
  position:fixed;
  inset:0;
  z-index: 100;
  background: rgba(0,0,0,.78);
  display:none;
  align-items:center;
  justify-content:center;
  padding: 24px;
}
.lightbox[aria-hidden="false"]{display:flex}
.lightbox-inner{
  width: min(1100px, 100%);
  border-radius: 18px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(12,16,22,.75);
  box-shadow: var(--shadow);
}
.lightbox-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  padding: 12px 12px;
  border-bottom: 1px solid rgba(255,255,255,.10);
}
.lightbox-title{color:rgba(255,255,255,.85);font-weight:650}
.lightbox-actions{display:flex;gap:10px}
.icon-btn{
  width: 40px;height:40px;
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  cursor:pointer;
  display:grid;
  place-items:center;
}
.icon-btn:hover{background: rgba(255,255,255,.10)}
.lightbox-media{position:relative}
.lightbox-media img{width:100%;height:auto;display:block;max-height: 74vh;object-fit: cover}

[data-reveal]{opacity:0;transform: translateY(10px);transition: opacity .6s var(--ease), transform .6s var(--ease)}
[data-reveal].is-in{opacity:1;transform:none}

@media (max-width: 980px){
  .hero-grid{grid-template-columns: 1fr}
  .hero-media{min-height: 360px;order:-1}
  .split{grid-template-columns: 1fr}
  .grid.cols-3{grid-template-columns:repeat(2, minmax(0,1fr))}
  .grid.cols-4{grid-template-columns:repeat(2, minmax(0,1fr))}
  .footer-grid{grid-template-columns: 1fr 1fr}
  .masonry{columns:2}
}

@media (max-width: 760px){
  :root{--gutter: 18px}
  .topbar-inner{height: 66px}
  .nav{display:none}
  .nav-toggle{display:inline-grid;place-items:center}
  .nav-cta{display:none}
  .section{padding: 64px 0}
  .section-header{flex-direction:column;align-items:flex-start}
  .showcase-grid{grid-template-columns: 1fr}
  .shot.span-6,.shot.span-4,.shot.span-8{grid-column: 1 / -1}
  .form-row{grid-template-columns: 1fr}
  .masonry{columns:1}
  
  /* Mobile Stacking Fixes */
  .grid.cols-2, .grid.cols-3, .grid.cols-4{grid-template-columns: 1fr}
  .footer-grid{grid-template-columns: 1fr; gap: 32px}
  .split{gap: 32px}
  .media-grid{gap: 8px}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *{transition:none !important;animation:none !important}
  [data-reveal]{opacity:1;transform:none}
}

.mobile-drawer{
  position:fixed;
  inset: 0;
  z-index: 60;
  display:none;
  background: rgba(0,0,0,.62);
}
.mobile-drawer[aria-hidden="false"]{display:block}
.mobile-panel{
  position:absolute;
  top: 10px;right: 10px;left: 10px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(10,14,19,.92);
  backdrop-filter: blur(16px);
  box-shadow: var(--shadow);
  padding: 12px;
}
.mobile-panel header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding: 6px 8px 10px}
.mobile-panel nav{display:grid;gap:8px;padding: 8px}
.mobile-panel nav a{
  padding: 12px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.86);
  font-weight: 650;
}
.mobile-panel nav a:hover{background: rgba(255,255,255,.08)}
.mobile-panel .mobile-cta{display:flex;gap:10px;flex-wrap:wrap;padding: 0 8px 10px}
