/* ============================================================
   MyCityGuides — design tokens
   ============================================================ */
:root{
  --color-primary: #2F6DB2;
  --color-primary-hover: #24598F;
  --color-primary-dark: #183E63;

  --color-accent: #B58A43;
  --color-accent-hover: #957033;

  --color-background: #F6F3E8;
  --color-surface: #FFFDF7;
  --color-dark-surface: #404336;

  --color-text: #383A31;
  --color-text-muted: #6F7064;
  --color-border: #D8D3C2;

  --color-white: #FFFFFF;

  --color-band: color-mix(in srgb, var(--color-border) 55%, var(--color-background));

  --font-display: "Fraunces", serif;
  --font-body: "Inter", sans-serif;

  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: 6.5rem;

  --max-width: 1180px;
  --ease-out: cubic-bezier(.16,.8,.3,1);
  --dur: 200ms;
}

/* ============================================================
   Reset
   ============================================================ */
*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  *, *::before, *::after{
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
body{ margin:0; }
img, svg{ display:block; max-width:100%; }
ul, ol{ margin:0; padding:0; list-style:none; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
input, select, textarea{ font:inherit; color:inherit; }
h1,h2,h3,p,dl,dd,figure,blockquote{ margin:0; }

body{
  background: var(--color-background);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

.wrap{
  max-width: var(--max-width);
  margin-inline: auto;
  padding-inline: var(--space-3);
}

.skip-link{
  position:absolute; left:-999px; top:0;
  background:var(--color-dark-surface); color:var(--color-white);
  padding:.75em 1.25em; z-index:200;
}
.skip-link:focus{ left: var(--space-2); top: var(--space-2); }

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

h1, h2, h3{
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: -0.01em;
  line-height: 1.08;
}
h2{ font-size: clamp(1.8rem, 1.45rem + 1.5vw, 2.7rem); }
h3{ font-size: 1.2rem; }

.section-lead{ color: var(--color-text-muted); max-width: 52ch; font-size: 1.05rem; }
.eyebrow-text{ color: var(--color-primary); }

/* ============================================================
   Tags & buttons
   ============================================================ */
.tag, .btn{
  display: inline-flex;
  align-items: center;
  gap: .5em;
  border-radius: 6px;
  padding: 0.6em 1.3em;
  white-space: nowrap;
}
.tag{
  background: var(--color-surface);
  border: 1.5px solid var(--color-border);
  font-family: var(--font-body);
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .03em;
  text-transform: uppercase;
  padding: .4em .9em;
  border-radius: 999px;
}
.tag.eyebrow{ margin-bottom: var(--space-2); }
.tag-price{ border-color: var(--color-accent); color: var(--color-accent); font-weight: 600; }

.btn{
  font-family: var(--font-body);
  font-weight: 600;
  font-size: .98rem;
  border: 1.5px solid transparent;
  transition: transform var(--dur) var(--ease-out), background var(--dur) var(--ease-out), color var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out);
}
.btn:hover{ transform: translateY(-1px); }
.btn-small{ font-size: .85rem; padding: .5em 1.1em; }
.btn-full{ width:100%; justify-content:center; }
.btn:disabled{ opacity:.55; cursor:not-allowed; transform:none; }

.btn-primary{ background: var(--color-primary); border-color: var(--color-primary); color: var(--color-white); }
.btn-primary:hover{ background: var(--color-primary-hover); border-color: var(--color-primary-hover); }

.btn-secondary{ background: var(--color-surface); color: var(--color-text); border-color: var(--color-border); }
.btn-secondary:hover{ background: color-mix(in srgb, var(--color-primary) 8%, var(--color-surface)); border-color: var(--color-primary); color: var(--color-text); }

.btn-ghost{ background: transparent; color: var(--color-white); border-color: color-mix(in srgb, var(--color-white) 55%, transparent); }
.btn-ghost:hover{ background: var(--color-white); color: var(--color-text); }

/* Language pill switch */
.lang-switch{
  display:inline-flex; align-items:center; border: 1.5px solid var(--color-border);
  border-radius: 999px; padding: 3px; gap:2px; font-family: var(--font-body);
}
.lang-switch a, .lang-switch span{
  font-size:.8rem; font-weight:700; letter-spacing:.02em;
  padding: .4em .85em; border-radius: 999px; line-height:1;
}
.lang-switch a[aria-current="page"]{ background: var(--color-text); color: var(--color-surface); }
.lang-switch span[aria-disabled="true"]{ color: var(--color-text-muted); opacity:.6; cursor:not-allowed; }

/* Placard: section eyebrow with signpost underline */
.placard{
  position: relative;
  display: inline-block;
  font-family: var(--font-body);
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  padding-bottom: var(--space-2);
  margin-bottom: var(--space-2);
}
.placard::after{
  content: ""; position: absolute; left: 0; bottom: 0;
  width: 34px; height: 3px; background: var(--color-accent);
}
.placard-light{ color: color-mix(in srgb, var(--color-white) 78%, transparent); }

.section-head{ margin-bottom: var(--space-4); max-width: 62ch; }
.section-head h2{ margin-bottom: var(--space-1); }

section{ padding-block: var(--space-6); }

/* ============================================================
   Header / Nav
   ============================================================ */
.site-header{
  position: sticky; top:0; z-index: 100;
  border-bottom: 1px solid var(--color-border);
}
.site-header::before{
  content:"";
  position:absolute; inset:0; z-index:-1;
  background: color-mix(in srgb, var(--color-surface) 94%, transparent);
  backdrop-filter: blur(6px);
}
.header-row{ display:flex; align-items:center; justify-content:space-between; padding-block: var(--space-3) 12px; }
.logo{ display:flex; align-items:center; color: var(--color-text); }
.logo-image{ height: 84px; width:auto; display:block; transform: translateY(-9.6px); }
.footer-grid .logo-image{ height: 88px; transform: translateY(-42px); }

.main-nav{ display:flex; align-items:center; gap: var(--space-4); }
.main-nav a:not(.btn){ font-size: 1.05rem; font-weight: 500; position: relative; padding-block: .25em; }
.main-nav a:not(.btn)[aria-current="page"]{ color: var(--color-primary); }
.main-nav a:not(.btn)::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:2px;
  background: var(--color-primary); transition: right var(--dur) var(--ease-out);
}
.main-nav a:not(.btn):hover::after{ right:0; }

.nav-toggle{ display:none; flex-direction:column; gap:5px; width:38px; height:38px; align-items:center; justify-content:center; }
.nav-toggle span{ width:22px; height:2px; background:var(--color-text); transition: transform var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out); }

