

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
:root {
  --argile:#C4622D;
  --terre:#8B3A1A;
  --sable:#E8D5B0;
  --creme:#F5EFE0;
  --creme-2:#FBF7EE;
  --nuit:#1C1208;
  --khaki:#6B5E3E;
  --line:rgba(28,18,8,.10);
  --line-strong:rgba(28,18,8,.16);
  --card:rgba(255,255,255,.58);
  --shadow:0 20px 50px rgba(28,18,8,.10);
  --shadow-soft:0 12px 28px rgba(28,18,8,.08);
  --radius:26px;
}
body {
  margin:0;
  color:var(--nuit);
  font-family:'Libre Baskerville',serif;
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  background:
    radial-gradient(circle at top left, rgba(196,98,45,.06), transparent 24%),
    radial-gradient(circle at bottom right, rgba(123,163,184,.05), transparent 28%),
    linear-gradient(180deg, #f8f3e8 0%, #f5efe0 100%);
}
body::before {
  content:'';
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:1;
  opacity:.22;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.035'/%3E%3C/svg%3E");
}
a { color:inherit; text-decoration:none; }
a:focus-visible, button:focus-visible { outline:3px solid var(--argile); outline-offset:4px; }
img { max-width:100%; }
.skip-link {
  position:absolute; left:14px; top:-48px; z-index:999; background:white; color:var(--nuit);
  padding:12px 16px; border-radius:14px; box-shadow:var(--shadow-soft);
}
.skip-link:focus { top:14px; }
.container {
  width:min(1240px, calc(100% - 40px));
  margin:0 auto;
  position:relative;
  z-index:2;
}

nav {
  position:sticky;
  top:0;
  z-index:100;
  backdrop-filter:blur(14px);
  background:rgba(245,239,224,.82);
  border-bottom:1px solid var(--line);
}
.nav-inner {
  min-height:78px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  padding:10px 0;
}
.nav-logo {
  flex:0 0 auto;
  font-family:'Space Mono',monospace;
  font-size:.78rem;
  letter-spacing:.28em;
  color:var(--terre);
  text-transform:uppercase;
}
.nav-links {
  display:flex;
  justify-content:center;
  align-items:center;
  flex:1 1 auto;
  gap:clamp(.9rem, 2vw, 1.7rem);
  list-style:none;
  padding:0;
  margin:0;
}
.nav-links a {
  font-family:'Space Mono',monospace;
  font-size:.66rem;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--khaki);
  opacity:.92;
}
.nav-links a:hover { color:var(--argile); }
.nav-cta {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  gap:.75rem;
  padding:.9rem 1.25rem;
  border-radius:999px;
  background:linear-gradient(135deg, var(--argile), var(--terre));
  color:var(--creme);
  font-family:'Space Mono',monospace;
  font-size:.66rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  box-shadow:var(--shadow-soft);
}

