/* ═══════════════════════════════════════════════════
   AoniTem Adventures — Shared Stylesheet
   ═══════════════════════════════════════════════════ */

/* ─── DESIGN TOKENS ─── */
:root {
  --navy:          #17192b;
  --bordeaux:      #490a0a;
  --bordeaux-deep: #370707;
  --bordeaux-light:#6b0e0e;
  --snow:          #F7F8FC;
  --snow-dark:     #ECEEF5;
}

/* ─── BASE ─── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: 'Outfit', sans-serif; background: var(--snow); color: var(--navy); overflow-x: hidden; }

/* ─── SCROLLBAR ─── */
::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-track { background: var(--snow); }
::-webkit-scrollbar-thumb { background: var(--bordeaux); border-radius: 2px; }

/* ─── NAV ─── */
#navbar { background: rgba(247,248,252,0.92); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(23,25,43,0.08); }
#navbar.nav-hero { background: transparent; border-bottom: none; backdrop-filter: none; }

.nav-link { position: relative; color: var(--navy); font-size: 14.5px; letter-spacing: 0.06em; text-decoration: none; text-transform: uppercase; transition: color 0.2s ease; }
.nav-link::after { content: ''; display: block; height: 1px; width: 0; background: var(--bordeaux); transition: width 0.3s ease; margin-top: 2px; }
.nav-link:hover { color: var(--bordeaux); }
.nav-link:hover::after { width: 100%; }
.nav-link-light { color: rgba(247,248,252,0.9); }
.nav-link-light:hover { color: #fff; }
.nav-link-light::after { background: #fff; }
.nav-link-active { color: var(--bordeaux) !important; }
.nav-link-active::after { background: var(--bordeaux) !important; width: 100% !important; }
.nav-link-light.nav-link-active { color: rgba(247,248,252,0.95) !important; }
.nav-link-light.nav-link-active::after { background: rgba(247,248,252,0.9) !important; width: 100% !important; }
.nav-link-active-light { color: rgba(247,248,252,1) !important; }

/* dropdown */
.dropdown-menu { opacity: 0; pointer-events: none; transform: translateY(-6px); transition: opacity 0.2s ease, transform 0.2s ease; }
.dropdown-parent:hover .dropdown-menu { opacity: 1; pointer-events: all; transform: translateY(0); }

/* ─── HERO ─── */
.hero-slide { position: absolute; inset: 0; transition: opacity 1.4s cubic-bezier(.4,0,.2,1); }
.hero-slide.active { opacity: 1; z-index: 1; }
.hero-slide.inactive { opacity: 0; z-index: 0; }
.hero-img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.05); transition: transform 9s ease; }
.hero-slide.active .hero-img { transform: scale(1); }
.slide-dot { width: 5px; height: 5px; background: rgba(247,248,252,0.4); border-radius: 999px; cursor: pointer; transition: all 0.4s ease; }
.slide-dot.active { background: #fff; width: 20px; }

.hero-img-ken { animation: kenburns 12s ease-out forwards; }
@keyframes kenburns { from { transform: scale(1.08); } to { transform: scale(1); } }

.hero-scroll-indicator { animation: scrollBounce 2.2s ease-in-out infinite; }
@keyframes scrollBounce { 0%, 100% { transform: translateX(-50%) translateY(0); } 50% { transform: translateX(-50%) translateY(7px); } }

/* ─── REVEAL ─── */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity 0.75s cubic-bezier(.4,0,.2,1), transform 0.75s cubic-bezier(.4,0,.2,1); }
.reveal.visible { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }

/* ─── BUTTONS ─── */
.btn-bordeaux {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--bordeaux); color: var(--snow);
  padding: 14px 28px; font-family: 'Outfit', sans-serif;
  font-size: 12px; font-weight: 500; letter-spacing: 0.12em;
  text-transform: uppercase; text-decoration: none; cursor: pointer; border: none;
  transition: background 0.25s ease, transform 0.2s ease, box-shadow 0.25s ease;
  box-shadow: 0 4px 20px rgba(73,10,10,0.2);
}
.btn-bordeaux:hover { background: var(--bordeaux-deep); transform: translateY(-1px); box-shadow: 0 8px 28px rgba(73,10,10,0.3); }
.btn-bordeaux:active { transform: translateY(0); }
.btn-bordeaux:focus-visible { outline: 2px solid var(--bordeaux); outline-offset: 3px; }