/* ============================================================
   Photo placeholder frame
   ============================================================ */
.photo-frame{
  position: relative;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap: .6em;
  background:
    repeating-linear-gradient(135deg, var(--color-band), var(--color-band) 10px, var(--color-surface) 10px, var(--color-surface) 11px);
  border: 1.5px solid var(--color-border);
  color: var(--color-text-muted);
  text-align:center;
  padding: var(--space-2);
  aspect-ratio: var(--frame-ratio, 4 / 3);
  width: 100%;
}
img.photo-frame{ object-fit: cover; padding:0; background:none; display:block; }
.photo-frame svg{ width:30px; height:30px; opacity:.7; }
.photo-frame span{ font-family: var(--font-body); font-size: .72rem; letter-spacing:.02em; max-width: 26ch; line-height:1.4; }
.photo-frame-hero{ --frame-ratio: 6 / 5; }
.photo-frame-wide{ --frame-ratio: 16 / 7; }

/* ============================================================
   Hero
   ============================================================ */
.hero{ padding-top: var(--space-5); }
.hero-grid{ display:grid; grid-template-columns: 1.05fr 0.95fr; gap: var(--space-4); align-items:center; }
.hero-title{ font-size: clamp(2.2rem, 1.5rem + 3vw, 3.7rem); margin-bottom: var(--space-3); }
.hero-lead{ font-size: 1.12rem; color: var(--color-text-muted); max-width: 48ch; margin-bottom: var(--space-4); }
.hero-actions{ display:flex; gap: var(--space-2); flex-wrap:wrap; }