.hero {
  min-height:min(100vh, 980px);
  display:grid;
  grid-template-columns:minmax(0, 1.02fr) minmax(0, .98fr);
  gap:clamp(28px, 4vw, 56px);
  align-items:center;
  padding-top:2.2rem;
}
.hero-left {
  padding:clamp(4.5rem, 10vw, 8rem) 0 clamp(2rem, 5vw, 4rem);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.hero-title {
  color:var(--argile);
  margin:0 0 1.2rem;
  max-width:9ch;
  font-family:'Playfair Display',serif;
  font-size:clamp(2.6rem, 6vw, 5rem);
  line-height:.95;
  letter-spacing:-.035em;
}
.hero-title em { color:var(--argile); font-style:italic; display:block; }
.hero-desc {
  font-size:clamp(1rem, 1.3vw, 1.08rem);
  line-height:1.9;
  color:var(--khaki);
  max-width:58ch;
  margin-bottom:2rem;
}
.hero-actions { display:flex; gap:.9rem; flex-wrap:wrap; }
.hero-cta, .hero-secondary {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.9rem;
  min-height:52px;
  padding:1rem 1.35rem;
  border-radius:999px;
  font-family:'Space Mono',monospace;
  font-size:.67rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.hero-cta {
  color:var(--creme);
  background:linear-gradient(135deg, var(--argile), var(--terre));
  box-shadow:0 16px 30px rgba(139,58,26,.18);
}
.hero-secondary {
  color:var(--nuit);
  border:1px solid var(--line-strong);
  background:rgba(255,255,255,.54);
}
.hero-cta:hover, .hero-secondary:hover { transform:translateY(-2px); }

.hero-right {
  position:relative;
  padding:1.25rem 0;
  display:flex;
  align-items:center;
  min-width:0;
}
.hero-frame {
  position:relative;
  width:100%;
  min-height:clamp(420px, 72vh, 760px);
  overflow:hidden;
  border-radius:34px;
  box-shadow:0 30px 80px rgba(28,18,8,.18);
  background:var(--khaki);
}
.hero-frame img { width:100%; height:100%; object-fit:cover; display:block; }
.hero-frame::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.34) 100%);
}
.hero-note {
  position:absolute;
  right:24px;
  bottom:24px;
  max-width:340px;
  z-index:2;
  background:rgba(245,239,224,.92);
  color:var(--nuit);
  border:1px solid var(--line);
  padding:1.2rem 1.15rem;
  border-radius:18px;
  box-shadow:var(--shadow-soft);
}
.hero-note strong,
.section-label,
.meta-card strong,
.terrain-card-num,
.quote-attr,
.gallery-head span,
.contact-detail-label,
.contact-link small {
  display:block;
  font-family:'Space Mono',monospace;
  font-size:.6rem;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.hero-note strong,
.section-label,
.meta-card strong,
.terrain-card-num,
.contact-detail-label,
.contact-link small { color:var(--argile); }
.hero-note p { margin:0; font-size:.92rem; line-height:1.75; }

section { padding:clamp(4.75rem, 8vw, 7rem) 0; position:relative; z-index:2; }
.section-label { margin-bottom:1.2rem; }

.mission {
  display:grid;
  grid-template-columns:90px minmax(0, .95fr) minmax(0, 1.05fr);
  gap:clamp(18px, 3vw, 38px);
  align-items:start;
}
.mission-number {
  font-family:'Playfair Display',serif;
  font-size:clamp(3.2rem,8vw,6.5rem);
  color:rgba(232,213,176,.92);
  line-height:.85;
}
.mission-heading {
  padding-right:clamp(0px, 2vw, 26px);
  border-right:1px solid var(--line);
}
.mission-heading h2,
.terrain-header h2,
.vol-title,
.gallery-head h2,
.contact-title {
  margin:0;
  font-family:'Playfair Display',serif;
  line-height:1.02;
  font-weight:500;
}
.mission-heading h2 { font-size:clamp(2.1rem,4vw,3.5rem); }
.mission-heading strong,
.vol-title em,
.contact-title em { color:var(--argile); }
.mission-body { padding-left:clamp(0px, 2vw, 12px); }
.mission-body p,
.vol-text,
.contact-text,
.terrain-header p,
.terrain-card p { color:var(--khaki); line-height:1.9; }
.tags { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.35rem; }
.tag {
  display:inline-flex;
  padding:.48rem .82rem;
  border-radius:999px;
  border:1px solid rgba(196,98,45,.22);
  color:var(--argile);
  background:rgba(255,255,255,.5);
  font-family:'Space Mono',monospace;
  font-size:.56rem;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.terrain-wrap {
  background:linear-gradient(180deg, #1c1208 0%, #22160d 100%);
  color:var(--sable);
  padding:clamp(4.5rem, 8vw, 7rem) 0;
}
.terrain-header,
.gallery-head {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:2rem;
  margin-bottom:2.2rem;
}
.terrain-header h2 { font-size:clamp(2.3rem,4vw,4rem); }
.terrain-header p { max-width:520px; color:rgba(232,213,176,.74); }
.terrain-grid {
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:1rem;
  background:transparent;
}
.terrain-card {
  background:rgba(255,255,255,.03);
  border:1px solid rgba(232,213,176,.10);
  border-radius:24px;
  padding:2.2rem 1.8rem;
  min-width:0;
}
.terrain-card-icon { width:48px; height:48px; margin-bottom:1.2rem; }
.terrain-card h3 {
  margin:0 0 .9rem;
  font-family:'Playfair Display',serif;
  font-size:1.55rem;
  line-height:1.12;
  font-weight:500;
  color:var(--sable);
}
.terrain-card p { margin:0; color:rgba(232,213,176,.72); font-size:.96rem; }

.vol-grid,
.contact-grid {
  display:grid;
  grid-template-columns:minmax(0, 1.05fr) minmax(0, .95fr);
  gap:clamp(26px, 5vw, 70px);
  align-items:start;
}
.vol-title { margin:0 0 1.4rem; font-size:clamp(2.3rem,4vw,4.3rem); }
.vol-text { max-width:58ch; margin:0 0 1rem; }
.profiles {
  display:grid;
  gap:.9rem;
}
.profile {
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:center;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:20px;
  padding:1.15rem 1.25rem;
  box-shadow:var(--shadow-soft);
}
.profile strong {
  font-family:'Playfair Display',serif;
  font-size:1.08rem;
  font-style:italic;
  font-weight:500;
}
.profile span {
  font-family:'Space Mono',monospace;
  font-size:.56rem;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--argile);
  text-align:right;
}

.quote-section { background:linear-gradient(135deg, #c4622d, #ae5124); color:var(--creme); }
.quote-inner { width:min(900px,100%); margin:0 auto; }
blockquote {
  margin:0 0 1.2rem;
  font-family:'Playfair Display',serif;
  font-size:clamp(1.65rem,3vw,2.6rem);
  line-height:1.45;
  font-style:italic;
}
.quote-attr { color:rgba(245,239,224,.75); }

.gallery-dark { background:linear-gradient(180deg, #1b1209 0%, #21150c 100%); color:var(--sable); }
.gallery-head h2 { font-size:clamp(2.3rem,4vw,3.8rem); }
.gallery-head span { color:rgba(232,213,176,.56); }
.mosaic {
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  grid-template-rows:300px 300px;
  gap:12px;
}
.mosaic-item {
  position:relative;
  overflow:hidden;
  min-height:240px;
  border-radius:22px;
  isolation:isolate;
}
.mosaic-item:first-child { grid-row:1 / 3; }
.mosaic-item img {
  width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s ease;
}
.mosaic-item::after {
  content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 52%, rgba(0,0,0,.36) 100%);
}
.mosaic-item:hover img { transform:scale(1.04); }
.mosaic-label {
  position:absolute; left:1rem; bottom:1rem; z-index:2; font-family:'Space Mono',monospace;
  font-size:.54rem; letter-spacing:.2em; text-transform:uppercase; color:var(--sable);
}

.contact-title { margin:0 0 1.2rem; font-size:clamp(2.35rem,4vw,4.4rem); }
.contact-text { margin:0 0 1.6rem; }
.contact-list { display:grid; gap:1rem; }
.contact-detail {
  display:grid;
  grid-template-columns:92px 1fr;
  gap:1rem;
  align-items:start;
  padding:1rem 0;
  border-top:1px solid var(--line);
}
.contact-detail:first-child { border-top:none; padding-top:0; }
.contact-detail-value { font-size:1rem; color:var(--nuit); line-height:1.75; }
.contact-card {
  background:var(--card);
  border:1px solid var(--line);
  border-radius:28px;
  padding:clamp(1.4rem, 3vw, 2rem);
  box-shadow:var(--shadow);
}
.contact-card h3 {
  margin:0 0 1rem;
  font-family:'Playfair Display',serif;
  font-size:1.8rem;
  font-weight:500;
}
.contact-links { display:grid; gap:.2rem; margin-top:1rem; }
.contact-link {
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:center;
  padding:1rem 0;
  border-top:1px solid var(--line);
}
.contact-link strong { font-size:1rem; font-weight:400; line-height:1.6; }
.contact-button {
  display:inline-flex;
  margin-top:1.4rem;
  align-items:center;
  justify-content:center;
  gap:.9rem;
  min-height:50px;
  padding:1rem 1.3rem;
  border-radius:999px;
  background:var(--nuit);
  color:var(--creme);
  font-family:'Space Mono',monospace;
  font-size:.66rem;
  letter-spacing:.18em;
  text-transform:uppercase;
}

footer { background:var(--nuit); color:var(--sable); padding:3rem 0; }
.footer-inner {
  display:flex;
  justify-content:space-between;
  gap:2rem;
  align-items:center;
  flex-wrap:wrap;
}
.footer-logo { font-family:'Playfair Display',serif; font-size:2rem; color:var(--argile); }
.footer-copy {
  font-family:'Space Mono',monospace;
  font-size:.58rem;
  letter-spacing:.16em;
  line-height:1.9;
  color:rgba(232,213,176,.45);
  text-transform:uppercase;
  text-align:right;
}

.fade { opacity:0; transform:translateY(28px); transition:opacity .8s ease, transform .8s ease; }
.fade.visible { opacity:1; transform:translateY(0); }
.delay-1 { transition-delay:.10s; }
.delay-2 { transition-delay:.20s; }

.scroll-top{
position:fixed;bottom:86px;right:18px;width:52px;height:52px;border-radius:50%;
display:flex;align-items:center;justify-content:center;
background:rgba(28,18,8,.88);color:#fff;font-size:24px;text-decoration:none;
box-shadow:0 10px 25px rgba(0,0,0,.22);z-index:220;opacity:0;pointer-events:none;
transform:translateY(12px);transition:.25s ease;
}
.scroll-top.show{opacity:1;pointer-events:auto;transform:translateY(0);}
@media(min-width:781px){.scroll-top{display:none;}}

.whatsapp-float {
  position:fixed; bottom:18px; right:18px; width:58px; height:58px; border-radius:50%;
  background:#25D366; color:white; display:none; align-items:center; justify-content:center;
  font-size:26px; box-shadow:0 12px 30px rgba(0,0,0,.20); z-index:200; border:2px solid rgba(255,255,255,.55);
}

@media (max-width:1080px) {
  .hero,
  .vol-grid,
  .contact-grid,
  .terrain-grid,
  .mission { grid-template-columns:1fr; }
  .hero { min-height:auto; gap:24px; }
  .hero-left { padding:5rem 0 1rem; }
  .hero-right { padding:0 0 1rem; }
  .hero-frame { min-height:56vh; }
  .mission-number { margin-bottom:.4rem; }
  .mission-heading {
    padding-right:0;
    border-right:none;
    border-bottom:1px solid var(--line);
    padding-bottom:1.2rem;
  }
  .mission-body { padding-left:0; }
  .terrain-card { min-height:auto; }
  .mosaic {
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto;
  }
  .mosaic-item:first-child { grid-row:auto; min-height:380px; }
}

@media (max-width:780px) {
  .container { width:min(calc(100% - 24px), 1240px); }
  nav { position:sticky; }
  .nav-inner {
    min-height:auto;
    flex-wrap:wrap;
    justify-content:center;
    gap:.7rem 1rem;
    padding:12px 0;
  }
  .nav-logo { width:100%; text-align:center; }
  .nav-links {
    order:3;
    width:100%;
    flex-wrap:wrap;
    gap:.6rem .9rem;
  }
  .nav-links a {
    display:inline-flex;
    padding:.45rem .65rem;
    border-radius:999px;
    background:rgba(255,255,255,.42);
    border:1px solid var(--line);
    letter-spacing:.1em;
  }
  .nav-cta {
    width:100%;
    max-width:360px;
    padding:.95rem 1rem;
  }
  .hero-title { max-width:11ch; }
  .hero-desc { font-size:.98rem; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .hero-cta, .hero-secondary, .contact-button { width:100%; }
  .hero-frame { min-height:420px; border-radius:26px; }
  .hero-note {
    position:static;
    margin:1rem;
    max-width:none;
  }
  .terrain-header, .gallery-head { flex-direction:column; align-items:start; }
  .profile { flex-direction:column; align-items:flex-start; }
  .profile span { text-align:left; }
  .mosaic { grid-template-columns:1fr; gap:10px; }
  .mosaic-item, .mosaic-item:first-child { min-height:250px; }
  .contact-detail { grid-template-columns:1fr; gap:.35rem; }
  .footer-copy { text-align:left; }
  .whatsapp-float { display:flex; }
}

@media (max-width:520px) {
  section, .terrain-wrap { padding:4.25rem 0; }
  .hero-left { padding-top:4.3rem; }
  .hero-title { font-size:clamp(2.35rem, 11vw, 3.2rem); }
  .hero-frame { min-height:360px; }
  .terrain-card,
  .contact-card { border-radius:22px; }
}

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

/* === Premium responsive refresh === */
:root{
  --argile:#c56a39;
  --terre:#8f4728;
  --sable:#e9dcc0;
  --creme:#f8f2e6;
  --nuit:#1a120c;
  --khaki:#6d6247;
  --line:rgba(28,18,8,.08);
  --glass:rgba(255,255,255,.64);
  --glass-strong:rgba(255,255,255,.82);
  --radius-xl:32px;
  --radius-lg:24px;
  --radius-md:18px;
  --shadow:0 24px 70px rgba(28,18,8,.12);
  --shadow-soft:0 14px 34px rgba(28,18,8,.08);
}
body{
  background:
    radial-gradient(circle at top left, rgba(197,106,57,.08), transparent 24%),
    radial-gradient(circle at 100% 20%, rgba(109,98,71,.06), transparent 28%),
    linear-gradient(180deg, #fbf7ef 0%, #f5efe2 100%);
}
.container{width:min(1320px, calc(100% - 40px));}
nav{
  backdrop-filter: blur(16px);
  background:rgba(248,242,230,.78);
  box-shadow:0 6px 24px rgba(28,18,8,.04);
}
.nav-inner{
  min-height:84px;
  gap:20px;
}
.nav-logo{
  font-size:.86rem;
  letter-spacing:.30em;
}
.nav-toggle{
  display:none;
  border:1px solid rgba(28,18,8,.12);
  background:rgba(255,255,255,.6);
  color:var(--nuit);
  border-radius:14px;
  width:48px;
  height:48px;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:var(--shadow-soft);
}
.nav-toggle span,
.nav-toggle::before,
.nav-toggle::after{
  content:"";
  display:block;
  width:18px;
  height:2px;
  background:currentColor;
  border-radius:999px;
  transition:transform .25s ease, opacity .25s ease;
}
.nav-toggle span{position:relative;}
.nav-toggle::before{transform:translateY(-6px);}
.nav-toggle::after{transform:translateY(6px);}
.nav-toggle.is-open span{opacity:0;}
.nav-toggle.is-open::before{transform:rotate(45deg) translate(1px, 1px);}
.nav-toggle.is-open::after{transform:rotate(-45deg) translate(1px, -1px);}
.nav-links{
  gap:1.4rem;
}
.nav-links li{list-style:none;}
.nav-links a{
  position:relative;
  font-size:.68rem;
  letter-spacing:.16em;
}
.nav-links a::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-8px;
  height:1px;
  background:var(--argile);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .25s ease;
}
.nav-links a:hover::after,
.nav-links a:focus-visible::after{transform:scaleX(1);}
.nav-cta,
.hero-cta,
.hero-secondary,
.contact-button{
  transition:transform .22s ease, box-shadow .22s ease, background .22s ease;
}
.nav-cta:hover,
.hero-cta:hover,
.hero-secondary:hover,
.contact-button:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 34px rgba(28,18,8,.12);
}
.hero{
  align-items:center;
  gap:3rem;
  min-height:calc(100vh - 84px);
}
.hero-left{
  padding:7rem 0 4rem;
}
.hero-title{
  max-width:10ch;
  font-size:clamp(2.6rem, 6vw, 5.2rem);
  line-height:.92;
  letter-spacing:-.04em;
}
.hero-desc{
  font-size:1.03rem;
  max-width:62ch;
  line-height:1.95;
  color:#66583f;
}
.hero-actions{
  gap:1rem;
  margin-top:.4rem;
}
.hero-cta,
.hero-secondary{
  min-height:54px;
  padding:1rem 1.35rem;
  font-size:.68rem;
}
.hero-secondary{
  background:var(--glass-strong);
}
.hero-right{padding:1rem 0 1rem 1rem;}
.hero-frame{
  min-height:82vh;
  border-radius:36px;
  box-shadow:0 34px 90px rgba(28,18,8,.18);
}
.hero-frame::before{
  content:"";
  position:absolute;
  inset:16px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.22);
  z-index:1;
  pointer-events:none;
}
.hero-meta{
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:16px;
  margin-top:2.6rem;
}
.meta-card,
.contact-card,
.profile,
.terrain-card{
  border:1px solid var(--line);
}
.meta-card{
  border-radius:20px;
  background:var(--glass);
}
section{padding:7.5rem 0;}
.section-label{opacity:.88;}
.mission{
  gap:1.2rem;
  align-items:start;
}
.mission-heading h2,
.terrain-header h2,
.vol-title,
.gallery-head h2,
.contact-title{
  letter-spacing:-.03em;
}
.terrain-wrap{
  position:relative;
  overflow:hidden;
}
.terrain-wrap::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top right, rgba(197,106,57,.11), transparent 24%),
    radial-gradient(circle at bottom left, rgba(233,220,192,.06), transparent 26%);
  pointer-events:none;
}
.terrain-grid{
  gap:18px;
  background:transparent;
}
.terrain-card{
  background:rgba(31,20,11,.88);
  border-radius:24px;
  box-shadow:0 18px 40px rgba(0,0,0,.16);
}
.profiles{
  gap:14px;
  background:transparent;
  box-shadow:none;
}
.profile{
  border-radius:20px;
  background:rgba(255,255,255,.56);
  box-shadow:var(--shadow-soft);
}
.gallery-head span{opacity:.75;}
.mosaic{
  gap:12px;
  grid-template-rows:320px 320px;
}
.mosaic-item{
  border-radius:22px !important;
  box-shadow:var(--shadow-soft);
}
.contact-card{
  background:rgba(255,255,255,.68);
  box-shadow:var(--shadow);
}
.contact-link{
  border-top:1px solid rgba(28,18,8,.07);
}
footer{
  padding:3.4rem 0;
}
.footer-inner{
  align-items:flex-end;
}
.whatsapp-float,
.scroll-top{
  backdrop-filter:blur(12px);
}
.scroll-top{
  background:rgba(28,18,8,.86);
}
@media (max-width:1080px){
  .hero{
    grid-template-columns:1fr;
    gap:2rem;
    min-height:auto;
  }
  .hero-left{padding:5.5rem 0 1rem;}
  .hero-right{padding:0;}
  .hero-frame{min-height:58vh;}
  .vol-grid,
  .contact-grid{
    gap:2.5rem;
  }
}
@media (max-width:780px){
  .container{width:min(100% - 22px, 1320px);}
  nav{position:sticky; top:0;}
  .nav-inner{
    min-height:auto;
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    padding:.75rem 0;
  }
  .nav-toggle{display:inline-flex;}
  .nav-links{
    grid-column:1 / -1;
    display:none;
    flex-direction:column;
    gap:.2rem;
    width:100%;
    margin:.4rem 0 0;
    padding:.5rem;
    border:1px solid rgba(28,18,8,.08);
    border-radius:18px;
    background:rgba(255,255,255,.74);
    box-shadow:var(--shadow-soft);
  }
  .nav-links.open{display:flex;}
  .nav-links li{width:100%;}
  .nav-links a{
    display:block;
    padding:.95rem 1rem;
    border-radius:14px;
    font-size:.68rem;
    letter-spacing:.12em;
    background:transparent;
  }
  .nav-links a::after{display:none;}
  .nav-links a:hover,
  .nav-links a:focus-visible{
    background:rgba(197,106,57,.08);
  }
  .nav-cta{display:none;}
  .hero-left{padding:4.2rem 0 .6rem;}
  .hero-title{
    max-width:unset;
    font-size:clamp(2.35rem, 11vw, 3.8rem);
  }
  .hero-desc{
    font-size:.98rem;
    line-height:1.82;
  }
  .hero-actions{
    flex-direction:column;
    align-items:stretch;
  }
  .hero-cta, .hero-secondary, .contact-button{
    width:100%;
    justify-content:center;
  }
  .hero-frame{
    min-height:48vh;
    border-radius:26px;
  }
  .hero-meta{
    grid-template-columns:1fr;
  }
  section{
    padding:5.25rem 0;
  }
  .mission-number{
    font-size:3.2rem;
  }
  .terrain-header,
  .gallery-head{
    flex-direction:column;
    align-items:flex-start;
  }
  .terrain-card,
  .contact-card{
    padding:1.5rem 1.2rem;
  }
  .mosaic{
    grid-template-columns:1fr;
    grid-template-rows:auto;
    gap:10px;
  }
  .mosaic-item{
    min-height:220px;
  }
  .footer-inner{
    align-items:flex-start;
  }
  .footer-copy{
    text-align:left;
  }
}

/* === Depth + alignment refinements === */
section,
.terrain-wrap,
.quote-section,
.gallery-dark,
footer{
  position:relative;
  isolation:isolate;
}

section::before,
.terrain-wrap::after,
.quote-section::before,
.gallery-dark::before{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(28,18,8,.08), transparent);
  pointer-events:none;
}

.hero{
  position:relative;
}
.hero::before{
  content:"";
  position:absolute;
  left:-4%;
  top:8%;
  width:42%;
  height:78%;
  background:radial-gradient(circle, rgba(197,106,57,.08) 0%, rgba(197,106,57,0) 72%);
  filter:blur(10px);
  pointer-events:none;
  z-index:0;
}
.hero-left,
.hero-right{
  position:relative;
  z-index:1;
}

.hero-meta{
  align-items:stretch;
}
.meta-card{
  position:relative;
  overflow:hidden;
  min-height:100%;
  background:linear-gradient(180deg, rgba(255,255,255,.78) 0%, rgba(255,255,255,.58) 100%);
}
.meta-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:linear-gradient(90deg, rgba(197,106,57,.9), rgba(233,220,192,.2));
}
.meta-card::after{
  content:"";
  position:absolute;
  right:-12px;
  bottom:-18px;
  width:74px;
  height:74px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(197,106,57,.08), rgba(197,106,57,0) 70%);
}