.btn-outline-dark {
  display: inline-flex; align-items: center; gap: 10px;
  border: 1px solid rgba(23,25,43,0.3); color: var(--navy);
  padding: 13px 27px; font-family: 'Outfit', sans-serif;
  font-size: 12px; font-weight: 500; letter-spacing: 0.12em;
  text-transform: uppercase; text-decoration: none;
  transition: border-color 0.25s ease, color 0.25s ease;
}
.btn-outline-dark:hover { border-color: var(--bordeaux); color: var(--bordeaux); }

.btn-outline-light {
  display: inline-flex; align-items: center; gap: 10px;
  border: 1px solid rgba(247,248,252,0.45); color: var(--snow);
  padding: 13px 27px; font-family: 'Outfit', sans-serif;
  font-size: 12px; font-weight: 500; letter-spacing: 0.12em;
  text-transform: uppercase; text-decoration: none;
  transition: border-color 0.25s ease, background 0.25s ease;
}
.btn-outline-light:hover { border-color: #fff; background: rgba(255,255,255,0.1); }

.btn-white {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--snow); color: var(--bordeaux);
  padding: 14px 28px; font-family: 'Outfit', sans-serif;
  font-size: 12px; font-weight: 500; letter-spacing: 0.12em;
  text-transform: uppercase; text-decoration: none;
  transition: background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}
.btn-white:hover { background: #fff; transform: translateY(-1px); box-shadow: 0 8px 28px rgba(0,0,0,0.2); }

/* ─── EXPERIENCE CARDS ─── */
.exp-card { position: relative; overflow: hidden; cursor: pointer; transition: opacity 0.4s ease, transform 0.4s ease; }
/* !important: cards carry an inline display:block, which would otherwise win */
.exp-card.hidden-card { display: none !important; }
.exp-card img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s cubic-bezier(.4,0,.2,1); }
.exp-card:hover img { transform: scale(1.06); }
.exp-card .card-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(23,25,43,0.88) 0%, rgba(23,25,43,0.2) 55%, transparent 100%); transition: background 0.4s ease; }
.exp-card:hover .card-overlay { background: linear-gradient(to top, rgba(73,10,10,0.9) 0%, rgba(73,10,10,0.35) 55%, rgba(73,10,10,0.05) 100%); }
.exp-card .card-arrow { transform: translateX(-4px); opacity: 0; transition: transform 0.3s ease, opacity 0.3s ease; }
.exp-card:hover .card-arrow { transform: translateX(0); opacity: 1; }

.exp-card.filtering-out { animation: cardOut 0.3s ease forwards; }
.exp-card.filtering-in { animation: cardIn 0.4s ease forwards; }
@keyframes cardOut { to { opacity: 0; transform: translateY(8px); } }
@keyframes cardIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* ─── CARDS GRID ─── */
.cards-grid { display: grid; position: relative; }

/* ─── FILTER TABS ─── */
.filter-tab { font-family: 'Outfit', sans-serif; font-size: 12px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; padding: 10px 20px; border: 1px solid rgba(23,25,43,0.18); color: rgba(23,25,43,0.55); background: transparent; cursor: pointer; transition: border-color 0.25s ease, color 0.25s ease, background 0.25s ease; }
.filter-tab:hover { border-color: rgba(73,10,10,0.4); color: var(--bordeaux); }
.filter-tab.active { background: var(--bordeaux); border-color: var(--bordeaux); color: var(--snow); }

/* ─── COUNTRY / DESTINATION TAGS ─── */
.country-tag { display: inline-block; align-self: flex-start; font-family: 'Outfit', sans-serif; font-size: 10px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; padding: 4px 10px; margin-bottom: 10px; }
.country-tag-ar { background: rgba(73,10,10,0.65); color: rgba(247,248,252,0.95); }
.country-tag-ch { background: rgba(23,25,43,0.65); color: rgba(247,248,252,0.95); }

.dest-tag { display: inline-block; border: 1px solid rgba(23,25,43,0.18); color: rgba(23,25,43,0.55); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; padding: 5px 12px; font-family: 'Outfit', sans-serif; }
.dest-tag-light { border-color: rgba(247,248,252,0.22); color: rgba(247,248,252,0.55); }

