/* ============================================================
   DAR ALLIANCE — design tokens
   ink: near-black charcoal (base) | stone: logo roof grey
   blue: Alliance wordmark blue (primary accent)
   brass: warm interior-lighting accent, used sparingly
   ============================================================ */
:root{
  --ink:        #14171b;
  --ink-2:      #1b1f24;
  --ink-3:      #23282f;
  --stone:      #9aa0a8;
  --stone-2:    #c7c9c4;
  --paper:      #f4f1ea;
  --paper-2:    #ece7db;
  --line:       #33383f;
  --line-soft:  rgba(244,241,234,0.12);
  --blue:       #009af7;
  --blue-2:     #3fc0ff;
  --blue-deep:  #043a63;
  --brass:      #e3a63f;
  --white:      #ffffff;
  --ok:         #3fc0ff;
  --glow: 0 0 0 1px rgba(0,154,247,.25), 0 18px 40px -12px rgba(0,154,247,.45);

  --serif: 'Playfair Display', ui-serif, Georgia, serif;
  --sans:  'Inter', ui-sans-serif, system-ui, sans-serif;
  --mono:  'IBM Plex Mono', ui-monospace, monospace;

  --container: 1200px;
  --gap: clamp(1.25rem, 3vw, 2.5rem);
  --radius: 2px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ margin:0; font-family:var(--serif); font-weight:500; letter-spacing:-0.01em; }
p{ margin:0; }

:focus-visible{
  outline:2px solid var(--blue-2);
  outline-offset:3px;
}

.wrap{
  max-width:var(--container);
  margin:0 auto;
  padding:0 clamp(1.25rem, 4vw, 3rem);
}

.eyebrow{
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--brass);
  display:inline-flex;
  align-items:center;
  gap:.6em;
}
.eyebrow::before{
  content:"";
  width:22px; height:1px;
  background:var(--brass);
  display:inline-block;
}

.tag{
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.08em;
  color:var(--stone-2);
  border:1px solid var(--line);
  padding:.35em .7em;
  border-radius:1px;
  white-space:nowrap;
}

/* ---------- roofline signature divider ---------- */
.roofline{
  width:100%;
  height:34px;
  display:block;
}
.roofline path{
  fill:none;
  stroke:var(--brass);
  stroke-width:1;
  opacity:.55;
  stroke-dasharray:600;
  stroke-dashoffset:600;
  transition:stroke-dashoffset 1.4s var(--ease);
}
.roofline.in-view path{ stroke-dashoffset:0; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:.6em;
  font-family:var(--sans);
  font-weight:600;
  font-size:.92rem;
  letter-spacing:.01em;
  padding:.95em 1.7em;
  border-radius:1px;
  border:1px solid transparent;
  transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
}
.btn:hover{ transform:translateY(-2px); }
.btn-primary{ background:var(--blue); color:var(--white); box-shadow:0 10px 28px -10px rgba(0,154,247,.65); }
.btn-primary:hover{ background:var(--blue-2); box-shadow:0 14px 34px -8px rgba(63,192,255,.75); }
.btn-ghost{ border-color:var(--line-soft); color:var(--paper); }
.btn-ghost:hover{ border-color:var(--paper); }
.btn-dark{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.btn-dark:hover{ background:var(--ink-2); }

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed;
  top:0; left:0; right:0;
  z-index:100;
  padding:1.1rem 0;
  background:linear-gradient(to bottom, rgba(20,23,27,.85), rgba(20,23,27,0));
  transition:background .35s var(--ease), padding .35s var(--ease), border-color .35s var(--ease);
  border-bottom:1px solid transparent;
}
.nav.solid{
  background:rgba(20,23,27,.94);
  backdrop-filter:blur(10px);
  padding:.8rem 0;
  border-bottom-color:var(--line-soft);
}
.nav .wrap{ display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand{ display:flex; align-items:center; gap:.7rem; }
.brand img{ height:38px; width:auto;  }
.brand-name{ font-family:var(--serif); font-size:1.05rem; letter-spacing:.02em; }
.brand-name b{ color:var(--blue-2); font-weight:600; }

.nav-links{ display:flex; align-items:center; gap:2rem; }
.nav-links a{
  font-size:.86rem;
  font-weight:600;
  letter-spacing:.02em;
  color:var(--stone-2);
  position:relative;
  padding:.3rem 0;
}
.nav-links a:hover{ color:var(--paper); }
.nav-links a.active{ color:var(--paper); }
.nav-links a.active::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-2px;
  height:1px; background:var(--brass);
}
.nav-cta{ display:flex; align-items:center; gap:1.1rem; }
.nav-toggle{
  display:none;
  background:none; border:1px solid var(--line-soft);
  width:42px; height:42px; align-items:center; justify-content:center;
  color:var(--paper);
  position:relative; z-index:302;
}
.nav-backdrop{
  display:none;
  position:fixed; inset:0; z-index:300;
  background:rgba(10,11,13,.55);
  opacity:0; transition:opacity .3s var(--ease);
}
.nav-backdrop.open{ display:block; opacity:1; }