.mission{
  position:relative;
  padding:2.1rem 2rem;
  border-radius:30px;
  background:linear-gradient(180deg, rgba(255,255,255,.42), rgba(255,255,255,.22));
  border:1px solid rgba(28,18,8,.06);
  box-shadow:0 16px 40px rgba(28,18,8,.05);
}
.mission::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:30px;
  pointer-events:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
.mission-number{
  align-self:start;
  margin-top:.35rem;
}

.quote-section{
  overflow:hidden;
}
.quote-section::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 15% 25%, rgba(255,255,255,.10), transparent 22%),
    radial-gradient(circle at 85% 70%, rgba(255,255,255,.08), transparent 20%);
  pointer-events:none;
}
.quote-inner{
  position:relative;
  z-index:1;
}

.gallery-dark{
  overflow:hidden;
}
.gallery-dark::after{
  content:"";
  position:absolute;
  right:-140px;
  top:-90px;
  width:360px;
  height:360px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(197,106,57,.14), rgba(197,106,57,0) 70%);
  pointer-events:none;
}

.contact-grid{
  position:relative;
}
.contact-grid::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-18px;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(28,18,8,.10), transparent);
}
.contact-card{
  position:relative;
  overflow:hidden;
}
.contact-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:4px;
  background:linear-gradient(90deg, var(--argile), rgba(197,106,57,.15));
}
.contact-card::after{
  content:"";
  position:absolute;
  right:-45px;
  bottom:-55px;
  width:150px;
  height:150px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(197,106,57,.09), rgba(197,106,57,0) 70%);
  pointer-events:none;
}