/* ─── SERVICE BOXES ─── */
.service-box { border: 1px solid rgba(23,25,43,0.1); padding: 32px 24px; transition: border-color 0.25s ease, background 0.25s ease; }
.service-box:hover { border-color: var(--bordeaux); background: #fff; }

/* ─── SERVICE ITEM (destination pages) ─── */
.service-item { padding: 8px 0; }
.service-item:last-child { border-bottom: none; }

/* ─── HEADINGS: navy display headings → bordeaux on light backgrounds ─── */
h2:not(.text-snow):not(.text-white), h3:not(.text-snow):not(.text-white) { color: var(--bordeaux); }

/* ─── SECTION LABELS ─── */
.section-label { font-family: 'Outfit', sans-serif; font-size: 11px; font-weight: 500; letter-spacing: 0.22em; text-transform: uppercase; color: var(--bordeaux); }
.section-label-light { font-family: 'Outfit', sans-serif; font-size: 11px; font-weight: 500; letter-spacing: 0.22em; text-transform: uppercase; color: rgba(247,248,252,0.7); }
.hero-eyebrow { font-family: 'Outfit', sans-serif; font-size: 14px; font-weight: 500; letter-spacing: 0.26em; text-transform: uppercase; color: rgba(247,248,252,0.95); text-shadow: 0 1px 14px rgba(23,25,43,0.55); }
.hero-tag { display: inline-block; background: var(--bordeaux); color: rgba(247,248,252,0.95); font-family: 'Outfit', sans-serif; font-size: 10px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; padding: 5px 14px; border-radius: 0; margin-bottom: 20px; }

/* ─── RULES ─── */
.bordeaux-rule { display: block; width: 32px; height: 1px; background: var(--bordeaux); margin-bottom: 20px; }
.white-rule { display: block; width: 32px; height: 1px; background: rgba(247,248,252,0.5); margin-bottom: 20px; }

/* ─── SECTION SEPARATOR ─── */
.section-sep { display: block; width: 100%; height: 1px; background: linear-gradient(to right, transparent, rgba(23,25,43,0.1) 30%, rgba(23,25,43,0.1) 70%, transparent); }
.section-sep-dark { background: linear-gradient(to right, transparent, rgba(247,248,252,0.08) 30%, rgba(247,248,252,0.08) 70%, transparent); }

/* ─── STATS ─── */
.stat-number { font-family: 'Cormorant Garamond', Georgia, serif; font-size: clamp(2.4rem, 5vw, 3.8rem); font-weight: 300; letter-spacing: -0.03em; color: var(--bordeaux); line-height: 1; }
.stat-label { font-family: 'Outfit', sans-serif; font-size: 11px; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(23,25,43,0.4); margin-top: 6px; }

/* ─── EXPERIENCE FEATURE SECTIONS ─── */
.exp-photo-wrap { position: relative; overflow: hidden; }
.exp-photo-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.9s cubic-bezier(.4,0,.2,1); }
.exp-photo-wrap:hover img { transform: scale(1.04); }
.exp-photo-overlay { position: absolute; inset: 0; pointer-events: none; }