/* Full-bleed photo hero (index) */
.hero-photo{
  position:relative; overflow:hidden; padding:0;
  min-height: min(720px, 86vh);
  display:flex; align-items:center;
  color: var(--color-white);
}
.hero-photo-bg{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit: cover;
  object-position: center 65%;
}
.hero-scrim{
  position:absolute; inset:0;
  background: linear-gradient(180deg, color-mix(in srgb, var(--color-dark-surface) 12%, transparent) 0%, color-mix(in srgb, var(--color-dark-surface) 30%, transparent) 55%, color-mix(in srgb, var(--color-dark-surface) 58%, transparent) 100%);
}
.hero-figure{
  position:absolute; left: var(--space-4); bottom:0;
  height: 58%; width:auto; z-index:1; pointer-events:none;
}
.hero-photo-content{ position:relative; z-index:1; padding-block: var(--space-6); max-width: 46em; margin-inline: auto; text-align: center; }
.hero-photo-content .hero-actions{ justify-content:center; }
.hero-photo .hero-title{ color: var(--color-white); text-shadow: 0 2px 18px color-mix(in srgb, var(--color-dark-surface) 55%, transparent); }
.hero-photo .hero-lead{ color: color-mix(in srgb, var(--color-white) 95%, transparent); text-shadow: 0 1px 12px color-mix(in srgb, var(--color-dark-surface) 55%, transparent); }

.intro{ background: var(--color-band); }
.intro h2{ margin-bottom: var(--space-2); }
.intro .section-lead{ max-width: 60ch; margin-bottom: var(--space-3); }

/* ============================================================
   Tour cards
   ============================================================ */
.tour-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3); }
.tour-grid.tour-grid-full{ grid-template-columns: 1fr; gap: var(--space-2); }

.tour-card{
  background: var(--color-surface); border: 1.5px solid var(--color-border); border-top: 4px solid var(--color-primary);
  display:flex; flex-direction:column;
  transition: border-color var(--dur) var(--ease-out), transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);
}
.tour-card:hover{ border-color: var(--color-text); border-top-color: var(--color-primary); transform: translateY(-3px); box-shadow: 0 10px 24px -14px color-mix(in srgb, var(--color-dark-surface) 35%, transparent); }
.tour-card-body{ padding: var(--space-3); display:flex; flex-direction:column; gap: var(--space-1); flex:1; }
.tour-card header{ display:flex; align-items:flex-start; justify-content:space-between; gap: var(--space-2); flex-wrap:wrap; margin-bottom:.2em; }
.tour-card h3{ font-size: 1.35rem; }
.tour-card p{ color: var(--color-text-muted); font-size: .95rem; }
.tour-meta{ display:flex; flex-wrap:wrap; gap:.5em; margin: .5em 0; }
.highlight-list{ margin: .4em 0 var(--space-2); display:flex; flex-direction:column; gap:.35em; }
.highlight-list li{ font-size: .88rem; padding-left: 1.1em; position:relative; }
.highlight-list li::before{ content:""; position:absolute; left:0; top:.55em; width:6px; height:6px; background: var(--color-text-muted); }
.tour-card-footer{ margin-top:auto; padding-top: var(--space-2); }

/* Full tour detail block (touren.html) */
.tour-detail{ display:grid; grid-template-columns: 0.85fr 1.15fr; gap:0; scroll-margin-top: 130px; }
.tour-detail .tour-card-body{ padding: var(--space-4); }
.tour-detail-media{ display:flex; flex-direction:column; gap: var(--space-3); padding-top: var(--space-4); }
.tour-detail-media img{ width:100%; aspect-ratio: 3/4; object-fit:cover; display:block; border: 1.5px solid var(--color-border); }
.tour-detail-facts{ display:grid; grid-template-columns: repeat(2,1fr); gap: var(--space-2); margin: var(--space-2) 0 var(--space-3); border-top:1px solid var(--color-border); border-bottom:1px solid var(--color-border); padding-block: var(--space-2); }
.tour-detail-facts dt{ font-family: var(--font-body); font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color: var(--color-text-muted); }
.tour-detail-facts dd{ margin:0; font-weight:600; font-size:.95rem; }
.tour-detail-map{ display:block; width:100%; max-width:480px; height:auto; margin: var(--space-3) 0; border: 1.5px solid var(--color-border); }
.tour-detail .tour-card-footer{ margin-top: var(--space-3); }

/* ============================================================
   Process steps
   ============================================================ */