.profile,
.terrain-card,
.contact-card,
.meta-card,
.mosaic-item,
.hero-frame{
  transform:translateZ(0);
}

@media (min-width:781px){
  .hero-meta{
    margin-left:0;
    max-width:760px;
  }
}

@media (max-width:780px){
  .mission{
    padding:1.3rem 1rem;
    border-radius:22px;
  }
  .hero-meta{
    margin-top:2rem;
  }
}

/* === Editorial / high-end refinement === */
:root{
  --section-space: 8.2rem;
  --section-space-mobile: 5.6rem;
}

body{
  background:
    radial-gradient(circle at top left, rgba(197,106,57,.08), transparent 22%),
    radial-gradient(circle at 100% 18%, rgba(109,98,71,.06), transparent 24%),
    linear-gradient(180deg, #fcf8f1 0%, #f6efe2 100%);
}

section{
  padding:var(--section-space) 0;
}

.section-label{
  display:inline-flex;
  align-items:center;
  gap:.9rem;
  margin-bottom:1.2rem;
}
.section-label::before{
  content:"";
  width:34px;
  height:1px;
  background:rgba(197,106,57,.65);
}

.hero{
  gap:4.2rem;
}
.hero-left{
  max-width:720px;
}
.hero-title{
  max-width:9ch;
  text-wrap:balance;
}
.hero-desc{
  max-width:58ch;
}
.hero-note{
  border-radius:22px;
  background:rgba(248,242,230,.9);
  box-shadow:0 24px 60px rgba(28,18,8,.16);
}

.mission{
  grid-template-columns:90px 1fr 1.05fr;
  gap:0 2.2rem;
  padding:2.6rem 2.4rem;
  background:
    linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.28));
}
.mission-heading{
  padding-right:2.4rem;
}
.mission-heading h2{
  max-width:12ch;
}
.mission-body{
  max-width:62ch;
}
.tags{
  margin-top:1.9rem;
}
.tag{
  background:rgba(255,255,255,.52);
  backdrop-filter:blur(4px);
}