.exp-bullet { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
.exp-bullet-dot { width: 5px; height: 5px; min-width: 5px; background: var(--bordeaux); border-radius: 50%; margin-top: 7px; }
.exp-bullet-dot-light { background: rgba(247,248,252,0.5); }

.cta-link { display: inline-flex; align-items: center; gap: 8px; font-family: 'Outfit', sans-serif; font-size: 11px; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; text-decoration: none; color: var(--bordeaux); transition: gap 0.25s ease, opacity 0.25s ease; }
.cta-link:hover { gap: 14px; }
.cta-link-light { color: rgba(247,248,252,0.7); }
.cta-link-light:hover { color: #fff; gap: 14px; }

/* ─── JOURNAL ─── */
.journal-card img { transition: transform 0.6s ease; }
.journal-card:hover img { transform: scale(1.04); }
.journal-card .read-link { color: var(--bordeaux); }
.journal-card .read-link svg { transition: transform 0.3s ease; }
.journal-card:hover .read-link svg { transform: translateX(4px); }
.journal-card.card-full { background: var(--snow); transition: box-shadow 0.3s ease, transform 0.3s ease; }
.journal-card.card-full:hover { box-shadow: 0 12px 40px rgba(23,25,43,0.1); transform: translateY(-2px); }
.journal-card.card-full .card-img { overflow: hidden; height: 220px; }
.journal-card.card-full .card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.journal-card.card-full:hover .card-img img { transform: scale(1.04); }
.card-img { overflow: hidden; aspect-ratio: 3/2; }
.card-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s ease; }
.journal-card:hover .card-img img { transform: scale(1.04); }
.featured-card { display: grid; grid-template-columns: 1fr 1fr; }
@media (max-width: 1023px) { .featured-card { grid-template-columns: 1fr; } }

/* ─── TESTIMONIALS ─── */
.testimonial { opacity: 0; transform: translateY(10px); transition: opacity 0.5s ease, transform 0.5s ease; position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; }
.testimonial.active { opacity: 1; transform: translateY(0); z-index: 1; }
.testimonial.inactive { opacity: 0; z-index: 0; }
.t-card { background: var(--snow); padding: 40px 36px; }
.t-card-rule { display: block; width: 28px; height: 1px; background: var(--bordeaux); margin-bottom: 24px; }

/* ─── WHATSAPP FLOAT ─── */
.wa-float { position: fixed; right: 24px; bottom: 24px; z-index: 999; display: flex; align-items: center;
  justify-content: center; width: 58px; height: 58px; border-radius: 50%; background: var(--bordeaux);
  color: var(--snow); text-decoration: none;
  box-shadow: 0 6px 22px rgba(23,25,43,0.28), 0 2px 6px rgba(23,25,43,0.18);
  transition: transform 0.25s cubic-bezier(0.34,1.3,0.64,1), background 0.25s ease, box-shadow 0.25s ease; }
.wa-float:hover { background: var(--bordeaux-deep); transform: translateY(-3px) scale(1.04);
  box-shadow: 0 12px 32px rgba(23,25,43,0.34), 0 3px 8px rgba(23,25,43,0.2); }
.wa-float:active { transform: translateY(-1px) scale(0.99); }
.wa-float:hover { background: var(--bordeaux-deep); transform: translateY(-2px); box-shadow: 0 12px 40px rgba(73,10,10,0.4); }
.wa-float:focus-visible { outline: 2px solid var(--bordeaux); outline-offset: 4px; }
@media (max-width: 640px) { .wa-float { right: 16px; bottom: 16px; width: 52px; height: 52px; } }
@media (prefers-reduced-motion: reduce) { .wa-float { transition: background 0.25s ease; } .wa-float:hover { transform: none; } }

/* ─── MOBILE NAV ─── */
.mobile-nav { position: fixed; inset: 0; background: var(--navy); z-index: 998; transform: translateX(100%); transition: transform 0.4s cubic-bezier(.4,0,.2,1); }
.mobile-nav.open { transform: translateX(0); }

/* ─── FOOTER ─── */
.footer-link { color: rgba(247,248,252,0.5); font-size: 13px; text-decoration: none; transition: color 0.2s ease; display: block; margin-bottom: 8px; }
.footer-link:hover { color: rgba(247,248,252,0.9); }

/* ─── NEWSLETTER INPUT ─── */
.nl-input { background: transparent; border: none; border-bottom: 1px solid rgba(247,248,252,0.25); color: var(--snow); font-family: 'Outfit', sans-serif; font-size: 14px; padding: 12px 0; outline: none; width: 100%; transition: border-color 0.2s ease; }
.nl-input::placeholder { color: rgba(247,248,252,0.35); }
.nl-input:focus { border-color: rgba(247,248,252,0.6); }

/* ─── FORM ─── */
.form-label { display: block; font-family: 'Outfit', sans-serif; font-size: 10px; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(23,25,43,0.55); margin-bottom: 6px; }
.form-field {
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(23,25,43,0.2);
  color: var(--navy);
  font-family: 'Outfit', sans-serif;
  font-size: 15px;
  font-weight: 300;
  padding: 12px 0;
  outline: none;
  width: 100%;
  transition: border-bottom-color 0.25s ease;
  -webkit-appearance: none;
  border-radius: 0;
}
.form-field::placeholder { color: rgba(23,25,43,0.3); }
.form-field:focus { border-bottom-color: var(--bordeaux); }
select.form-field {
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5L5 6.5L8 3.5' stroke='%2317192b' stroke-opacity='0.45' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 4px center;
  padding-right: 22px;
}
select.form-field option { background: var(--snow); color: var(--navy); }
textarea.form-field { resize: vertical; min-height: 120px; padding-top: 12px; line-height: 1.7; }

/* ─── CONTACT ─── */
.contact-box { border: 1px solid rgba(23,25,43,0.1); padding: 32px 28px; background: var(--snow); transition: box-shadow 0.3s ease, transform 0.3s ease; }
.contact-box:hover { box-shadow: 0 8px 32px rgba(23,25,43,0.08); transform: translateY(-2px); }
.contact-method { display: flex; align-items: flex-start; gap: 14px; padding: 16px 0; border-bottom: 1px solid rgba(23,25,43,0.07); }
.contact-method:last-child { border-bottom: none; }
.contact-method-icon { flex-shrink: 0; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border-left: 2px solid var(--bordeaux); padding-left: 10px; }

/* ─── ABOUT ─── */
.team-card-img { overflow: hidden; height: 420px; }
.team-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s cubic-bezier(.4,0,.2,1); }
.team-card-img:hover img { transform: scale(1.04); }
.value-icon { width: 36px; height: 36px; border: 1px solid rgba(73,10,10,0.25); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-bottom: 20px; }