@media (max-width: 900px){
  .nav-links{
    position:fixed; inset:0 0 0 auto; width:min(78vw,320px);
    background:var(--ink-2); border-left:1px solid var(--line);
    flex-direction:column; align-items:flex-start; justify-content:flex-start;
    padding:6rem 2rem 2rem; gap:1.6rem;
    transform:translateX(100%); transition:transform .4s var(--ease);
    z-index:301; overflow-y:auto;
  }
  .nav-links.open{ transform:translateX(0); }
  .nav-toggle{ display:flex; }
  .nav-cta .btn-primary{ display:none; }
  .nav-toggle .icon-close{ display:none; }
  .nav-toggle.open .icon-menu{ display:none; }
  .nav-toggle.open .icon-close{ display:flex; }
}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative;
  min-height:100svh;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
}
.hero-media{ position:absolute; inset:0; }
.hero-media img{ width:100%; height:100%; object-fit:cover; }
.hero-media::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(to top, rgba(15,17,20,.96) 0%, rgba(15,17,20,.55) 42%, rgba(15,17,20,.25) 65%, rgba(15,17,20,.55) 100%),
    linear-gradient(to right, rgba(15,17,20,.55), rgba(15,17,20,.1) 45%);
}
.hero-grid{
  position:absolute; inset:0;
  background-image:
    linear-gradient(var(--line-soft) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-soft) 1px, transparent 1px);
  background-size:64px 64px;
  opacity:.25;
  mix-blend-mode:overlay;
}
.hero-content{
  position:relative; z-index:2;
  width:100%;
  padding:8rem 0 4.5rem;
}
.hero-content .wrap{ display:block; }
.hero-tag{ margin-bottom:1.6rem; }
.hero h1{
  font-size:clamp(2.4rem, 6vw, 5rem);
  line-height:1.02;
  max-width:14ch;
  color:var(--paper);
}
.hero h1 em{
  font-style:italic;
  font-weight:500;
  color:var(--blue-2);
}
.hero-sub{
  margin-top:1.6rem;
  max-width:46ch;
  font-size:1.06rem;
  color:var(--stone-2);
}
.hero-cta{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:2.4rem; }
.hero-meta{
  margin-top:3.4rem;
  display:flex; flex-wrap:wrap; gap:2.2rem;
  padding-top:1.6rem;
  border-top:1px solid var(--line-soft);
}
.hero-meta div{ display:flex; flex-direction:column; gap:.25rem; }
.hero-meta .n{ font-family:var(--serif); font-size:1.4rem; color:var(--paper); }
.hero-meta .l{ font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--stone); }