.terrain-wrap{
  padding:8rem 0;
}
.terrain-header{
  margin-bottom:3rem;
}
.terrain-header h2{
  max-width:10ch;
}
.terrain-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
}
.terrain-card{
  min-height:100%;
  position:relative;
  overflow:hidden;
}
.terrain-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:linear-gradient(90deg, rgba(197,106,57,.92), rgba(233,220,192,.18));
}
.terrain-card::after{
  content:"";
  position:absolute;
  right:-32px;
  bottom:-40px;
  width:120px;
  height:120px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(197,106,57,.11), rgba(197,106,57,0) 72%);
  pointer-events:none;
}

.vol-grid{
  gap:6rem;
  align-items:start;
}
.vol-title{
  max-width:10ch;
}
.vol-text{
  max-width:60ch;
}
.profiles{
  gap:16px;
}
.profile{
  position:relative;
  padding:1.2rem 1.35rem;
}
.profile::before{
  content:"";
  position:absolute;
  left:0;
  top:16%;
  bottom:16%;
  width:3px;
  border-radius:999px;
  background:linear-gradient(180deg, rgba(197,106,57,.9), rgba(197,106,57,.2));
}

.quote-section{
  padding:6.8rem 0;
}
.quote-inner{
  position:relative;
  padding-left:2rem;
}
.quote-inner::before{
  content:"“";
  position:absolute;
  left:-.15rem;
  top:-1.25rem;
  font-family:'Playfair Display',serif;
  font-size:6rem;
  line-height:1;
  color:rgba(255,255,255,.22);
}