/* ─── PLAN PAGE ─── */
.step-num { font-family: 'Cormorant Garamond', Georgia, serif; font-size: clamp(5rem, 9vw, 7.5rem); font-weight: 300; color: var(--bordeaux); line-height: 1; letter-spacing: -0.04em; opacity: 0.15; }
@keyframes scrollBounce-plan { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(5px); } }

/* ─── BLOG / ARTICLE ─── */
.article-body { max-width: 720px; margin: 0 auto; }
.article-body h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(1.5rem, 3vw, 2.2rem); font-weight: 300; letter-spacing: -0.02em; color: var(--navy); margin: 48px 0 16px; }
.article-body p { font-family: 'Outfit', sans-serif; font-size: 16px; line-height: 1.85; color: rgba(23,25,43,0.75); margin-bottom: 24px; }
.article-body ul { margin: 0 0 24px 0; padding-left: 0; list-style: none; }
.article-body ul li { font-family: 'Outfit', sans-serif; font-size: 15px; line-height: 1.75; color: rgba(23,25,43,0.7); padding: 6px 0 6px 20px; position: relative; }
.article-body ul li::before { content: ''; position: absolute; left: 0; top: 15px; width: 6px; height: 1px; background: var(--bordeaux); }
.article-body blockquote { border-left: 2px solid var(--bordeaux); padding: 4px 0 4px 24px; margin: 40px 0; }
.article-body blockquote p { font-family: 'Cormorant Garamond', serif; font-size: clamp(1.2rem, 2.5vw, 1.6rem); font-style: italic; font-weight: 300; color: var(--navy); line-height: 1.5; margin-bottom: 0; }
.related-card { position: relative; overflow: hidden; cursor: pointer; display: block; text-decoration: none; }
.related-card img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s cubic-bezier(.4,0,.2,1); }
.related-card:hover img { transform: scale(1.05); }
.related-card .card-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(23,25,43,0.88) 0%, rgba(23,25,43,0.2) 60%, transparent 100%); }

