/* ===========================================================
   France Trails — shared stylesheet
   Palette:
     --stone      #EDE9DD  paper / limestone facade
     --ink        #1A1D1E  primary text
     --seine      #17313B  deep teal-navy (Seine at dusk)
     --seine-2    #24505F  lighter teal for gradients/hover
     --glass      #C8D8D6  pyramid-glass pale accent
     --seal       #A6362B  wax-seal red, used sparingly for CTAs/official cues
     --gold       #9C7A3C  muted brass, for dividers/small accents
   Type:
     Display : 'Petrona' (serif, quiet elegance, less common than Playfair/Fraunces)
     Body    : 'Public Sans' (clean grotesk, easy long-form reading)
     Utility : 'JetBrains Mono' (departure-board / timetable numerals)
=========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Petrona:ital,wght@0,400;0,500;0,600;0,700;1,500&family=Public+Sans:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root{
  --stone:#EDE9DD;
  --stone-2:#E2DCCB;
  --ink:#1A1D1E;
  --ink-soft:#4A4F4C;
  --seine:#17313B;
  --seine-2:#24505F;
  --glass:#C8D8D6;
  --seal:#A6362B;
  --gold:#9C7A3C;
  --radius:2px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--stone);
  color:var(--ink);
  font-family:'Public Sans', system-ui, sans-serif;
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
  font-family:'Petrona', Georgia, serif;
  font-weight:600;
  line-height:1.15;
  margin:0 0 .5em;
  color:var(--seine);
}
h1{font-size:clamp(2.2rem,5vw,3.6rem); font-weight:700;}
h2{font-size:clamp(1.5rem,3vw,2.15rem);}
h3{font-size:1.3rem;}
p{margin:0 0 1.1em;}
a{color:var(--seine-2);}
a:focus-visible, button:focus-visible, input:focus-visible{
  outline:3px solid var(--seal); outline-offset:2px;
}
.mono{font-family:'JetBrains Mono', monospace;}
.wrap{max-width:1120px; margin:0 auto; padding:0 24px;}
.eyebrow{
  font-family:'JetBrains Mono', monospace;
  font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold); margin-bottom:.6em; display:block;
}

/* ---------- header / nav ---------- */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(237,233,221,.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(23,49,59,.15);
}
.nav-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 24px; max-width:1120px; margin:0 auto;
}
.brand{
  display:flex; align-items:center; gap:10px;
  font-family:'Petrona',serif; font-weight:700; font-size:1.25rem;
  color:var(--seine); text-decoration:none;
}
.brand svg{width:28px;height:28px;flex:none;}
.nav-links{display:flex; gap:28px; list-style:none; margin:0; padding:0;}
.nav-links a{
  color:var(--ink); text-decoration:none; font-weight:600; font-size:.95rem;
  padding-bottom:3px; border-bottom:2px solid transparent;
}
.nav-links a:hover, .nav-links a.active{border-color:var(--seal); color:var(--seine);}
.nav-toggle{display:none;}

/* ---------- language dropdown ---------- */
.lang-switch{position:relative;}
.lang-btn{
  display:flex; align-items:center; gap:6px;
  font-family:'JetBrains Mono', monospace; font-size:.82rem; font-weight:700;
  color:var(--seine); background:#fff; border:1px solid rgba(23,49,59,.25);
  border-radius:var(--radius); padding:8px 12px; cursor:pointer;
}
.lang-btn::after{content:"▾"; font-size:.7rem;}
.lang-menu{
  list-style:none; margin:6px 0 0; padding:6px;
  position:absolute; right:0; top:100%; min-width:170px;
  background:#fff; border:1px solid rgba(23,49,59,.18); border-radius:var(--radius);
  box-shadow:0 14px 30px -14px rgba(0,0,0,.35);
  display:none; z-index:60;
}
.lang-menu.open{display:block;}
.lang-menu li a{
  display:flex; justify-content:space-between; gap:10px;
  padding:9px 10px; border-radius:2px; text-decoration:none;
  color:var(--ink); font-size:.92rem; font-weight:600;
}
.lang-menu li a:hover{background:var(--stone);}
.lang-menu li a[aria-current="true"]{color:var(--seal);}
.lang-menu .lang-native{color:var(--ink-soft); font-weight:400; font-family:'Public Sans';}
@media (max-width:720px){
  .nav-row{flex-wrap:wrap; row-gap:10px;}
  .lang-switch{order:3; margin-left:auto;}
  .nav-toggle{order:2;}
}

@media (max-width:720px){
  .nav-links{
    position:absolute; top:100%; left:0; right:0;
    background:var(--stone); flex-direction:column; gap:0;
    max-height:0; overflow:hidden; border-bottom:1px solid rgba(23,49,59,.15);
    transition:max-height .25s ease;
  }
  .nav-links.open{max-height:320px;}
  .nav-links li{border-top:1px solid rgba(23,49,59,.1);}
  .nav-links a{display:block; padding:16px 24px;}
  .nav-toggle{
    display:block; background:none; border:1px solid var(--seine);
    border-radius:var(--radius); padding:8px 12px; font-size:1rem; cursor:pointer;
  }
}