.gallery-dark{
  padding:8rem 0;
}
.gallery-head{
  margin-bottom:3rem;
}
.gallery-head h2{
  max-width:11ch;
}
.mosaic{
  grid-template-columns:1.6fr 1fr 1fr;
  grid-template-rows:340px 340px;
}
.mosaic-item{
  overflow:hidden;
}
.mosaic-item::before{
  content:"";
  position:absolute;
  inset:0;
  border:1px solid rgba(255,255,255,.08);
  z-index:2;
  border-radius:inherit;
  pointer-events:none;
}

.contact-grid{
  gap:6rem;
  align-items:start;
}
.contact-title{
  max-width:10ch;
}
.contact-text{
  max-width:58ch;
}
.contact-list{
  gap:1.2rem;
}
.contact-detail{
  padding:.25rem 0;
}
.contact-card{
  padding:2.2rem;
}
.contact-card h3{
  margin-bottom:1.3rem;
}
.contact-links{
  margin-top:1.4rem;
}
.contact-link{
  padding:1.05rem 0;
}

footer{
  position:relative;
}
footer::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(232,213,176,.18), transparent);
}

@media (max-width:1080px){
  section{
    padding:7rem 0;
  }
  .mission{
    grid-template-columns:1fr;
    gap:1.35rem;
    padding:2rem 1.5rem;
  }
  .mission-heading{
    padding-right:0;
  }
  .mission-heading h2,
  .terrain-header h2,
  .vol-title,
  .gallery-head h2,
  .contact-title{
    max-width:none;
  }
  .vol-grid,
  .contact-grid{
    gap:3rem;
  }
  .mosaic{
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto;
  }
}

