/* =========================================================
   Voyages d'Aventure — thème Drupal 11
   Carnet de voyage authentique : papier, tampons, cartes postales.
   ========================================================= */

:root{
  --paper:      #ECE2CE;
  --paper-alt:  #E1D3B4;
  --card:       #F6EFDF;
  --ink:        #2B2820;
  --ink-soft:   #55503f;
  --leather:    #5A3826;
  --leather-lt: #7C5236;
  --clay:       #A94A2A;
  --moss:       #5C6A48;
  --gold:       #A2812E;
  --rule:       rgba(43,40,32,0.16);
  --shadow:     rgba(43,40,32,0.22);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Source Serif 4', serif;
  font-size:17px;
  line-height:1.6;
  background-image: radial-gradient(circle at 1px 1px, rgba(43,40,32,0.05) 1px, transparent 0);
  background-size: 22px 22px;
}
img{max-width:100%; height:auto; display:block;}
a{color:inherit;}
h1,h2,h3{font-family:'Fraunces', serif; margin:0; letter-spacing:-0.01em;}

.visually-hidden.focusable.skip-link{
  position:absolute; left:-999px; top:0; background:#fff; padding:10px; z-index:999;
}
.visually-hidden.focusable.skip-link:focus{ left:10px; top:10px; }

.wrap{max-width:1140px; margin:0 auto; padding:0 28px;}

/* ---------- HEADER / NAV ---------- */
header.site-nav{
  background:var(--leather); color:#EFE3CC;
  border-bottom:4px double #3d2416;
}
.nav-inner{
  max-width:1140px; margin:0 auto; padding:16px 28px;
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:14px;
}
.brand{display:flex; align-items:center; gap:12px;}
.brand-logo img{filter: drop-shadow(0 0 0 transparent);}
.brand-text a{
  font-family:'Fraunces', serif; font-style:italic; font-weight:600; font-size:22px;
  color:#F3E7CE; text-decoration:none;
}
.brand-text small{
  display:block; font-family:'Space Mono', monospace; font-style:normal;
  font-size:10px; letter-spacing:0.16em; color:#C9A46A; margin-top:2px;
}
.nav-inner nav.links ul,
.nav-inner nav.links .menu{
  display:flex; gap:26px; flex-wrap:wrap; list-style:none; margin:0; padding:0;
}
.nav-inner nav.links a{
  font-family:'Space Mono', monospace; font-size:12px; letter-spacing:0.06em;
  text-decoration:none; color:#E7D8B8; text-transform:uppercase;
  padding-bottom:4px; border-bottom:1px solid transparent;
  transition:border-color .2s ease, color .2s ease;
}
.nav-inner nav.links a:hover,
.nav-inner nav.links a:focus{ border-color:#D8A857; color:#fff; }
.nav-inner nav.links a.is-active{ border-color:#D8A857; color:#fff; }

/* ---------- HERO / ÉDITO ---------- */
.hero{
  position:relative; overflow:hidden;
  background:var(--paper-alt); border-bottom:1px solid var(--rule);
}
.hero-inner{ padding:76px 28px 60px; position:relative; z-index:2; }
.hero-map{
  position:absolute; top:0; right:-60px; width:560px; height:100%;
  opacity:.55; z-index:1; pointer-events:none;
}
.hero h1, .hero h2{
  font-size:clamp(38px, 6vw, 64px); font-weight:600; max-width:15ch; color:var(--ink);
}
.hero em{ font-style:italic; font-weight:500; color:var(--clay); }
.hero p{ max-width:56ch; margin-top:20px; font-size:18px; color:var(--ink-soft); }

.eyebrow{
  font-family:'Space Mono', monospace; font-size:12px; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--clay); display:flex; align-items:center; gap:10px;
}
.eyebrow::before{ content:""; width:22px; height:1px; background:var(--clay); display:inline-block; }

.passport-strip{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:0; margin-top:44px; border-top:1px dashed var(--rule); border-bottom:1px dashed var(--rule);
}
.passport-strip div{ padding:18px 6px; text-align:center; border-right:1px dashed var(--rule); }
.passport-strip div:last-child{ border-right:none; }
.passport-strip .num{ font-family:'Fraunces', serif; font-weight:700; font-size:30px; color:var(--leather); }
.passport-strip .lbl{
  font-family:'Space Mono', monospace; font-size:10.5px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ink-soft); margin-top:4px;
}

/* ---------- LAYOUT: CONTENU + SIDEBAR ---------- */
.main-layout{ padding:56px 28px; }
.layout-columns{
  display:grid; grid-template-columns:2.1fr 1fr; gap:48px; align-items:start;
}
.layout-columns--full{ grid-template-columns:1fr; }
.breadcrumb-row{
  font-family:'Space Mono', monospace; font-size:12px; color:var(--ink-soft);
  margin-bottom:24px;
}
.breadcrumb-row ol{ list-style:none; display:flex; gap:8px; padding:0; margin:0; flex-wrap:wrap; }
.breadcrumb-row a{ text-decoration:none; color:var(--clay); }