/* ---------- hero ---------- */
.hero{
  background:linear-gradient(180deg, var(--seine) 0%, var(--seine-2) 100%);
  color:var(--stone); position:relative; overflow:hidden;
}
.hero .wrap{
  display:grid; grid-template-columns:1.1fr .9fr; gap:40px;
  align-items:center; padding-top:64px; padding-bottom:56px;
}
.hero h1{color:#fff;}
.hero p.lead{color:var(--glass); font-size:1.15rem; max-width:46ch;}
.hero-art{width:100%; height:auto;}
@media (max-width:860px){
  .hero .wrap{grid-template-columns:1fr; padding-top:40px;}
  .hero-art{max-width:340px; margin:0 auto;}
}

.cta-row{display:flex; gap:14px; flex-wrap:wrap; margin-top:1.4em;}
.btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'Public Sans'; font-weight:700; font-size:.95rem;
  padding:13px 22px; border-radius:var(--radius); text-decoration:none;
  border:1.5px solid transparent; transition:transform .12s ease, background .12s ease;
}
.btn:hover{transform:translateY(-1px);}
.btn-primary{background:var(--seal); color:#fff;}
.btn-primary:hover{background:#8c2c22;}
.btn-ghost{border-color:rgba(255,255,255,.5); color:#fff;}
.btn-ghost:hover{background:rgba(255,255,255,.08);}
.btn-outline{border-color:var(--seine); color:var(--seine);}
.btn-outline:hover{background:var(--seine); color:#fff;}

/* ---------- sections ---------- */
section{padding:64px 0;}
.section-tight{padding:40px 0;}
.divider{
  height:1px; border:0; margin:0;
  background:linear-gradient(90deg, var(--gold), transparent 70%);
  opacity:.6;
}

.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:40px;}
@media (max-width:860px){.grid-3{grid-template-columns:1fr 1fr;} .grid-2{grid-template-columns:1fr;}}
@media (max-width:560px){.grid-3{grid-template-columns:1fr;}}

.card{
  background:#fff; border:1px solid rgba(23,49,59,.12);
  border-radius:var(--radius); padding:26px;
}
.card h3{margin-bottom:.4em;}

/* ---------- departure board (signature element) ---------- */
.board{
  background:var(--seine); color:var(--glass);
  border-radius:var(--radius); padding:6px;
  font-family:'JetBrains Mono', monospace;
  box-shadow:0 18px 40px -18px rgba(0,0,0,.5);
}
.board-head{
  display:flex; justify-content:space-between; align-items:baseline;
  padding:14px 18px 8px; color:#fff;
}
.board-head .eyebrow{margin:0; color:var(--glass);}
.board-row{
  display:grid; grid-template-columns:1.4fr .7fr .7fr .9fr;
  gap:10px; padding:12px 18px;
  border-top:1px solid rgba(200,216,214,.18);
  font-size:.92rem;
}
.board-row.head-row{
  color:var(--gold); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase;
  border-top:none;
}
.board-row .flicker{color:#fff; font-weight:700;}
@media (max-width:640px){
  .board-row{grid-template-columns:1.2fr 1fr; row-gap:4px;}
  .board-row span:nth-child(3){grid-column:1;}
  .board-row span:nth-child(4){grid-column:2;}
}

/* ---------- fraud notice / trust callouts ---------- */
.notice{
  border-left:4px solid var(--seal);
  background:#fff; padding:18px 22px; border-radius:var(--radius);
  margin:1.6em 0;
}
.notice strong{color:var(--seal);}

/* ---------- FAQ ---------- */
.faq-item{border-bottom:1px solid rgba(23,49,59,.15); padding:18px 0;}
.faq-item summary{
  cursor:pointer; font-weight:700; color:var(--seine); list-style:none;
  display:flex; justify-content:space-between; gap:16px; font-size:1.05rem;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+"; font-family:monospace; font-size:1.3rem; color:var(--seal);}
.faq-item[open] summary::after{content:"–";}
.faq-item p{margin-top:12px; color:var(--ink-soft);}

/* ---------- map ---------- */
.map-frame{
  border:0; width:100%; height:320px; border-radius:var(--radius);
  filter:grayscale(.15) contrast(1.02);
}

/* ---------- footer ---------- */
footer{
  background:var(--seine); color:var(--glass); padding:56px 0 28px;
  margin-top:40px;
}
footer h4{color:#fff; font-family:'Public Sans'; font-size:.85rem; letter-spacing:.06em; text-transform:uppercase;}
footer a{color:var(--glass); text-decoration:none;}
footer a:hover{color:#fff; text-decoration:underline;}
.foot-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:32px;}
.foot-grid ul{list-style:none; margin:0; padding:0; display:grid; gap:8px;}
@media (max-width:780px){.foot-grid{grid-template-columns:1fr 1fr;}}
.social-row{display:flex; gap:12px; margin-top:14px;}
.social-row a{
  width:36px; height:36px; border:1px solid rgba(200,216,214,.4);
  border-radius:50%; display:flex; align-items:center; justify-content:center;
}
.foot-bottom{
  border-top:1px solid rgba(200,216,214,.2); margin-top:40px; padding-top:20px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-size:.85rem; color:rgba(200,216,214,.75);
}

/* ---------- attraction index cards on homepage ---------- */
.attr-card{
  position:relative; overflow:hidden; border-radius:var(--radius);
  background:#fff; border:1px solid rgba(23,49,59,.12);
  display:flex; flex-direction:column;
}
.attr-card .attr-art{background:var(--seine); padding:26px 26px 0;}
.attr-card .attr-body{padding:22px 24px 26px;}
.attr-card .tag{
  font-family:'JetBrains Mono'; font-size:.72rem; color:var(--seal); font-weight:700;
  text-transform:uppercase; letter-spacing:.06em;
}
.badge-soon{
  display:inline-block; font-family:'JetBrains Mono'; font-size:.7rem;
  background:var(--stone-2); color:var(--ink-soft); padding:4px 8px; border-radius:2px;
}

.skip-link{
  position:absolute; left:-999px; top:auto;
  background:var(--seal); color:#fff; padding:10px 16px; z-index:100;
}
.skip-link:focus{left:16px; top:16px;}

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