@media (max-width:780px){
  section{
    padding:var(--section-space-mobile) 0;
  }
  .hero{
    gap:2.3rem;
  }
  .hero-title{
    max-width:none;
  }
  .hero-note{
    right:16px;
    left:16px;
    bottom:16px;
    max-width:none;
  }
  .quote-inner{
    padding-left:1rem;
  }
  .quote-inner::before{
    font-size:4.2rem;
    top:-.6rem;
  }
  .terrain-wrap,
  .gallery-dark{
    padding:var(--section-space-mobile) 0;
  }
  .mosaic{
    grid-template-columns:1fr;
    gap:12px;
  }
  .mosaic-item{
    min-height:230px;
  }
  .contact-card{
    padding:1.5rem 1.15rem;
  }
}

/* mission title fix */
.mission-heading h2{
  margin:0;
  font-family:'Playfair Display',serif;
  font-size:clamp(2rem,4vw,3.4rem);
  line-height:1.05;
  font-weight:500;
}

/* final mission layout fix */
#mission .mission{
  display:block !important;
  padding:2.8rem 2.4rem !important;
  border-radius:30px;
}
#mission .mission-heading{
  padding-right:0 !important;
  border-right:none !important;
  border-bottom:1px solid rgba(28,18,8,.08);
  padding-bottom:1rem;
  margin-bottom:1.35rem;
}
#mission .mission-heading h2{
  max-width:none !important;
  font-size:clamp(2rem, 4vw, 3.2rem) !important;
  line-height:1.05 !important;
}
#mission .mission-body{
  max-width:none !important;
  padding-left:0 !important;
}
#mission .mission-body p{
  max-width:70ch;
}
#mission .tags{
  margin-top:1.5rem;
}
@media (max-width:780px){
  #mission .mission{
    padding:1.45rem 1.1rem !important;
    border-radius:22px;
  }
  #mission .mission-heading h2{
    font-size:1.85rem !important;
  }
}

/* === Final spacing + title sizing cleanup === */
:root{
  --section-space: 5.6rem;
  --section-space-mobile: 3.9rem;
}

section{
  padding: var(--section-space) 0 !important;
}
.terrain-wrap,
.gallery-dark,
.quote-section{
  padding: var(--section-space) 0 !important;
}

.hero{
  gap: 2.6rem !important;
}
.hero-left{
  padding: 5.4rem 0 2.2rem !important;
}
.hero-right{
  padding: .2rem 0 1rem !important;
}

.terrain-header,
.gallery-head{
  margin-bottom: 1.4rem !important;
}
.terrain-wrap .container,
.gallery-dark .container,
#volontaires .container,
#contact .container{
  row-gap: 2.1rem !important;
}

.mission{
  padding: 2rem 1.8rem !important;
}
#mission .mission{
  padding: 2rem 1.8rem !important;
}
#mission .mission-heading{
  padding-bottom: .75rem !important;
  margin-bottom: 1rem !important;
}

.mission-heading h2,
.terrain-header h2,
.vol-title,
.gallery-head h2,
.contact-title{
  font-size: clamp(1.5rem, 2.2vw, 2.15rem) !important;
  line-height: 1.06 !important;
  letter-spacing: -.02em !important;
  max-width: none !important;
  white-space: nowrap;
}

.terrain-card h3,
.contact-card h3{
  font-size: clamp(1.05rem, 1.4vw, 1.3rem) !important;
  line-height: 1.15 !important;
  white-space: nowrap;
}

.section-label{
  margin-bottom: .7rem !important;
}

.vol-title,
.contact-title,
.mission-heading h2{
  margin-bottom: 0 !important;
}

.vol-grid,
.contact-grid{
  gap: 2.8rem !important;
}

.contact-text,
.vol-text{
  margin-bottom: .85rem !important;
}

.contact-card{
  padding: 1.5rem 1.35rem !important;
}
.terrain-card{
  padding: 1.6rem 1.3rem !important;
}

.quote-section blockquote{
  font-size: clamp(1.4rem, 2.2vw, 2rem) !important;
  line-height: 1.4 !important;
}