.process{ background: var(--color-band); }
.process-list{ display:grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-4); }
.step-num{ display:block; font-family: var(--font-body); font-size: .9rem; color: var(--color-accent); margin-bottom: var(--space-1); }
.process-list h3{ margin-bottom: .4em; font-size:1.05rem; }
.process-list p{ color: var(--color-text-muted); font-size: .93rem; }
.process-list li{ border-top: 2px solid var(--color-accent); padding-top: var(--space-2); }
.payment-note{
  margin-top: var(--space-4);
  background: var(--color-surface); border: 1.5px solid var(--color-accent);
  padding: var(--space-2) var(--space-3);
  display:flex; gap:.7em; align-items:flex-start;
  font-size:.95rem;
}
.payment-note svg{ width:20px; height:20px; flex-shrink:0; stroke: var(--color-accent); fill:none; stroke-width:1.7; margin-top:.15em; }

/* ============================================================
   FAQ (native details/summary)
   ============================================================ */
.faq-list{ display:flex; flex-direction:column; }
.faq-item{ border-bottom: 1px solid var(--color-border); }
.faq-item:first-child{ border-top: 1px solid var(--color-border); }
.faq-item summary{
  cursor:pointer; list-style:none;
  display:flex; align-items:center; justify-content:space-between; gap: var(--space-2);
  padding: var(--space-2) 0;
  font-family: var(--font-display); font-weight:700; font-size: 1.02rem;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{
  content:"+"; font-family: var(--font-body); font-size:1.3rem; color: var(--color-primary);
  flex-shrink:0; transition: transform var(--dur) var(--ease-out);
}
.faq-item[open] summary::after{ content:"–"; }
.faq-item p{ color: var(--color-text-muted); padding-bottom: var(--space-3); max-width: 68ch; }
.faq-preview-link{ margin-top: var(--space-3); }

/* ============================================================
   Why-us / feature list
   ============================================================ */
.why-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap: var(--space-3) var(--space-4); }
.why-item{ display:flex; gap: var(--space-2); }
.why-item svg{ width:26px; height:26px; flex-shrink:0; stroke: var(--color-primary); fill:none; stroke-width:1.6; }
.why-item h3{ font-size:1.05rem; margin-bottom:.3em; }
.why-item p{ color: var(--color-text-muted); font-size:.94rem; }

.placeholder-note{
  font-family: var(--font-body); font-size:.78rem; color: var(--color-text-muted);
  background: var(--color-band); border: 1px dashed var(--color-border);
  padding: .6em .9em; margin-top: var(--space-2); display:inline-block;
}

/* ============================================================
   Booking calendar / time slots / stepper
   ============================================================ */
.visually-hidden{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

.booking-calendar{
  border: 1.5px solid var(--color-border);
  background: var(--color-surface);
  padding: var(--space-2);
  max-width: 360px;
}
.calendar-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom: var(--space-2); }
.calendar-month{ font-family: var(--font-display); font-weight:700; font-size:.95rem; }
.calendar-nav{
  width:36px; height:36px; display:flex; align-items:center; justify-content:center;
  border: 1.5px solid var(--color-border); font-size:1.1rem; line-height:1;
  transition: border-color var(--dur) var(--ease-out), background var(--dur) var(--ease-out);
}
.calendar-nav:hover:not(:disabled){ border-color: var(--color-text); }
.calendar-nav:disabled{ opacity:.35; cursor:not-allowed; }

.calendar-weekdays{
  display:grid; grid-template-columns: repeat(7,1fr);
  font-family: var(--font-body); font-size:.68rem; color: var(--color-text-muted);
  text-align:center; margin-bottom:.4em; letter-spacing:.02em;
}
.calendar-grid{ display:grid; grid-template-columns: repeat(7,1fr); gap:4px; }
.calendar-day{
  aspect-ratio: 1; min-height:38px; display:flex; align-items:center; justify-content:center;
  border: 1.5px solid transparent; background: var(--color-band); font-size:.88rem; font-weight:500;
  transition: background var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
}
.calendar-day:hover:not(:disabled){ border-color: var(--color-primary); }
.calendar-day[aria-pressed="true"]{ background: var(--color-primary); color: var(--color-white); }
.calendar-day.is-today:not([aria-pressed="true"]){ border-color: var(--color-text-muted); }
.calendar-day:disabled{ background:transparent; color: var(--color-border); cursor:not-allowed; }
.calendar-day-empty{ visibility:hidden; }