.scroll-cue{
  position:absolute; right:clamp(1.25rem,4vw,3rem); bottom:2.4rem; z-index:2;
  writing-mode:vertical-rl;
  font-family:var(--mono); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--stone-2);
  display:flex; align-items:center; gap:.8rem;
}
.scroll-cue::after{ content:""; width:1px; height:40px; background:var(--stone); animation:scrolldrop 2.4s ease-in-out infinite; }
@keyframes scrolldrop{ 0%{ transform:scaleY(0); transform-origin:top;} 50%{ transform:scaleY(1); transform-origin:top;} 51%{ transform-origin:bottom;} 100%{ transform:scaleY(0); transform-origin:bottom;} }

/* ============================================================
   SECTION shells
   ============================================================ */
section{ position:relative; }
.section{ padding:6.5rem 0; }
.section-dark{ background:var(--ink); }
.section-ink2{ background:var(--ink-2); }
.section-paper{ background:var(--paper); color:var(--ink); }
.section-head{
  display:flex; align-items:flex-end; justify-content:space-between; gap:2rem;
  margin-bottom:3rem; flex-wrap:wrap;
}
.section-head h2{ font-size:clamp(1.9rem,3.6vw,2.8rem); margin-top:.6rem; }
.section-paper .section-head h2{ color:var(--ink); }
.section-note{ max-width:34ch; font-size:.95rem; color:var(--stone-2); }
.section-paper .section-note{ color:#5a5a55; }

/* ============================================================
   ABOUT
   ============================================================ */
.about-grid{
  display:grid; grid-template-columns:1.05fr .95fr; gap:var(--gap);
  align-items:center;
}
.about-copy p{ font-size:1.05rem; color:#c9c6bd; }
.about-copy p + p{ margin-top:1.1rem; }
.section-paper .about-copy p{ color:#4a4943; }
.about-facts{
  margin-top:2.4rem; display:grid; grid-template-columns:repeat(2,1fr); gap:1.4rem 2rem;
}
.about-facts li{ padding-top:1rem; border-top:1px solid var(--line); }
.section-paper .about-facts li{ border-top-color:#ded8c8; }
.about-facts b{ display:block; font-family:var(--serif); font-size:1.15rem; margin-bottom:.3rem; }
.about-facts span{ font-size:.86rem; color:var(--stone); }
.section-paper .about-facts span{ color:#77746b; }

.about-media{ position:relative; }
.about-media img{ width:100%; height:clamp(340px,42vw,560px); object-fit:cover; }
.about-media .plate{
  position:absolute; left:-1px; bottom:-1px;
  background:var(--ink); color:var(--paper);
  font-family:var(--mono); font-size:.72rem; letter-spacing:.08em;
  padding:.7em 1.1em; border:1px solid var(--line);
}

@media (max-width:900px){
  .about-grid{ grid-template-columns:1fr; }
  .about-media{ order:-1; }
}

/* ============================================================
   SERVICES
   ============================================================ */
.services-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line);
}
.service-card{
  background:var(--ink); padding:2.4rem 2rem;
  display:flex; flex-direction:column; gap:1rem;
  transition:background .3s var(--ease);
}
.service-card:hover{ background:var(--ink-2); }
.service-num{ font-family:var(--mono); font-size:.75rem; color:var(--brass); letter-spacing:.1em; }
.service-card h3{ font-size:1.25rem; color:var(--paper); }
.service-card p{ font-size:.92rem; color:var(--stone-2); }
@media (max-width:900px){ .services-grid{ grid-template-columns:1fr; } }

/* ============================================================
   PORTFOLIO
   ============================================================ */
.proj-tabs{ display:flex; gap:.6rem; margin-bottom:2.6rem; flex-wrap:wrap; }
.proj-tab{
  font-family:var(--mono); font-size:.78rem; letter-spacing:.06em;
  padding:.7em 1.2em; border:1px solid var(--line); color:var(--stone-2);
  background:transparent; transition:all .25s var(--ease);
}
.proj-tab.active, .proj-tab:hover{ border-color:var(--blue-2); color:var(--paper); background:rgba(77,141,201,.08); }

.gallery{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  grid-auto-rows:190px;
  gap:.6rem;
}
.gallery.hidden{ display:none; }
.gallery figure{ margin:0; position:relative; overflow:hidden; cursor:zoom-in; background:var(--ink-2); }
.gallery figure img{
  width:100%; height:100%; object-fit:cover;
  transition:transform .6s var(--ease), filter .4s var(--ease);
}
.gallery figure:hover img{ transform:scale(1.06); filter:brightness(1.05); }
.gallery figure::after{
  content:"";
  position:absolute; inset:0;
  box-shadow:inset 0 0 0 1px var(--line-soft);
  pointer-events:none;
}
.gallery figure figcaption{
  position:absolute; left:0; right:0; bottom:0;
  padding:.9rem 1rem .8rem;
  font-family:var(--mono); font-size:.66rem; letter-spacing:.05em;
  color:var(--paper);
  background:linear-gradient(to top, rgba(10,11,13,.85), transparent);
  opacity:0; transform:translateY(6px);
  transition:opacity .3s var(--ease), transform .3s var(--ease);
}
.gallery figure:hover figcaption{ opacity:1; transform:translateY(0); }

.gallery figure.tall{ grid-row:span 2; }
.gallery figure.wide{ grid-column:span 2; }

@media (max-width:900px){
  .gallery{ grid-template-columns:repeat(2,1fr); grid-auto-rows:150px; }
  .gallery figure.wide{ grid-column:span 2; }
}
@media (max-width:560px){
  .gallery{ grid-template-columns:1fr 1fr; grid-auto-rows:130px; }
}

.gallery-more{
  margin-top:1.6rem; display:flex; justify-content:center;
}

/* lightbox */
.lightbox{
  position:fixed; inset:0; z-index:200;
  background:rgba(10,11,13,.96);
  display:none; align-items:center; justify-content:center;
  padding:4vh 4vw;
}
.lightbox.open{ display:flex; }
.lightbox img{ max-width:100%; max-height:88vh; object-fit:contain; border:1px solid var(--line-soft); }
.lightbox-close, .lightbox-nav{
  position:absolute; background:rgba(20,23,27,.7); border:1px solid var(--line-soft);
  color:var(--paper); width:46px; height:46px; display:flex; align-items:center; justify-content:center;
  font-size:1.1rem; transition:background .2s;
}
.lightbox-close:hover, .lightbox-nav:hover{ background:var(--blue); }
.lightbox-close{ top:1.4rem; right:clamp(1rem,4vw,3rem); }
.lightbox-prev{ left:clamp(.6rem,3vw,2rem); top:50%; transform:translateY(-50%); }
.lightbox-next{ right:clamp(.6rem,3vw,2rem); top:50%; transform:translateY(-50%); }
.lightbox-caption{
  position:absolute; left:0; right:0; bottom:1.6rem; text-align:center;
  font-family:var(--mono); font-size:.72rem; letter-spacing:.08em; color:var(--stone-2);
}

/* ============================================================
   VIDEO
   ============================================================ */
.video-wrap{
  position:relative; border:1px solid var(--line);
  aspect-ratio:16/9; overflow:hidden; background:#000;
}
.video-wrap video{ width:100%; height:100%; object-fit:cover; display:block; }
.video-play{
  position:absolute; inset:0; margin:auto; width:88px; height:88px; border-radius:50%;
  background:rgba(20,23,27,.55); border:1px solid var(--line-soft); backdrop-filter:blur(4px);
  color:var(--paper); display:flex; align-items:center; justify-content:center; font-size:1.6rem;
  transition:background .25s, transform .25s;
}
.video-wrap:hover .video-play{ background:var(--blue); transform:scale(1.05); }
.video-wrap.playing .video-play{ opacity:0; pointer-events:none; }

/* ============================================================
   CTA BAND
   ============================================================ */
.cta-band{
  background:linear-gradient(120deg, var(--blue-deep), var(--ink));
  padding:5.5rem 0;
  position:relative; overflow:hidden;
}
.cta-band .roofline path{ opacity:.35; }
.cta-inner{ display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap; }
.cta-inner h2{ font-size:clamp(1.7rem,3.4vw,2.5rem); max-width:16ch; color:var(--paper); }
.cta-actions{ display:flex; gap:1rem; flex-wrap:wrap; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ background:#0e1013; padding:4.5rem 0 2rem; }
.footer-grid{
  display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:2.5rem;
  padding-bottom:3rem; border-bottom:1px solid var(--line-soft);
}

.footer-brand .brand{ margin-bottom:1rem; }
.footer-brand p{ color:var(--stone); font-size:.9rem; max-width:32ch; }
.footer h4{ font-family:var(--mono); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--brass); margin-bottom:1.1rem; }
.footer ul li{ margin-bottom:.7rem; }
.footer ul a{ color:var(--stone-2); font-size:.9rem; transition:color .2s; }
.footer ul a:hover{ color:var(--paper); }
.footer-bottom{
  padding-top:1.6rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem;
  font-size:.8rem; color:var(--stone);
}
.socials{ display:flex; gap:.9rem; }
.socials a{
  width:36px; height:36px; border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  transition:border-color .2s, color .2s;
}
.socials a:hover{ border-color:var(--blue-2); color:var(--blue-2); }

@media (max-width:900px){
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .footer-grid{ grid-template-columns:1fr; }
}

/* ============================================================
   REVEAL ON SCROLL
   ============================================================ */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in-view{ opacity:1; transform:none; }

/* ============================================================
   PROPERTIES PAGE
   ============================================================ */
.listing{
  border:1px solid var(--line);
  background:var(--ink-2);
  margin-bottom:3rem;
  overflow:hidden;
}
.listing-top{
  display:grid; grid-template-columns:1.3fr 1fr;
}
.listing-media{ position:relative; min-height:420px; }
.listing-media .main-shot{ width:100%; height:100%; object-fit:cover; display:block; }
.listing-thumbs{
  position:absolute; left:1rem; bottom:1rem; right:1rem;
  display:flex; gap:.5rem; overflow-x:auto; padding-bottom:.2rem;
}
.listing-thumbs img{
  width:64px; height:64px; object-fit:cover; flex:none;
  border:2px solid rgba(244,241,234,.25); cursor:pointer; transition:border-color .2s;
}
.listing-thumbs img:hover, .listing-thumbs img.active{ border-color:var(--blue-2); }
.listing-badge{
  position:absolute; top:1rem; left:1rem;
  background:var(--blue); color:#fff; font-family:var(--mono); font-size:.68rem;
  letter-spacing:.08em; padding:.5em .9em; text-transform:uppercase;
  box-shadow:0 8px 22px -8px rgba(0,154,247,.7);
}
.listing-info{ padding:clamp(1.6rem,3vw,2.6rem); display:flex; flex-direction:column; }
.listing-info .eyebrow{ margin-bottom:.8rem; }
.listing-info h3{ font-size:clamp(1.5rem,2.6vw,2rem); color:var(--paper); margin-bottom:.4rem; }
.listing-loc{ font-size:.88rem; color:var(--stone-2); margin-bottom:1.4rem; }
.listing-price{
  display:flex; align-items:baseline; gap:.6rem; margin-bottom:1.6rem;
  padding-bottom:1.6rem; border-bottom:1px solid var(--line-soft);
}
.listing-price .amount{ font-family:var(--serif); font-size:2.1rem; color:var(--blue-2); }
.listing-price .sub{ font-family:var(--mono); font-size:.7rem; letter-spacing:.08em; color:var(--stone); text-transform:uppercase; }
.listing-quick{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:1.8rem; }
.listing-quick div{ text-align:center; padding:.8rem .4rem; border:1px solid var(--line); }
.listing-quick b{ display:block; font-family:var(--serif); font-size:1.2rem; color:var(--paper); }
.listing-quick span{ font-family:var(--mono); font-size:.62rem; letter-spacing:.06em; color:var(--stone); text-transform:uppercase; }
.listing-cta{ margin-top:auto; display:flex; gap:1rem; flex-wrap:wrap; }

.listing-body{ padding:0 clamp(1.6rem,3vw,2.6rem) clamp(1.6rem,3vw,2.6rem); }
.listing-cols{ display:grid; grid-template-columns:1.3fr 1fr; gap:2.4rem; padding-top:2rem; border-top:1px solid var(--line-soft); }
.facility-grid{ display:grid; grid-template-columns:1fr 1fr; gap:.9rem 1.4rem; }
.facility-item{ display:flex; align-items:center; gap:.7rem; font-size:.9rem; color:var(--stone-2); }
.facility-item svg{ flex:none; color:var(--blue-2); }
.attraction-list{ display:flex; flex-direction:column; gap:.7rem; }
.attraction-item{ display:flex; justify-content:space-between; gap:1rem; font-size:.88rem; color:var(--stone-2); border-bottom:1px dashed var(--line); padding-bottom:.6rem; }
.attraction-item b{ color:var(--paper); font-weight:600; }
.attraction-item span{ font-family:var(--mono); font-size:.72rem; color:var(--brass); white-space:nowrap; }

.listing-video{ margin-top:1rem; }

@media (max-width:900px){
  .listing-top{ grid-template-columns:1fr; }
  .listing-media{ min-height:300px; }
  .listing-cols{ grid-template-columns:1fr; }
  .listing-quick{ grid-template-columns:repeat(2,1fr); }
}

/* ============================================================
   CONTACT PAGE
   ============================================================ */
.page-banner{
  padding:10.5rem 0 4rem;
  background:var(--ink-2);
  position:relative;
}
.page-banner .eyebrow{ margin-bottom:1rem; }
.page-banner h1{ font-size:clamp(2.1rem,4.6vw,3.4rem); }
.page-banner p{ margin-top:1rem; max-width:48ch; color:var(--stone-2); }

.contact-grid{
  display:grid; grid-template-columns:.85fr 1.15fr; gap:var(--gap);
  align-items:start;
}
.contact-info h3{ font-size:1.4rem; margin-bottom:1.4rem; color:var(--paper); }
.info-list{ display:flex; flex-direction:column; gap:1.5rem; }
.info-item{ display:flex; gap:1rem; padding-bottom:1.5rem; border-bottom:1px solid var(--line-soft); }
.info-icon{
  width:42px; height:42px; flex:none; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; color:var(--blue-2);
}
.info-item b{ display:block; font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--stone); margin-bottom:.35rem; }
.info-item span, .info-item a{ font-size:1rem; color:var(--paper); }

.map-box{
  margin-top:2rem; border:1px solid var(--line); padding:1.6rem;
  background:var(--ink-2);
}
.map-box .eyebrow{ margin-bottom:.8rem; }
.map-box p{ font-size:.88rem; color:var(--stone-2); }

.form-card{
  background:var(--ink-2); border:1px solid var(--line); padding:clamp(1.6rem,4vw,3rem);
}
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; }
.field{ margin-bottom:1.3rem; }
.field label{
  display:block; font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--stone); margin-bottom:.6rem;
}
.field input, .field select, .field textarea{
  width:100%; background:var(--ink); border:1px solid var(--line); color:var(--paper);
  padding:.85em 1em; font-family:var(--sans); font-size:.96rem; border-radius:1px;
  transition:border-color .2s;
}
.field input:focus, .field select:focus, .field textarea:focus{ border-color:var(--blue-2); outline:none; }
.field textarea{ resize:vertical; min-height:130px; }
.field select{ appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239aa0a8' stroke-width='1.4' fill='none'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 1em center; }
.form-foot{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-top:.6rem; }
.form-note{ font-size:.8rem; color:var(--stone); max-width:32ch; }
.form-success{
  display:none; align-items:center; gap:.8rem; padding:1.2rem 1.4rem; border:1px solid var(--blue-2);
  background:rgba(77,141,201,.08); color:var(--paper); font-size:.92rem; margin-top:1.2rem;
}
.form-success.show{ display:flex; }

@media (max-width:900px){
  .contact-grid{ grid-template-columns:1fr; }
  .form-row{ grid-template-columns:1fr; }
}