.main-content section,
.main-content > .block{ margin-bottom:48px; }
.section-head{ margin-bottom:28px; }
.section-head h2{ font-size:clamp(24px,3vw,32px); font-weight:600; }

/* ---------- SIDEBAR BLOCKS ---------- */
.sidebar .block{
  background:var(--card); padding:22px 22px 26px; margin-bottom:26px;
  box-shadow:0 8px 18px -12px var(--shadow); border-left:4px solid var(--gold);
}
.sidebar .block:nth-of-type(2n){ border-left-color:var(--clay); }
.sidebar .block:nth-of-type(3n){ border-left-color:var(--moss); }
.sidebar h2.block-title,
.sidebar h2{
  font-family:'Fraunces', serif; font-style:italic; font-weight:600; font-size:19px;
  margin-bottom:14px; color:var(--leather);
}
.sidebar ul{ list-style:none; margin:0; padding:0; }
.sidebar li{
  padding:8px 0; border-top:1px dashed var(--rule); font-size:14.5px;
}
.sidebar li:first-child{ border-top:none; }
.sidebar a{ text-decoration:none; color:var(--ink-soft); }
.sidebar a:hover{ color:var(--clay); }

/* Bloc recherche */
.sidebar form.search-form,
.block-search-form-block{
  display:flex; gap:8px;
}
.sidebar input[type="search"],
.sidebar input[type="text"]{
  flex:1; padding:10px 12px; border:1px solid var(--rule); background:#fff;
  font-family:'Source Serif 4', serif;
}
.sidebar button,
.sidebar input[type="submit"]{
  background:var(--clay); color:#fff; border:none; padding:10px 16px;
  font-family:'Space Mono', monospace; font-size:11px; letter-spacing:.06em;
  text-transform:uppercase; cursor:pointer;
}
.sidebar button:hover{ background:var(--leather); }

/* ---------- POSTCARD (teaser de nœud) ---------- */
.postcard{
  background:var(--card); position:relative;
  box-shadow:0 10px 26px -14px var(--shadow), 0 2px 0 rgba(255,255,255,.4) inset;
  transform:rotate(-0.5deg);
  transition:transform .35s ease, box-shadow .35s ease;
  clip-path:polygon(0 0,100% 0,100% 98%,98% 100%,0 100%);
  margin-bottom:34px;
}
.postcard:hover{ transform:rotate(0deg) translateY(-4px); box-shadow:0 18px 34px -16px var(--shadow); }
.postcard .tape{
  position:absolute; top:-10px; left:50%; transform:translateX(-50%) rotate(-2deg);
  width:70px; height:22px; background:rgba(169,74,42,0.28); border:1px solid rgba(169,74,42,0.35);
}
.postcard .art{ border-bottom:1px solid var(--rule); overflow:hidden; }
.postcard .art img{ width:100%; height:150px; object-fit:cover; }
.postcard .body{ padding:20px 22px 24px; }
.postcard .kicker{
  font-family:'Space Mono', monospace; font-size:10.5px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--moss);
}
.postcard h3{ font-size:21px; font-weight:600; margin-top:6px; line-height:1.25; }
.postcard h3 a{ text-decoration:none; color:var(--ink); }
.postcard .teaser-summary{ margin-top:10px; font-size:14.5px; color:var(--ink-soft); }
.postcard .meta{
  margin-top:14px; display:flex; gap:14px; font-family:'Space Mono', monospace;
  font-size:11px; color:var(--ink-soft); border-top:1px dashed var(--rule); padding-top:12px;
}
.postcard a.more{
  display:inline-block; margin-top:14px; font-family:'Space Mono', monospace;
  font-size:11.5px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--clay); text-decoration:none; border-bottom:1px solid var(--clay);
}

/* Grille de cartes (pour les vues "Carnets de voyage") */
.view-carnets .view-content,
.postcard-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:34px;
}

/* ---------- FOOTER ---------- */
footer{ background:var(--leather); color:#D8C6A2; padding:48px 0 26px; border-top:4px double #3d2416; }
.footer-top{
  display:flex; justify-content:space-between; gap:30px; flex-wrap:wrap;
  padding-bottom:28px; border-bottom:1px solid rgba(239,227,204,0.2);
}
.footer-top .menu{ display:flex; gap:22px; flex-wrap:wrap; list-style:none; padding:0; margin:0; }
.footer-top a{
  text-decoration:none; color:#D8C6A2; font-family:'Space Mono', monospace;
  font-size:11.5px; text-transform:uppercase; letter-spacing:.05em;
}
.footer-top a:hover{ color:#fff; }
.footer-bottom{
  margin-top:22px; font-family:'Space Mono', monospace; font-size:11px; color:#B99E77;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 900px){
  .layout-columns{ grid-template-columns:1fr; }
  .hero-map{ display:none; }
}
@media (max-width: 640px){
  .nav-inner{ flex-direction:column; align-items:flex-start; }
  .main-layout{ padding:36px 20px; }
}
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .postcard{ transition:none; }
}
