/* ===== Base ===== */
*,
*::before,
*::after { box-sizing: border-box; }
html, body{ height:100%; }
body{
  margin:0; color:#f4f0ea; background:#062b26;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
  line-height:1.45; -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
.container{ width:min(100% - 40px, 1200px); margin-inline:auto; }
html, body{ overflow-x:hidden; }

/* ===== Navbar (shared style family) ===== */
.site-header{ position:sticky; top:0; z-index:50; height:72px; display:flex; align-items:center; }
.site-header .nav-surface{ position:absolute; inset:0; z-index:-1; backdrop-filter:blur(6px); border-bottom:1px solid transparent; }
.site-header.scrolled .nav-surface{ background:rgba(8,43,38,.78); border-bottom-color:rgba(255,255,255,.18); box-shadow:0 10px 22px rgba(0,0,0,.28); }
.nav-inner{ display:flex; align-items:center; justify-content:space-between; }
.brand{ display:inline-flex; align-items:center; gap:.6rem; font-weight:700; letter-spacing:.02em; font-size:1.08rem; }
.brand-mark{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center; font-weight:700; background: radial-gradient(circle at 30% 30%, #d9efe3, #a0cbb6); color:#123a31; border:1px solid rgba(255,255,255,.2); box-shadow: 0 6px 14px rgba(0,0,0,.25) inset, 0 2px 10px rgba(0,0,0,.18); }
.brand-text strong{ font-weight:800; }
.nav-desktop{ display:none; gap:1.4rem; align-items:center; }
.nav-link{ opacity:.95; font-weight:500; }
.nav-link:hover{ opacity:1; text-decoration: underline; text-underline-offset:6px; }

.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.82rem 1.15rem; border-radius:999px; background:#0b2420; color:#f4f0ea; border:1px solid rgba(0,0,0,.55); box-shadow:0 6px 14px rgba(0,0,0,.18); cursor:pointer; transition:transform .15s ease, background .2s ease, border-color .2s ease; }
.btn:hover{ background:#081e19; transform:translateY(-1px); }
.btn-contrast{ background:#bfe3cf; color:#10352d; border-color:rgba(0,0,0,.06); }
.btn-large{ padding:1rem 1.35rem; font-weight:600; }
.btn-small{ padding:.55rem .9rem; font-size:.92rem; }

/* Hamburger */
.nav-toggle{ appearance:none; border:0; background:transparent; cursor:pointer; width:44px; height:44px; border-radius:10px; display:grid; place-items:center; }
.nav-toggle .bar{ display:block; width:22px; height:2px; background:#f4f0ea; margin:3px 0; border-radius:2px; transition:transform .25s ease, opacity .25s ease; }
@media (min-width:900px){ .nav-desktop{ display:flex; } .nav-toggle{ display:none; } }

/* Drawer (outside header) */
.mobile-drawer{
  position:fixed; top:0; right:0; bottom:0; left:auto; width:min(88vw,380px); height:100vh;
  background:rgba(8,43,38,.96); color:#f4f0ea; transform:translateX(100%); transition:transform .35s ease;
  z-index:60; display:flex; flex-direction:column; border-left:1px solid rgba(255,255,255,.18);
}
.mobile-drawer.open{ transform:translateX(0); }
.drawer-header{ display:flex; align-items:center; justify-content:space-between; padding:1rem 1.25rem; border-bottom:1px solid rgba(255,255,255,.18); }
.brand--drawer{ font-weight:700; display:flex; align-items:center; gap:.6rem; }
.drawer-close{ background:transparent; border:1px solid rgba(255,255,255,.18); color:#f4f0ea; border-radius:10px; padding:.4rem .6rem; cursor:pointer; }
.drawer-links{ display:flex; flex-direction:column; gap:.8rem; padding:1rem 1.25rem 2rem; }
.drawer-link{ padding:.8rem 0; font-size:1.05rem; border-bottom:1px dashed rgba(255,255,255,.12); }
.scrim{ position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:55; }
.scrim[hidden]{ display:none !important; }
@media (min-width:900px){ .mobile-drawer{ transform:translateX(100%) !important; } .mobile-drawer.open{ transform:translateX(100%) !important; } .scrim{ display:none !important; } }

/* ===== Contact Content ===== */
.contact-wrap{
  background:#f3efe8; /* warm light panel like the reference */
  color:#0f2d27;
  padding: clamp(24px, 4vw, 40px) 0 48px;
  border-top:1px solid rgba(0,0,0,.06);
  border-bottom:1px solid rgba(0,0,0,.06);
}
.contact-head{ text-align:left; }
.contact-title{
  margin:0;
  font-family:"Playfair Display", Georgia, serif;
  font-size: clamp(1.8rem, 4.6vw, 2.6rem);
  line-height:1.1;
}
.contact-sub{ margin:.3rem 0 1.2rem; color:#2b4b43; }

/* Info cards */
.info-row{
  display:grid; gap:16px; grid-template-columns: repeat(3, 1fr);
  margin-bottom: clamp(16px, 3vw, 24px);
}
@media (max-width:900px){ .info-row{ grid-template-columns:1fr; } }

.info-card{
  display:flex; gap:12px; align-items:flex-start;
  background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:12px;
  padding:14px 16px; box-shadow:0 10px 20px rgba(0,0,0,.06);
}
.info-icon{
  width:36px; height:36px; border-radius:10px; display:grid; place-items:center;
  background:#bfe3cf; color:#10352d; flex:0 0 auto;
}
.info-body h3{ margin:0 0 2px; font-size:1rem; }
.info-body p, .info-body address{ margin:0; color:#21473f; font-style:normal; }

/* Divider */
.divider{ border:0; border-top:1px solid rgba(0,0,0,.08); margin: clamp(16px, 4vw, 28px) 0; }

/* Form */
.contact-form{ display:grid; gap:16px; }
.grid-2{ display:grid; gap:16px; grid-template-columns:1fr 1fr; }
@media (max-width:900px){ .grid-2{ grid-template-columns:1fr; } }

.field label{ display:block; font-weight:600; margin:0 0 6px; color:#163b33; }
.field input,
.field select,
.field textarea{
  width:100%; background:#ffffff; border:1px solid rgba(0,0,0,.12);
  border-radius:12px; padding:.9rem .95rem; font-size:1rem; color:#0f2d27;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.field select{ appearance:none; background-image:linear-gradient(45deg, transparent 50%, #0f2d27 50%), linear-gradient(135deg, #0f2d27 50%, transparent 50%), linear-gradient(to right, transparent, transparent); background-position: calc(100% - 20px) calc(1.05em), calc(100% - 15px) calc(1.05em), 100% 0; background-size:5px 5px, 5px 5px, 2.5em 2.5em; background-repeat:no-repeat; }
.field input::placeholder, .field textarea::placeholder{ color:#7a8f89; }
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color:#87cdb0; box-shadow:0 0 0 3px rgba(191,227,207,.45);
}

/* Actions */
.actions{ display:flex; align-items:center; gap:12px; }
.btn-solid{ background:#0b2420; color:#f4f0ea; border-color:rgba(0,0,0,.55); }
.btn-solid:hover{ background:#0a201d; }
.form-status{ font-size:.95rem; color:#1f4b42; }

/* ===== Footer ===== */
.site-footer{ background:#062b26; color:#f4f0ea; border-top:1px solid rgba(255,255,255,.12); }
.footer-grid{ display:grid; gap:32px; padding:24px 0; grid-template-columns: 1.2fr .9fr .9fr; align-items:start; }
.footer-tag{ margin:.6rem 0 0; color:#cdd7d4; max-width:40ch; }
.footer-heading{ margin:0 0 .4rem; font-weight:700; letter-spacing:.02em; font-size:1rem; }
.footer-addr{ font-style:normal; color:#e9e4dd; margin:0 0 .4rem; }
.footer-phone a{ color:#bfe3cf; }
.footer-social-links a{ color:#cdd7d4; } .footer-social-links a:hover{ color:#fff; text-decoration: underline; }
.footer-social-links .sep{ margin:0 .5rem; opacity:.6; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.12); background:#052521; color:#cdd7d4; }
.footer-bottom-inner{ display:flex; align-items:center; justify-content:space-between; padding:12px 0; }
@media (max-width:900px){ .footer-grid{ grid-template-columns:1fr; } }

/* Accessibility helpers */
[inert]{ pointer-events:none; user-select:none; }
[inert] a,[inert] button,[inert] input,[inert] select,[inert] textarea{ pointer-events:none; }

@media (prefers-reduced-motion: reduce){ *{ transition:none !important; scroll-behavior:auto !important; } }