@media (max-width: 780px){
  section,
  .terrain-wrap,
  .gallery-dark,
  .quote-section{
    padding: var(--section-space-mobile) 0 !important;
  }

  .hero{
    gap: 1.5rem !important;
  }
  .hero-left{
    padding: 4rem 0 .8rem !important;
  }

  .mission,
  #mission .mission{
    padding: 1.35rem 1rem !important;
  }

  .mission-heading h2,
  .terrain-header h2,
  .vol-title,
  .gallery-head h2,
  .contact-title{
    font-size: clamp(1.12rem, 5vw, 1.32rem) !important;
    white-space: nowrap;
  }

  .terrain-card h3,
  .contact-card h3{
    font-size: clamp(.92rem, 4.2vw, 1.02rem) !important;
    white-space: nowrap;
  }

  .terrain-header,
  .gallery-head{
    margin-bottom: 1rem !important;
  }

  .vol-grid,
  .contact-grid{
    gap: 1.7rem !important;
  }

  .terrain-card,
  .contact-card{
    padding: 1.2rem 1rem !important;
  }
}

/* === Warm titles + better title/text spacing === */
.mission-heading h2,
.terrain-header h2,
.vol-title,
.gallery-head h2,
.contact-title{
  white-space: normal !important;
  font-size: clamp(1.7rem, 2.6vw, 2.45rem) !important;
  line-height: 1.08 !important;
}

.mission-heading h2{
  margin-bottom: 0 !important;
}
.mission-body{
  padding-top: .15rem;
}
.mission-body p:first-child{
  margin-top: 0 !important;
}
#mission .mission-heading{
  margin-bottom: 1.2rem !important;
  padding-bottom: .9rem !important;
}

.terrain-header{
  margin-bottom: 1.9rem !important;
}
.terrain-header h2{
  margin-bottom: .55rem !important;
}
.terrain-header p{
  margin-top: .2rem !important;
}

.vol-title{
  margin-bottom: 1rem !important;
}
.vol-text{
  margin-bottom: 1rem !important;
}

.gallery-head{
  margin-bottom: 1.8rem !important;
}
.gallery-head h2{
  margin-bottom: .35rem !important;
}

.contact-title{
  margin-bottom: 1rem !important;
}
.contact-text{
  margin-bottom: 1.3rem !important;
}

.contact-card h3{
  white-space: normal !important;
  margin-bottom: 1rem !important;
}

.section-label{
  margin-bottom: .85rem !important;
}

@media (max-width: 780px){
  .mission-heading h2,
  .terrain-header h2,
  .vol-title,
  .gallery-head h2,
  .contact-title{
    font-size: clamp(1.28rem, 6vw, 1.65rem) !important;
    line-height: 1.12 !important;
  }

  #mission .mission-heading{
    margin-bottom: 1rem !important;
    padding-bottom: .75rem !important;
  }

  .terrain-header,
  .gallery-head{
    margin-bottom: 1.25rem !important;
  }

  .vol-title,
  .contact-title{
    margin-bottom: .8rem !important;
  }

  .contact-text,
  .vol-text{
    margin-bottom: .9rem !important;
  }
}

/* === Hero frame fit refinement === */
.hero-right{
  align-items:stretch !important;
}
.hero-frame{
  aspect-ratio: 4 / 5;
  min-height: clamp(420px, 72vh, 760px) !important;
  height: 100%;
}
.hero-frame img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}
@media (min-width:1200px){
  .hero-frame{
    aspect-ratio: 5 / 6;
  }
}
@media (max-width:1080px){
  .hero-frame{
    aspect-ratio: 16 / 10;
    min-height: 420px !important;
  }
}
@media (max-width:780px){
  .hero-frame{
    aspect-ratio: 4 / 3;
    min-height: 320px !important;
    border-radius:24px !important;
  }
  .hero-frame img{
    object-position:center 38%;
  }
}

/* === Real hero image fit fix === */
.hero-right{
  display:flex !important;
  align-items:center !important;
}
.hero-frame{
  width:100%;
  height:clamp(460px, 78vh, 820px) !important;
  min-height:auto !important;
  aspect-ratio:auto !important;
  overflow:hidden;
}
.hero-frame img{
  width:100%;
  height:100%;
  object-fit:contain !important;
  object-position:center center !important;
  background:#d9c8a7;
}
@media (max-width:1080px){
  .hero-frame{
    height:520px !important;
  }
}
@media (max-width:780px){
  .hero-frame{
    height:360px !important;
    border-radius:22px !important;
  }
}

/* === Fix hero image/frame ratio based on actual visual === */
.hero{
  align-items:center !important;
}

.hero-right{
  display:flex !important;
  align-items:center !important;
}

.hero-frame{
  width:100%;
  height:auto !important;
  min-height:unset !important;
  aspect-ratio: 16 / 10 !important;
  border-radius:34px !important;
  overflow:hidden !important;
  background:var(--khaki) !important;
}

.hero-frame img{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:cover !important;
  object-position:center center !important;
  background:transparent !important;
}

@media (max-width:1080px){
  .hero-frame{
    aspect-ratio: 16 / 9 !important;
  }
}

@media (max-width:780px){
  .hero-frame{
    aspect-ratio: 4 / 3 !important;
    border-radius:24px !important;
  }
  .hero-frame img{
    object-position:center center !important;
  }
}