.stepper{ display:inline-flex; align-items:center; gap: var(--space-1); }
.stepper-btn{
  width:44px; height:44px; flex-shrink:0; border: 1.5px solid var(--color-border);
  font-size:1.2rem; line-height:1; transition: border-color var(--dur) var(--ease-out);
}
.stepper-btn:hover{ border-color: var(--color-text); }
.stepper input[type="number"]{
  width:64px; min-height:44px; text-align:center; -moz-appearance: textfield;
}
.stepper input[type="number"]::-webkit-outer-spin-button,
.stepper input[type="number"]::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }

/* ============================================================
   Form
   ============================================================ */
.request-layout{ display:grid; grid-template-columns: 0.9fr 1.4fr; gap: var(--space-5); align-items:start; }
.request-side{ position: sticky; top: 100px; }
.request-side .process-list{ grid-template-columns: 1fr; gap: var(--space-2); }
.request-side .process-list li{ border-top:none; border-left:2px solid var(--color-accent); padding: 0 0 0 var(--space-2); }

.request-form{
  background: var(--color-surface); border: 1.5px solid var(--color-border);
  padding: var(--space-4);
  display:flex; flex-direction:column; gap: var(--space-2);
}
fieldset{ border:0; padding:0; margin:0; display:flex; flex-direction:column; gap: var(--space-2); }
legend{ font-family: var(--font-display); font-weight:700; font-size:1.05rem; padding:0 0 var(--space-1); }
.field{ display:flex; flex-direction:column; gap:.4em; flex:1; }
.field-row{ display:flex; gap: var(--space-2); flex-wrap: wrap; }
.field-row .field{ min-width: 200px; }
label{ font-size:.85rem; font-weight:600; }
label .req{ color: var(--color-primary); margin-left:.15em; }
.hint{ font-size:.78rem; color: var(--color-text-muted); }
input, select, textarea{
  border: 1.5px solid var(--color-border); background: var(--color-surface);
  padding: .65em .75em; font-size: .95rem; min-height: 44px;
}
textarea{ min-height: 100px; resize: vertical; }
input:focus, select:focus, textarea:focus{ border-color: var(--color-text); }
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"]{ border-color: var(--color-primary); }
.field-error{ color: var(--color-primary); font-size: .8rem; display:none; }
.field-error.is-visible{ display:block; }

.check-row{ display:flex; align-items:flex-start; gap:.6em; font-size:.88rem; }
.check-row input{ min-height:auto; width:18px; height:18px; margin-top:.15em; accent-color: var(--color-primary); }
.check-row a{ text-decoration:underline; text-underline-offset:2px; }

.divider{ border:0; border-top:1px solid var(--color-border); margin: var(--space-1) 0; }

.form-status{ display:none; padding: var(--space-3); border: 1.5px solid; font-size:.95rem; }
.form-status.is-visible{ display:block; }
.form-status-success{ border-color: var(--color-text-muted); background: rgba(55,80,92,.06); }
.form-status-error{ border-color: var(--color-primary); background: rgba(192,16,42,.06); }
.form-status p + p{ margin-top:.6em; }

.btn-loading .btn-label{ visibility:hidden; }
.btn-loading{ position:relative; }
.btn-loading::after{
  content:""; position:absolute; left:50%; top:50%; width:16px; height:16px;
  margin:-8px 0 0 -8px; border:2px solid color-mix(in srgb, var(--color-white) 40%, transparent); border-top-color: var(--color-white);
  border-radius:50%; animation: spin .7s linear infinite;
}
@media (prefers-reduced-motion: reduce){ .btn-loading::after{ animation-duration: 1.4s; } }
@keyframes spin{ to{ transform: rotate(360deg); } }

/* ============================================================
   Legal pages
   ============================================================ */