/* ─── GRAIN ─── */
.grain::before { content: ''; position: absolute; inset: 0; 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.04'/%3E%3C/svg%3E"); pointer-events: none; z-index: 2; mix-blend-mode: overlay; }

/* ─── "AT A GLANCE" CELLS ON PHONES ───
   The client found these blocks far too heavy on a phone — they ate the
   screen and made the pages feel endless (Pastel #95, #98, #100, #101,
   #105, #108, #111, #112, #116). Desktop is untouched; on small screens
   the cells tighten up and centre, icons included.
   !important is needed because the sizes are inline on 124 cells. */
@media (max-width: 640px) {
  .glance-cell { padding: 18px 12px !important; text-align: center; }
  /* Tailwind's preflight makes images display:block, so text-align cannot
     centre them — auto margins do. */
  .glance-cell .glance-icon {
    width: 30px !important;
    height: 30px !important;
    margin: 0 auto 9px !important;
  }
  .glance-cell p { font-size: 12px !important; line-height: 1.6 !important; }
  .glance-cell h4 { font-size: 0.95rem !important; margin-bottom: 6px !important; }
}

/* ─── EXPERIENCE CARDS ON PHONES ───
   #96 and #127: one full-width card per row made these pages exhausting
   to scroll. Two per row puts four cards in the space one used to take,
   which is the "0.25 size" the client asked for. The card height is
   inline on every card, so it needs overriding, and the overlay text
   scales down to suit the narrower tile. */
@media (max-width: 639px) {
  .cards-grid .exp-card { height: 240px !important; }
  .cards-grid .exp-card .p-6 { padding: 14px !important; }
  .cards-grid .exp-card h3 { font-size: 1.05rem !important; line-height: 1.2; margin-bottom: 2px !important; }
  .cards-grid .exp-card .section-label-light { font-size: 9px !important; letter-spacing: 0.12em !important; }
  .cards-grid .exp-card .country-tag { font-size: 8px !important; padding: 2px 6px !important; margin-bottom: 6px !important; }
  /* the strapline and the Discover arrow are noise at this size */
  .cards-grid .exp-card .font-body[style*="font-size:13px"],
  .cards-grid .exp-card .card-arrow { display: none !important; }
}

/* Additional-offer cards (Zermatt and the other resort pages) */
.offer-card { transition: border-color 0.25s ease, transform 0.25s ease; }
.offer-card:hover { border-color: rgba(73,10,10,0.4); transform: translateY(-2px); }
.offer-card:focus-visible { outline: 2px solid var(--bordeaux); outline-offset: 3px; }

/* Location section — "open in Google Maps" link */
.map-link { transition: opacity 0.25s ease; }
.map-link:hover { opacity: 0.65; }
.map-link:focus-visible { outline: 2px solid var(--bordeaux); outline-offset: 3px; }

/* 404 quick links */
.err-link { display: block; padding: 9px 0; font-family: 'Outfit', sans-serif; font-size: 15px;
  color: rgba(247,248,252,0.78); text-decoration: none; border-bottom: 1px solid rgba(247,248,252,0.08);
  transition: color 0.25s ease, padding-left 0.25s ease; }
.err-link:hover { color: #fff; padding-left: 8px; }
.err-link:focus-visible { outline: 2px solid rgba(247,248,252,0.7); outline-offset: 3px; }

/* ─── LEGAL PAGES ─── */
.legal-prose { max-width: 46rem; }
.legal-prose .lead { font-family: 'Outfit', sans-serif; font-size: 1.05rem; line-height: 1.85;
  color: rgba(23,25,43,0.72); margin: 0 0 44px; }
.legal-prose h2 { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 1.75rem; font-weight: 400;
  letter-spacing: -0.02em; color: #17192b; margin: 52px 0 14px; padding-top: 26px;
  border-top: 1px solid rgba(23,25,43,0.1); }
.legal-prose h2:first-of-type { margin-top: 0; }
.legal-prose h3 { font-family: 'Outfit', sans-serif; font-size: 12px; font-weight: 600; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--bordeaux); margin: 32px 0 10px; }
.legal-prose p { font-family: 'Outfit', sans-serif; font-size: 15px; line-height: 1.85;
  color: rgba(23,25,43,0.68); margin: 0 0 16px; }
.legal-prose ul { list-style: none; padding: 0; margin: 0 0 20px; }
.legal-prose li { font-family: 'Outfit', sans-serif; font-size: 15px; line-height: 1.8;
  color: rgba(23,25,43,0.68); padding: 0 0 10px 20px; position: relative; }
.legal-prose li::before { content: ''; position: absolute; left: 0; top: 12px; width: 5px; height: 5px;
  background: var(--bordeaux); border-radius: 50%; }
.legal-prose strong { color: #17192b; font-weight: 500; }
.legal-prose a { color: var(--bordeaux); text-decoration: underline; text-underline-offset: 3px;
  transition: opacity 0.2s ease; }
.legal-prose a:hover { opacity: 0.65; }
.legal-inline-btn { background: none; border: none; padding: 0; font: inherit; color: var(--bordeaux);
  text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.legal-inline-btn:hover { opacity: 0.65; }
.legal-cta { margin-top: 56px; padding: 26px 28px; background: #ECEEF5; border-left: 2px solid var(--bordeaux); }
.legal-cta p { margin: 0; }