.legal-content{ max-width: 74ch; }
.legal-content h2{ font-size:1.4rem; margin-top: var(--space-4); margin-bottom: var(--space-1); }
.legal-content h2:first-child{ margin-top:0; }
.legal-content p{ margin-bottom: var(--space-2); color: var(--color-text); }
.legal-content ul{ margin: 0 0 var(--space-2); display:flex; flex-direction:column; gap:.4em; }
.legal-content li{ padding-left:1.1em; position:relative; }
.legal-content li::before{ content:"–"; position:absolute; left:0; color: var(--color-text-muted); }
.draft-banner{
  display:flex; gap:.7em; align-items:flex-start;
  background: var(--color-band); border: 1.5px solid var(--color-accent);
  padding: var(--space-2) var(--space-3); margin-bottom: var(--space-4); font-size:.92rem;
}
.draft-banner svg{ width:20px; height:20px; flex-shrink:0; stroke:var(--color-accent); fill:none; stroke-width:1.7; margin-top:.15em; }
.fill-in{ background: var(--color-band); padding: .05em .35em; font-family: var(--font-body); font-size:.92em; }

/* ============================================================
   Final CTA band
   ============================================================ */
.final-cta{ background: var(--color-dark-surface); color: var(--color-white); text-align:center; padding-block: var(--space-4); }
.final-cta h2{ margin-bottom: var(--space-3); }
.final-cta p{ color: color-mix(in srgb, var(--color-white) 78%, transparent); max-width: 52ch; margin: 0 auto var(--space-3); }
.final-cta .hero-actions{ justify-content:center; }

/* ============================================================
   Footer
   ============================================================ */
.site-footer{ background: var(--color-band); border-top: 1px solid var(--color-border); padding-block: var(--space-5) var(--space-3); }
.footer-grid{ display:grid; grid-template-columns: 1.4fr 1fr 1fr; gap: var(--space-3); padding-bottom: var(--space-3); }
.footer-grid p{ color: var(--color-text-muted); font-size:.9rem; margin-top: var(--space-1); max-width: 34ch; }
.footer-nav{ display:flex; flex-direction:column; gap:.6em; }
.footer-nav a{ font-size: .92rem; }
.footer-contact{ display:flex; flex-direction:column; gap:.6em; font-size:.92rem; }
.footer-contact a{ font-weight:600; }
.footer-contact span{ color: var(--color-text-muted); font-family: var(--font-body); font-size:.75rem; }
.footer-bottom{ border-top:1px solid var(--color-border); padding-top: var(--space-2); display:flex; flex-wrap:wrap; gap: var(--space-2); justify-content:space-between; font-family: var(--font-body); font-size:.75rem; color: var(--color-text-muted); }
.footer-bottom a{ text-decoration: underline; text-underline-offset:2px; }

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width: 1000px){
  .hero-figure{ display:none; }
  .hero-grid{ grid-template-columns: 1fr; }
  .hero-visual{ order:-1; }
  .tour-grid{ grid-template-columns: repeat(2,1fr); }
  .process-list{ grid-template-columns: repeat(2,1fr); }
  .why-grid{ grid-template-columns: 1fr; }
  .tour-detail{ grid-template-columns: 1fr; }
  .request-layout{ grid-template-columns: 1fr; }
  .request-side{ position:static; }
}

@media (max-width: 760px){
  section{ padding-block: var(--space-5); }
  .nav-toggle{ display:flex; }
  .main-nav{
    position: fixed; inset: 62px 0 0 0; background: var(--color-surface);
    flex-direction: column; align-items:flex-start; padding: var(--space-3); gap: var(--space-3);
    transform: translateY(-8px); opacity: 0; visibility: hidden;
    transition: opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out), visibility var(--dur);
  }
  .main-nav.is-open{ opacity:1; visibility:visible; transform:none; }
  .main-nav a{ font-size: 1.1rem; width:100%; padding-block: var(--space-2); border-bottom: 1px solid var(--color-border); }
  .lang-switch{ margin-top: var(--space-2); }
  .nav-toggle[aria-expanded="true"] span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
  .nav-toggle[aria-expanded="true"] span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

  .tour-grid{ grid-template-columns: 1fr; }
  .process-list{ grid-template-columns: 1fr; }
  .tour-detail-facts{ grid-template-columns: 1fr; }
  .tour-detail header{ flex-wrap: nowrap; }
  .tour-detail header h2{ min-width: 0; font-size: 1.6rem; }
  .tour-detail header .tag-note{ display: none; }
  .field-row{ flex-direction:column; }
  .footer-grid{ grid-template-columns: 1fr; gap: var(--space-3); }
}