/* =========================================================================
   KayakingAlbania.com — field-journal look: warm sand paper, ink drawings,
   herbs, and earth colours (moss, terracotta, ochre, olive, umber).
   Colours and fonts are set here.
   ========================================================================= */
:root {
  --paper: #f1e6cf;
  --paper-light: #f8f0df;
  --paper-deep: #e7d8b9;
  --paper-sage: #e4d6b4;
  --ink: #343620;
  --text: #43392a;
  --muted: #6e624d;
  --line: rgba(92, 70, 38, .25);

  --moss: #3e4a2d;
  --moss-2: #57623a;
  --moss-dark: #2e3722;
  --rust: #984824;
  --rust-2: #b8633a;
  --rust-dark: #864020;
  --ochre: #b98a3a;
  --ochre-light: #e6cf9a;
  --umber: #5a4230;
  --olive: #6f6a39;
  --olive-2: #827c4a;
  --sage: #b3a679;
  --cream: #f8f0df;

  --f-head: "Fraunces", Georgia, "Times New Roman", serif;
  --f-body: "Crimson Pro", Georgia, "Times New Roman", serif;
  --f-hand: "Caveat", "Segoe Print", cursive;

  --wrap: 1260px;
  --gutter: 28px;
  --radius: 18px;
  --shadow: 0 10px 28px -14px rgba(52, 44, 22, .45), 0 2px 6px -2px rgba(52, 44, 22, .18);

  /* shapes (SVG masks), all drawn in a 100×100 box and stretched */
  --blob-a: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M6 18C14 4 40 2 62 5c18 2 34 5 37 25 2 22-2 48-13 60-14 11-42 9-62 5C8 92 0 78 1 56 2 40 0 28 6 18Z'/%3E%3C/svg%3E");
  --blob-b: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M50 2c24-1 45 12 48 38 3 26-10 52-36 58-24 5-52-4-59-30C-3 44 8 10 30 4c7-2 14-2 20-2Z'/%3E%3C/svg%3E");
  --blob-c: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M10 10C25 0 60 4 80 2c15-1 20 18 18 43-2 25 1 43-14 51-18 8-54 2-70-4C2 87 0 70 2 50 3 32 0 18 10 10Z'/%3E%3C/svg%3E");
  --blob-panel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M9 6c20-6 48 2 70-2 13-2 20 4 19 16-1 14 2 24 0 38-2 12 2 22-2 32-4 9-16 10-30 8-20-3-38 4-56 0C1 96 3 86 4 74 6 58 0 44 2 30 3 18 1 9 9 6Z'/%3E%3C/svg%3E");
  --hero-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M9 0h91v93c-4 2-7 0-11 2-4 3-8 1-12 3-5 2-9 0-14 2-5 1-8-1-13 1-5 2-9 0-13 1l-4 1C21 88 26 78 21 66 15 52 20 38 14 26 10 16 11 8 9 0Z'/%3E%3C/svg%3E");
  --torn-bottom: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 30' preserveAspectRatio='none'%3E%3Cpath d='M0 0h1200v18l-28 4-32-6-35 5-25-6-34 5-36-6-32 5-28 5-35-7-35 4-34-6-34 5-32-7-32 6-32 4-34-7-34 4-32-6-28 5-34 5-34-7-32 4-32-7-34 5-32 4-32-7-34 5-32-6-32 5-34-7-32 5-34 5-32-7-32 5-32-6-34 5-32-4Z'/%3E%3C/svg%3E");
  --torn-top: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 30' preserveAspectRatio='none'%3E%3Cpath d='M0 30h1200V12l-28-4-32 6-35-5-25 6-34-5-36 6-32-5-28-5-35 7-35-4-34 6-34-5-32 7-32-6-32-4-34 7-34-4-32 6-28-5-34-5-34 7-32-4-32 7-34-5-32-4-32 7-34-5-32 6-32-5-34 7-32-5-34-5-32 7-32-5-32 6-34-5-32 4Z'/%3E%3C/svg%3E");
  --wave-top: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 22C80 8 160 6 250 16s170 18 260 6 170-20 260-8 170 20 260 10 120-18 170-14v30H0Z'/%3E%3C/svg%3E");
  --wave-bottom: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 0h1200v20c-60 8-120 14-190 8s-160-18-250-8-170 18-260 8-170-18-260-6S80 32 0 18Z'/%3E%3C/svg%3E");
  --brush: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14'%3E%3Cpath d='M3 9C40 4 95 2 197 5c1 1 1 3-1 4-60 0-120 1-191 4-3 0-4-3-2-4Z' fill='%23a64f2a'/%3E%3C/svg%3E");
  --paper-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .38 0 0 0 0 .32 0 0 0 0 .2 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--f-body);
  font-size: 1.16rem;
  line-height: 1.55;
  color: var(--text);
  background-color: var(--paper);
  background-image: var(--paper-grain),
    radial-gradient(1200px 600px at 10% 0%, rgba(255, 252, 240, .7), transparent 60%),
    radial-gradient(900px 700px at 100% 60%, rgba(214, 200, 165, .25), transparent 60%);
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { font-family: var(--f-head); color: var(--ink); font-weight: 600; line-height: 1.08; margin: 0 0 .5em; font-variation-settings: "SOFT" 40, "WONK" 0; letter-spacing: -.01em; }
h1 { font-size: clamp(2.6rem, 4.9vw, 4.6rem); line-height: .98; letter-spacing: -.02em; }
h2 { font-size: clamp(1.9rem, 2.9vw, 2.6rem); }
h3 { font-size: 1.45rem; }
p { margin: 0 0 1em; }
.it { font-style: italic; }
.wrap { width: min(var(--wrap), 100% - 2 * var(--gutter)); margin-inline: auto; }
.wrap-wide { width: min(1420px, 100% - 2 * var(--gutter)); margin-inline: auto; }
#site-header { min-height: 88px; }
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: 12px; top: -60px; background: var(--moss); color: var(--cream); padding: 10px 16px; border-radius: 10px; z-index: 100; }
.skip-link:focus { top: 12px; }
:focus-visible { outline: 3px solid var(--rust-2); outline-offset: 3px; border-radius: 6px; }
svg.i, i[data-lucide] + svg, .lucide { width: 1.1em; height: 1.1em; stroke-width: 1.6; flex: none; }

.eyebrow { font-family: var(--f-head); font-size: .8rem; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--rust); margin: 0 0 .7rem; }
.crumbs { font-family: var(--f-head); font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--rust); margin: 0 0 .8rem; }
.crumbs a { display: inline-block; padding: 5px 0; text-decoration: none; }
.crumbs a:hover { text-decoration: underline; }
.crumbs span { margin: 0 .4em; }
.brushed { position: relative; padding-bottom: .38em; }
.brushed::after { content: ""; position: absolute; left: 0; bottom: 0; width: min(150px, 60%); height: 12px; background: var(--brush) no-repeat left / 100% 100%; }
.brushed.center::after { left: 50%; transform: translateX(-50%); }
.hand { font-family: var(--f-hand); font-weight: 500; }

/* ---------- buttons & links ---------- */
.btn {
  display: inline-flex; align-items: center; gap: .6em;
  padding: .7em 1.35em; min-height: 48px;
  font-family: var(--f-body); font-weight: 600; font-size: 1.08rem; line-height: 1.1;
  text-decoration: none; border: 0; cursor: pointer;
  border-radius: 28px 24px 26px 22px / 24px 28px 22px 26px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), 0 3px 0 rgba(40, 30, 10, .12), 0 8px 18px -10px rgba(40, 30, 10, .5);
  transition: transform .15s ease, filter .15s ease, background-color .15s ease;
}
.btn:hover { transform: translateY(-1px); filter: brightness(1.06); }
.btn:active { transform: translateY(1px); }
.btn .lucide, .btn svg { width: 1.15em; height: 1.15em; }
.btn--moss { background: var(--moss); color: var(--cream); }
.btn--rust { background: var(--rust); color: var(--cream); }
.btn--olive { background: var(--olive); color: var(--cream); font-size: .98rem; min-height: 42px; padding: .55em 1.15em; }
.btn--cream { background: var(--cream); color: var(--ink); }
.btn--sm { font-size: .98rem; min-height: 42px; padding: .5em 1.1em; }
.btn-row { display: flex; flex-wrap: wrap; gap: 14px 18px; margin-top: 1.6rem; }
.link-arrow {
  display: inline-flex; align-items: center; gap: .45em;
  font-family: var(--f-body); font-weight: 600; color: var(--rust); text-decoration: none;
  background: var(--brush) no-repeat left bottom / 100% 5px; padding-bottom: 5px;
}
.link-arrow:hover { color: var(--rust-dark); }
.link-arrow .lucide { width: 1em; height: 1em; transition: transform .15s; }
.link-arrow:hover .lucide { transform: translateX(3px); }

/* ---------- header ---------- */
.site-header { position: sticky; top: 0; z-index: 60; background: var(--paper) var(--paper-grain); box-shadow: 0 1px 0 rgba(60, 50, 20, .08); }
.nav-bar { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 88px; }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); flex: none; }
.brand svg { width: 92px; height: 50px; }
.brand b { font-family: var(--f-head); font-weight: 600; font-size: 1.42rem; line-height: .98; letter-spacing: -.01em; display: block; }
.main-nav { display: flex; align-items: center; gap: clamp(14px, 2.4vw, 40px); }
.main-nav > ul { display: flex; align-items: center; gap: clamp(14px, 2.4vw, 40px); list-style: none; margin: 0; padding: 0; }
.main-nav li { position: relative; }
.main-nav a.top, .main-nav button.top {
  display: inline-flex; align-items: center; gap: 5px; padding: 8px 0;
  font: 500 1.08rem/1.2 var(--f-body); color: var(--ink); text-decoration: none; background: none; border: 0; cursor: pointer;
}
.main-nav .top .caret { width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor; margin-left: 3px; }
.main-nav .is-current > .top { background: var(--brush) no-repeat center bottom / 100% 6px; }
.main-nav .top:hover { color: var(--rust); }
.sub {
  position: absolute; top: 100%; left: -18px; min-width: 250px; padding: 10px; margin: 0; list-style: none;
  background: var(--paper-light) var(--paper-grain); border-radius: 14px; box-shadow: var(--shadow);
  opacity: 0; visibility: hidden; transform: translateY(6px); transition: .18s ease;
}
.has-sub:hover .sub, .has-sub:focus-within .sub, .has-sub.open .sub { opacity: 1; visibility: visible; transform: none; }
.sub a { display: block; padding: 9px 12px; border-radius: 9px; text-decoration: none; color: var(--ink); font-size: 1.05rem; }
.sub a:hover { background: var(--paper-deep); color: var(--rust-dark); }
.nav-cta { flex: none; }
.nav-toggle { display: none; background: none; border: 0; padding: 8px; color: var(--ink); cursor: pointer; }
.nav-toggle .lucide { width: 30px; height: 30px; }

/* logo: paddle-peak mark + wordmark (header), round seal (footer) */
.brand .mark { width: 60px; height: 60px; flex: none; }
.wm { display: flex; flex-direction: column; line-height: 1; }
.wm b { font-family: var(--f-head); font-style: italic; font-weight: 600; font-size: 1.62rem; letter-spacing: -.01em; color: var(--ink); }
.wm span { margin-top: 5px; font-family: var(--f-head); font-weight: 600; font-size: .84rem; letter-spacing: .42em; text-transform: uppercase; color: var(--rust); }
.wm small { font-size: .82em; letter-spacing: .04em; text-transform: none; color: var(--olive-2); font-weight: 500; }
.f-brand .seal { width: 128px; height: 128px; display: block; transition: transform .4s ease; }
.f-brand a:hover .seal { transform: rotate(-8deg); }
@media (max-width: 640px) {
  .brand .mark { width: 46px; height: 46px; }
  .wm b { font-size: 1.28rem; }
  .wm span { font-size: .7rem; letter-spacing: .34em; }
}
/* ---------- hero ---------- */
.hero { position: relative; min-height: clamp(440px, 35vw, 540px); isolation: isolate; overflow: hidden; }
.hero__media { position: absolute; inset: 0 0 0 33%; z-index: -1; mask: var(--hero-mask) 0 0 / 100% 100% no-repeat; -webkit-mask: var(--hero-mask) 0 0 / 100% 100% no-repeat; }
.hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 70% 45%; }
.hero__topo { position: absolute; left: -40px; top: -30px; width: 380px; height: 300px; z-index: -2; color: var(--ink); opacity: .32; }
.hero__flowers { position: absolute; left: 0; bottom: 18px; width: clamp(110px, 10vw, 160px); z-index: 1; pointer-events: none; }
.hero__content { position: relative; padding: clamp(36px, 4vw, 60px) 0 clamp(60px, 6vw, 90px) clamp(70px, 9vw, 130px); max-width: 690px; }
.hero__content h1 { margin-bottom: .2em; }
.hero__content h1.brushed { padding-bottom: .26em; }
.hero__content h1.brushed::after { width: 140px; height: 14px; }
.hero__lead { font-size: 1.24rem; line-height: 1.5; max-width: 24em; margin-top: 1.1rem; color: var(--text); }
.hero__badge {
  position: absolute; right: clamp(14px, 2vw, 34px); top: clamp(26px, 3vw, 46px); z-index: 2;
  width: clamp(150px, 13vw, 200px); aspect-ratio: 1; display: grid; place-items: center; text-align: center;
  background: rgba(111, 106, 57, .93); color: var(--cream); border-radius: 50%;
  mask: var(--blob-b) 0 0 / 100% 100%; -webkit-mask: var(--blob-b) 0 0 / 100% 100%;
}
.hero__badge span { display: block; font-family: var(--f-hand); font-weight: 500; font-size: clamp(1.3rem, 1.9vw, 1.85rem); line-height: 1.05; transform: rotate(-12deg); padding: 0 16%; }
.hero__badge span::after { content: ""; display: block; width: 52%; height: 8px; margin: 6px auto 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 10'%3E%3Cpath d='M2 7C30 3 60 2 98 4' stroke='%23f7f1e3' stroke-width='2.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / 100% 100%; }

/* ---------- intro band (sketch · heading | text · eagle) ---------- */
.intro-band { position: relative; padding: clamp(34px, 4vw, 54px) 0 clamp(40px, 4vw, 56px); }
.intro-band__grid { display: grid; grid-template-columns: minmax(0, 1fr) auto 1px minmax(0, 500px) minmax(0, 1fr); align-items: center; gap: 0 clamp(20px, 2.6vw, 40px); }
.intro-band__art-l { justify-self: end; width: min(100%, 380px); opacity: .95; }
.intro-band__art-r { position: relative; align-self: stretch; min-height: 120px; }
.intro-band__art-r .eagle { position: absolute; left: 4%; top: -6px; width: 118px; }
.intro-band__art-r .ridge { position: absolute; right: 0; bottom: -10px; width: min(250px, 100%); }
.intro-band h2 { margin: 0; font-size: clamp(2rem, 3.1vw, 2.75rem); }
.intro-band .sub-it { font-style: italic; font-size: 1.15rem; margin: .5rem 0 0; color: var(--ink); }
.intro-band .vr { width: 1px; align-self: stretch; background: var(--line); }
.intro-band p { margin: 0; font-size: 1.1rem; }
.sage-hill { position: absolute; right: 0; bottom: 0; width: min(46vw, 640px); height: 70px; z-index: -1; color: var(--sage); opacity: .75; }

/* ---------- photo shapes ---------- */
.shape { overflow: hidden; }
.shape img { width: 100%; height: 100%; object-fit: cover; }
.shape--a { mask: var(--blob-a) 0 0 / 100% 100%; -webkit-mask: var(--blob-a) 0 0 / 100% 100%; }
.shape--b { mask: var(--blob-b) 0 0 / 100% 100%; -webkit-mask: var(--blob-b) 0 0 / 100% 100%; }
.shape--c { mask: var(--blob-c) 0 0 / 100% 100%; -webkit-mask: var(--blob-c) 0 0 / 100% 100%; }
.torn-b { mask: linear-gradient(#000, #000) top / 100% calc(100% - 13px) no-repeat, var(--torn-bottom) bottom / 100% 14px no-repeat; -webkit-mask: linear-gradient(#000, #000) top / 100% calc(100% - 13px) no-repeat, var(--torn-bottom) bottom / 100% 14px no-repeat; }

/* ---------- organic colour panels ---------- */
.panel { position: relative; isolation: isolate; color: var(--cream); }
.panel::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--panel-bg, var(--rust)) var(--paper-grain); mask: var(--blob-panel) 0 0 / 100% 100%; -webkit-mask: var(--blob-panel) 0 0 / 100% 100%; }
.panel h2, .panel h3 { color: var(--cream); }
.panel .eyebrow { color: #f3d9c3; }
.panel .topo { position: absolute; right: 2%; bottom: 4%; width: 46%; height: 60%; color: #e9a87f; opacity: .38; z-index: -1; pointer-events: none; }
.panel--moss { --panel-bg: var(--moss); }
.panel--sage { --panel-bg: #e3d4ae; color: var(--text); }
.panel--sage h2, .panel--sage h3 { color: var(--ink); }

/* ---------- home: featured row ---------- */
.feature-row { position: relative; padding: 10px 0 40px; }
.feature-row__grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.4fr) 1px minmax(0, 1.2fr); align-items: center; gap: 0 clamp(18px, 2vw, 32px); }
.feature-row__photo { height: clamp(260px, 22vw, 330px); margin-right: -30%; position: relative; z-index: 0; }
.feature-row .panel { padding: clamp(36px, 3.4vw, 54px) clamp(30px, 3.6vw, 60px) clamp(40px, 3.6vw, 56px); z-index: 1; }
.panel h2 { font-size: clamp(1.8rem, 2.6vw, 2.35rem); margin-bottom: .45em; }
.panel p { color: #f6e6d8; font-size: 1.06rem; }
.panel__icon { width: 44px; height: 30px; color: var(--cream); margin-bottom: 4px; }
.feature-row .vr { width: 1px; align-self: stretch; margin: 30px 0; background: var(--line); }
.side-feature { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); align-items: center; gap: 18px; }
.side-feature h3 { font-size: clamp(1.6rem, 2.2vw, 2rem); }
.side-feature .ico { color: var(--rust); width: 40px; height: 28px; }
.side-feature__photo { height: clamp(220px, 19vw, 290px); }

/* ---------- photo-card strip band ---------- */
.strip-band { position: relative; padding: 46px 0 56px; background: var(--paper-sage) var(--paper-grain); margin: 18px 0 0; isolation: isolate; }
.strip-band::before, .strip-band::after { content: ""; position: absolute; left: 0; right: 0; height: 14px; background: inherit; }
.strip-band::before { top: -13px; mask: var(--torn-top) 0 0 / 100% 100%; -webkit-mask: var(--torn-top) 0 0 / 100% 100%; }
.strip-band::after { bottom: -13px; mask: var(--torn-bottom) 0 0 / 100% 100%; -webkit-mask: var(--torn-bottom) 0 0 / 100% 100%; z-index: 1; }
.strip-band__grid { display: grid; grid-template-columns: minmax(280px, 1fr) minmax(0, 2.6fr) 70px; align-items: center; gap: 28px; }
.strip-intro { display: grid; grid-template-columns: 64px 1fr; gap: 18px; align-items: start; }
.strip-intro .outline { width: 64px; opacity: .8; margin-top: 6px; }
.strip-intro h2 { font-size: clamp(1.8rem, 2.4vw, 2.2rem); margin-bottom: .4em; }
.strip-intro p { font-size: 1.04rem; }
.strip-intro h2.it { font-style: italic; }
.cards-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.photo-card { display: block; position: relative; border-radius: 6px; background: var(--paper-light); padding: 4px; box-shadow: var(--shadow); transform: rotate(var(--tilt, -.5deg)); transition: transform .2s ease; text-decoration: none; }
.photo-card:nth-child(2n) { --tilt: .6deg; }
.photo-card:hover { transform: rotate(0) translateY(-3px); }
.photo-card img { border-radius: 4px; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; }
.tape-label { position: absolute; left: 10px; bottom: 10px; padding: 1px 14px 2px; background: #efe1bf; color: var(--ink); font-family: var(--f-hand); font-weight: 600; font-size: 1.15rem; line-height: 1.3; transform: rotate(-3deg); box-shadow: 0 2px 6px -3px rgba(0, 0, 0, .45); clip-path: polygon(2% 8%, 98% 0, 100% 90%, 0 100%); }
.ph { position: relative; }
.exp-card .ph img, .dest-card .ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ph-tag { position: absolute; left: 12px; top: 12px; display: inline-flex; align-items: center; gap: 6px; padding: 3px 12px; border-radius: 999px; background: rgba(62, 74, 45, .88); color: var(--cream); font-family: var(--f-head); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; }
.ph-tag .lucide { width: 15px; height: 15px; }
.strip-band .sprig { width: 70px; justify-self: end; }

/* ---------- teal band ---------- */
.moss-band { position: relative; color: var(--cream); background: var(--moss) var(--paper-grain); padding: 42px 0 40px; margin-top: 40px; isolation: isolate; }
.moss-band::before, .moss-band::after { content: ""; position: absolute; left: 0; right: 0; height: 26px; background: inherit; }
.moss-band::before { top: -25px; mask: var(--wave-top) 0 0 / 100% 100%; -webkit-mask: var(--wave-top) 0 0 / 100% 100%; }
.moss-band::after { bottom: -25px; mask: var(--wave-bottom) 0 0 / 100% 100%; -webkit-mask: var(--wave-bottom) 0 0 / 100% 100%; z-index: 1; }
.moss-band__waves { position: absolute; left: 0; top: 0; bottom: 0; width: 360px; opacity: .2; z-index: -1; color: var(--cream); }
.moss-band__grid { display: grid; grid-template-columns: auto 1px minmax(0, 1.2fr) minmax(0, 2fr); align-items: center; gap: 26px clamp(20px, 2.6vw, 40px); }
.moss-band h2 { color: var(--cream); font-weight: 500; font-size: clamp(1.7rem, 2.3vw, 2.1rem); margin: 0; display: flex; align-items: center; gap: 18px; line-height: 1.1; }
.moss-band h2.it { font-style: italic; }
.moss-band h2 .big-ico { width: 64px; height: 64px; stroke-width: 1.2; flex: none; }
.moss-band .vr { width: 1px; align-self: stretch; background: rgba(247, 241, 227, .3); }
.moss-band p { margin: 0; font-size: 1.04rem; color: #efe3cb; }
.icon-row { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 0; }
.icon-row > div { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; padding: 4px 10px; font-size: 1rem; line-height: 1.2; }
.icon-row > div + div { border-left: 1px solid rgba(247, 241, 227, .25); }
.icon-row .lucide, .icon-row svg { width: 38px; height: 38px; stroke-width: 1.3; }
.moss-band__stones { position: absolute; right: 0; top: -12px; bottom: -12px; width: min(19vw, 300px); z-index: -1; mask: linear-gradient(90deg, transparent, #000 35%); -webkit-mask: linear-gradient(90deg, transparent, #000 35%); }
.moss-band__stones img { width: 100%; height: 100%; object-fit: cover; }
.moss-band.has-stones .wrap-wide { padding-right: min(15vw, 230px); }

/* ---------- footer ---------- */
.site-footer { position: relative; margin-top: 30px; padding: 46px 0 0; background: var(--paper) var(--paper-grain); isolation: isolate; }
.site-footer::before { content: ""; position: absolute; left: 0; right: 0; top: -13px; height: 14px; background: inherit; mask: var(--torn-top) 0 0 / 100% 100%; -webkit-mask: var(--torn-top) 0 0 / 100% 100%; }
.footer-grid { display: grid; grid-template-columns: auto 1px auto auto auto 1px minmax(240px, 1fr) auto; gap: 24px clamp(16px, 2vw, 34px); align-items: start; padding-bottom: 70px; }
.f-col ul, .f-tag { white-space: nowrap; }
.footer-grid .vr { width: 1px; align-self: stretch; background: var(--line); }
.f-brand .brand svg { width: 80px; height: 44px; }
.f-brand .brand b { font-size: 1.2rem; }
.f-tag { font-family: var(--f-hand); font-size: 1.65rem; line-height: 1.05; color: var(--ink); transform: rotate(-6deg); margin-top: 6px; }
.f-tag::after { content: ""; display: block; width: 110px; height: 10px; margin: 8px 0 0 30px; background: var(--brush) no-repeat center / 100% 100%; }
.f-col h3, .f-news h3 { font-size: 1.12rem; margin: 0 0 .5em; }
.f-col ul { list-style: none; margin: 0; padding: 0; }
.f-col li { margin: 0 0 .25em; }
.f-col a { text-decoration: none; font-size: 1rem; }
.f-col a:hover, .f-col a[aria-current] { color: var(--rust); }
.f-news p { font-size: 1rem; margin-bottom: .8em; }
.news-form { display: flex; max-width: 380px; border-radius: 10px; overflow: hidden; box-shadow: 0 0 0 1px var(--line); background: var(--paper-light); }
.news-form input { flex: 1; min-width: 150px; border: 0; background: transparent; padding: 11px 14px; font: inherit; font-size: 1rem; color: var(--text); }
.news-form button { border: 0; background: var(--rust); color: var(--cream); font: 600 1rem var(--f-body); padding: 0 16px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.form-note { font-size: .92rem; color: var(--muted); margin-top: 6px; min-height: 1.2em; }
.socials { display: flex; gap: 10px; padding-top: 34px; }
.socials a { width: 38px; height: 38px; border-radius: 50%; background: var(--ink); color: var(--cream); display: grid; place-items: center; }
.socials a:hover { background: var(--rust); }
.socials .lucide { width: 19px; height: 19px; }
.f-mountains { position: absolute; left: 0; bottom: 50px; width: min(300px, 28vw); z-index: -1; opacity: .9; }
.f-thistle { position: absolute; right: 8px; bottom: 50px; width: 120px; z-index: -1; }
.strip-band__grid { grid-template-columns: minmax(330px, 1.05fr) minmax(0, 2.6fr) 70px; }
.strip-band { padding: 40px 0 46px; }
.footer-bottom { border-top: 1px solid var(--line); padding: 14px 0 18px; font-size: .95rem; color: var(--muted); display: flex; flex-wrap: wrap; gap: 6px 22px; justify-content: space-between; }
.footer-bottom a { text-decoration: none; }
.footer-bottom a:hover { color: var(--rust); }

/* ---------- generic content ---------- */
.section { padding: clamp(40px, 5vw, 70px) 0; position: relative; }
.split-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
.split-3 > * { padding: 0 clamp(18px, 2.4vw, 36px); }
.split-3 > * + * { border-left: 1px solid var(--line); }
.head-ico { display: flex; align-items: center; gap: 14px; margin-bottom: .5rem; }
.head-ico .lucide, .head-ico svg { width: 40px; height: 40px; color: var(--rust); stroke-width: 1.3; flex: none; }
.head-ico h2, .head-ico h3 { margin: 0; }
.checks { list-style: none; padding: 0; margin: 0; }
.checks li { display: flex; gap: 10px; align-items: baseline; margin: 0 0 .35em; }
.checks li::before { content: ""; flex: none; width: 15px; height: 11px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12'%3E%3Cpath d='M1.5 6.5 6 10.5 14.5 1.5' fill='none' stroke='%23343620' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain; transform: translateY(1px); }
.checks.boxed li::before { width: 17px; height: 17px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Crect x='1' y='1' width='16' height='16' rx='3' fill='none' stroke='%23343620' stroke-width='1.4'/%3E%3Cpath d='M4.5 9.2 7.6 12 13.5 5.5' fill='none' stroke='%23a64f2a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); transform: translateY(3px); }
.quote { font-family: var(--f-body); font-style: italic; font-size: clamp(1.3rem, 1.8vw, 1.6rem); line-height: 1.32; color: var(--ink); margin: 0; }
.quote::before { content: "\201C"; display: block; font-family: var(--f-head); font-style: normal; font-weight: 700; font-size: 4rem; line-height: .7; color: var(--rust); margin-bottom: 4px; }
.quote cite { display: block; margin-top: 14px; font-style: normal; font-size: 1.05rem; color: var(--rust); }

/* ---------- destinations ---------- */
.dest-layout { display: grid; grid-template-columns: minmax(250px, 340px) minmax(0, 1fr); gap: 34px; align-items: start; }
.dest-side { position: sticky; top: 104px; }
.dest-side h2 { font-style: italic; font-size: clamp(2rem, 2.6vw, 2.5rem); }
.dest-side p { font-size: 1.06rem; max-width: 16em; }
.map-box { position: relative; margin: 14px 0 0 auto; width: min(100% - 46px, 290px); }
.map-box img { width: 100%; }
.map-box > a { position: absolute; width: 44%; height: 6%; border-radius: 8px; }
.map-box > a:hover, .map-box > a:focus-visible { background: rgba(166, 79, 42, .12); }
.compass { position: absolute; left: -58px; bottom: 80px; width: 64px; }
.filter-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-bottom: 26px; }
.filter-bar strong { font-family: var(--f-head); font-style: italic; font-weight: 600; font-size: 1.25rem; color: var(--ink); margin-right: 6px; }
.chip { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 6px 22px; border-radius: 999px; border: 1.5px solid #9c8b67; background: transparent; font: 500 1.06rem var(--f-body); color: var(--ink); cursor: pointer; }
.chip .lucide { width: 22px; height: 22px; stroke-width: 1.4; }
.chip[aria-pressed="true"] { background: var(--moss); border-color: var(--moss); color: var(--cream); }
.chip:hover:not([aria-pressed="true"]) { background: var(--paper-deep); }
.dest-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.dest-card { position: relative; background: var(--paper-light) var(--paper-grain); border-radius: 16px 14px 18px 12px; box-shadow: var(--shadow); overflow: hidden; display: flex; flex-direction: column; scroll-margin-top: 110px; }
.dest-card[hidden] { display: none; }
.dest-card .ph { aspect-ratio: 334 / 122; }
.dest-card .ph img { width: 100%; height: 100%; object-fit: cover; }
.dest-card .body { position: relative; padding: 12px 20px 20px; flex: 1; display: flex; flex-direction: column; }
.dest-card h3 { font-style: italic; font-size: clamp(1.55rem, 2vw, 1.85rem); margin: 0 0 .3em; }
.dest-card p { font-size: 1rem; line-height: 1.42; margin-bottom: .9em; position: relative; z-index: 1; }
.dest-card .link-arrow { margin-top: auto; align-self: flex-start; position: relative; z-index: 1; }
.dest-card .sketch { position: absolute; right: 6px; bottom: 6px; width: 40%; max-width: 140px; height: 64px; object-fit: contain; object-position: right bottom; opacity: .85; pointer-events: none; }
.dest-card .facts { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .92rem; color: var(--muted); margin: -.3em 0 .8em; position: relative; z-index: 1; }
.dest-card .facts span { display: inline-flex; align-items: center; gap: 5px; }
.dest-card .facts .lucide { width: 15px; height: 15px; }

/* ---------- expeditions ---------- */
.choose-head { display: grid; grid-template-columns: auto 1fr; gap: 30px; align-items: end; margin-bottom: 26px; }
.choose-head h2 { font-style: italic; margin: 0; }
.choose-head p { margin: 0 0 .5em; font-size: 1.08rem; max-width: 30em; }
.exp-layout { display: grid; grid-template-columns: minmax(0, 3fr) 1px minmax(280px, 1.08fr); gap: 34px; }
.exp-layout > .vr { background: var(--line); }
.exp-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.exp-card { background: var(--paper-light) var(--paper-grain); border-radius: 16px; box-shadow: var(--shadow); display: flex; flex-direction: column; overflow: hidden; scroll-margin-top: 110px; }
.exp-card .ph { position: relative; aspect-ratio: 320 / 130; }
.exp-card .ph img { width: 100%; height: 100%; object-fit: cover; }
.tape { position: absolute; left: 14px; bottom: -14px; z-index: 2; display: inline-block; padding: 6px 18px 7px; background: #efe2c2; color: var(--ink); font-family: var(--f-head); font-style: italic; font-weight: 600; font-size: clamp(1.15rem, 1.5vw, 1.4rem); line-height: 1.1; transform: rotate(-1.6deg); box-shadow: 0 3px 8px -4px rgba(0, 0, 0, .35); clip-path: polygon(1% 6%, 99% 0, 100% 92%, 2% 100%); margin: 0; }
.exp-card .body { padding: 26px 20px 20px; display: flex; flex-direction: column; flex: 1; }
.exp-card .body > p { font-size: 1rem; line-height: 1.42; }
.facts-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: .3em 0 1em; font-size: .88rem; line-height: 1.18; text-align: center; color: var(--text); }
.facts-4 > div { display: flex; flex-direction: column; align-items: center; gap: 5px; }
.facts-4 .lucide, .facts-4 svg { width: 26px; height: 26px; color: var(--ink); stroke-width: 1.4; }
.facts-4 > div:first-child .lucide { color: var(--rust); }
.exp-card .link-arrow { margin-top: auto; align-self: flex-start; }
.other-exp h2 { font-size: clamp(1.7rem, 2.2vw, 2.1rem); }
.other-exp > p { font-size: 1.04rem; }
.mini-list { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 10px; }
.mini-list a { display: grid; grid-template-columns: 104px 1fr 34px; gap: 14px; align-items: center; padding: 6px 10px 6px 6px; border-radius: 40px 16px 16px 40px; background: var(--paper-light); box-shadow: 0 6px 14px -12px rgba(0, 0, 0, .5); text-decoration: none; }
.mini-list a:hover { background: #fffaf0; }
.mini-list .thumb { width: 104px; height: 58px; }
.mini-list b { display: block; font-family: var(--f-head); font-weight: 600; color: var(--ink); font-size: 1.08rem; line-height: 1.15; }
.mini-list i { display: block; font-size: .92rem; line-height: 1.25; color: var(--text); }
.mini-list .go { width: 32px; height: 32px; border-radius: 50%; background: var(--ink); color: var(--cream); display: grid; place-items: center; }
.mini-list .go .lucide { width: 16px; height: 16px; }

.itin { margin-top: 10px; }
.tabs { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 22px; }
.tab-panel { background: var(--paper-light) var(--paper-grain); border-radius: 18px; box-shadow: var(--shadow); padding: clamp(22px, 3vw, 36px); }
.tab-panel[hidden] { display: none; }
.tab-panel header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 30px; align-items: baseline; margin-bottom: 14px; }
.tab-panel header h3 { font-style: italic; font-size: 1.8rem; margin: 0; }
.tab-panel header p { margin: 0; color: var(--muted); }
.days { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.days li { display: grid; grid-template-columns: 64px 1fr; gap: 18px; padding: 14px 0; border-top: 1px dashed var(--line); }
.days .n { width: 56px; height: 56px; border-radius: 50%; background: var(--moss); color: var(--cream); display: grid; place-items: center; text-align: center; font-family: var(--f-head); font-size: .74rem; letter-spacing: .08em; line-height: 1.05; text-transform: uppercase; }
.days .n b { display: block; font-size: 1.4rem; letter-spacing: 0; }
.days h3, .days h4 { font-size: 1.22rem; margin: 2px 0 .25em; }
.days p { margin: 0; font-size: 1.04rem; }
.itin-note { font-size: .98rem; color: var(--muted); margin: 14px 0 0; }

.bottom-split { position: relative; display: grid; grid-template-columns: minmax(0, 2.5fr) minmax(320px, 1fr); align-items: stretch; margin-top: 46px; }
.bottom-split .moss-band { margin: 0; padding: 44px 0 40px; }
.bottom-split .moss-band .inner { padding: 0 90px 0 max(var(--gutter), calc((100vw - var(--wrap)) / 2)); display: grid; grid-template-columns: auto 1px minmax(0, 1fr); gap: 26px; align-items: center; }
.bottom-split .moss-band h2 { font-size: clamp(1.5rem, 2vw, 1.85rem); }
.bottom-split .icon-row > div { padding: 4px 6px; font-size: .96rem; }
.bottom-split .panel { margin: -40px 0 -20px -60px; padding: 50px clamp(26px, 3vw, 56px) 46px clamp(60px, 5vw, 90px); }
.bottom-split .panel h2 { display: flex; align-items: center; gap: 14px; font-weight: 500; }

/* ---------- day trips ---------- */
.facts-row { position: relative; display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.4fr) minmax(0, 1.15fr); align-items: center; padding: 10px 0 20px; }
.facts-row__photo { height: clamp(200px, 17vw, 260px); margin-right: -14%; }
.facts-row .panel { padding: 36px clamp(24px, 3vw, 46px) 40px; z-index: 1; }
.facts-row .panel .eyebrow { display: flex; align-items: center; justify-content: center; gap: 10px; font-size: .95rem; color: var(--cream); }
.trip-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); text-align: center; margin-top: 16px; }
.trip-facts > div { padding: 0 6px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.trip-facts > div + div { border-left: 1px solid rgba(247, 241, 227, .35); }
.trip-facts .lucide { width: 30px; height: 30px; stroke-width: 1.4; }
.trip-facts b { font-family: var(--f-body); font-weight: 600; font-size: 1.04rem; line-height: 1.15; color: var(--cream); }
.trip-facts span { font-size: .9rem; line-height: 1.25; color: #f4dccb; }
.book-card { position: relative; z-index: 2; margin-left: -10px; min-height: 300px; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: center; color: var(--cream); isolation: isolate; }
.book-card::before { content: ""; position: absolute; inset: 0; z-index: -2; background: var(--moss) var(--paper-grain); mask: var(--blob-c) 0 0 / 100% 100%; -webkit-mask: var(--blob-c) 0 0 / 100% 100%; }
.book-card .txt { padding: 34px 14px 34px clamp(24px, 2.6vw, 40px); position: relative; z-index: 1; }
.book-card .eyebrow { color: var(--cream); display: flex; gap: 8px; align-items: center; font-size: .78rem; }
.book-card h2 { color: var(--cream); font-style: italic; font-weight: 500; font-size: clamp(1.8rem, 2.5vw, 2.3rem); }
.book-card p { font-size: 1.02rem; color: #efe3cb; }
.book-card .ph { align-self: stretch; margin: 10px -10px 10px -8px; z-index: -1; }
.highlights-row { display: grid; grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1.7fr); gap: 30px; align-items: start; padding: 10px 0 30px; }
.highlights-row > .vr { background: var(--line); align-self: stretch; }
.highlights-row > .spacer { display: none; }
.with-art { display: grid; grid-template-columns: 100px 1fr; gap: 16px; }
.with-art img { width: 100px; margin-top: 10px; }
.equip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; text-align: center; margin: 10px 0 14px; }
.equip > div { display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: .98rem; line-height: 1.15; }
.equip svg { width: 54px; height: 44px; color: var(--ink); stroke-width: 1.2; }
.equip small { font-size: .86rem; color: var(--muted); }
.pill-note { display: inline-block; padding: 6px 22px; border-radius: 999px; background: #e3d4ae; font-style: italic; color: var(--ink); font-size: 1rem; }

/* ---------- plan your trip ---------- */
.ridge-line { display: block; width: 100%; height: 60px; color: var(--ink); opacity: .45; margin-bottom: -18px; }
.season { display: grid; grid-template-columns: 1fr; gap: 0; margin-top: 14px; }
.season > div { display: grid; grid-template-columns: 116px 1fr; gap: 12px; align-items: center; padding: 6px 0; border-top: 1px solid var(--line); font-size: .98rem; line-height: 1.25; }
.season b { display: inline-flex; align-items: center; gap: 8px; background: #e7d8b6; border-radius: 999px; padding: 5px 12px; font-weight: 600; font-size: .98rem; color: var(--ink); white-space: nowrap; }
.season b .lucide { width: 16px; height: 16px; }
.best-time { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 14px; align-items: start; }
.best-time .shape { height: 170px; margin-left: -20px; margin-top: 30px; }
.bring { position: relative; }
.bring .kit { position: absolute; right: -10px; bottom: -10px; width: 46%; max-width: 200px; pointer-events: none; }
.bring .checks { max-width: 62%; font-size: 1.02rem; }
.levels { display: grid; gap: 10px; margin-top: 14px; }
.levels > div { display: grid; grid-template-columns: 160px 1fr; gap: 16px; align-items: center; font-size: .98rem; line-height: 1.25; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.level { display: inline-flex; align-items: center; gap: 10px; color: var(--cream); padding: 7px 18px; border-radius: 999px 22px 999px 22px / 999px; font-weight: 600; font-size: 1.04rem; }
.level .lucide { width: 22px; height: 22px; }
.level--1 { background: var(--moss-2); }
.level--2 { background: #87601f; }
.level--3 { background: var(--rust); }
.plan-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.logistics { position: relative; padding-left: clamp(0px, 9vw, 135px); }
.logistics .art { position: absolute; left: -30px; top: 10px; width: clamp(0px, 11vw, 165px); }
.logistics dl { margin: 12px 0 0; display: grid; gap: 8px; }
.logistics dl > div { display: grid; grid-template-columns: 142px 1fr; gap: 12px; align-items: center; }
.logistics dt { display: inline-flex; align-items: center; gap: 8px; background: #e7d8b6; border-radius: 999px; padding: 7px 12px; font-weight: 600; color: var(--ink); font-size: .96rem; white-space: nowrap; }
.logistics dt .lucide { width: 19px; height: 19px; }
.logistics dd { margin: 0; font-size: .94rem; line-height: 1.25; }
.guides-panel { padding: 40px clamp(24px, 3vw, 44px) 44px; text-align: left; }
.guides-panel .head-ico .lucide { color: var(--cream); }
.guides-panel .cards-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 18px 0 20px; }
.guides-panel .photo-card { background: var(--paper-light); }
.guides-panel .photo-card img { aspect-ratio: 158 / 106; }
.guides-panel .center { text-align: center; }
.enquiry { position: relative; padding: 34px clamp(22px, 2.6vw, 38px) 36px; scroll-margin-top: 100px; }
.enquiry::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #e6d6b2 var(--paper-grain); border-radius: 26px 40px 30px 46px / 40px 28px 44px 30px; box-shadow: var(--shadow); }
.enquiry { isolation: isolate; }
.enquiry h2 { display: flex; align-items: center; gap: 14px; font-style: italic; font-size: clamp(1.6rem, 2.1vw, 2rem); }
.enquiry h2 svg { width: 70px; height: 34px; color: var(--ink); flex: none; }
.enquiry > p { font-size: 1.02rem; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.field { position: relative; display: flex; align-items: center; background: var(--paper-light); border-radius: 8px; box-shadow: 0 0 0 1px rgba(60, 58, 40, .28); }
.field.full { grid-column: 1 / -1; }
.field .lucide { position: absolute; left: 11px; top: 13px; width: 18px; height: 18px; color: var(--ink); pointer-events: none; }
.field input, .field select, .field textarea { width: 100%; border: 0; background: transparent; padding: 11px 12px 11px 38px; font: inherit; font-size: 1rem; color: var(--text); border-radius: 8px; appearance: none; -webkit-appearance: none; }
.field select { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23343620' stroke-width='1.8'/%3E%3C/svg%3E") no-repeat right 12px center / 12px; padding-right: 34px; cursor: pointer; }
.field textarea { min-height: 84px; resize: vertical; }
.field:focus-within { box-shadow: 0 0 0 2px var(--rust-2); }
.enquiry .btn { margin: 18px auto 0; display: flex; width: fit-content; }
.faq-row { display: grid; grid-template-columns: minmax(260px, .9fr) minmax(0, 2.3fr); gap: 30px; align-items: center; padding: 20px 0 10px; }
.faq-badge { position: relative; isolation: isolate; color: var(--cream); padding: 34px 30px 34px 36px; display: flex; align-items: center; gap: 18px; margin-left: calc(-1 * var(--gutter)); }
.faq-badge::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--moss) var(--paper-grain); mask: var(--blob-c) 0 0 / 100% 100%; -webkit-mask: var(--blob-c) 0 0 / 100% 100%; }
.faq-badge h2 { color: var(--cream); font-style: italic; font-weight: 500; font-size: clamp(1.7rem, 2.3vw, 2.15rem); margin: 0; }
.faq-badge .lucide { width: 50px; height: 50px; stroke-width: 1.2; }
.faq-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 34px; }
.faq-cols details { border-bottom: 1px solid var(--line); }
.faq-cols summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 14px; align-items: center; padding: 11px 2px; font-weight: 500; font-size: 1.06rem; color: var(--ink); }
.faq-cols summary::-webkit-details-marker { display: none; }
.faq-cols summary::after { content: ""; width: 10px; height: 10px; flex: none; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); transform: rotate(45deg) translateY(-3px); transition: transform .2s; }
.faq-cols details[open] summary::after { transform: rotate(225deg) translateY(-2px); }
.faq-cols details p { margin: 0 0 14px; font-size: 1.02rem; }

/* ---------- about ---------- */
.story-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) 1px minmax(0, .95fr); align-items: center; gap: 0 26px; padding: 4px 0 30px; }
.story-row .shape { height: clamp(220px, 18vw, 280px); margin-right: -20%; }
.story-row .panel { padding: 40px clamp(26px, 3vw, 50px) 44px; z-index: 1; }
.story-row .vr { width: 1px; align-self: stretch; margin: 40px 0; background: var(--line); }
.story-row .quote-wrap { position: relative; padding: 10px 0; }
.story-row .quote-wrap .eagle { position: absolute; right: -10px; top: 0; width: 110px; }
.pillars { padding: 20px 0 30px; }
.pillars .split-3 > div { position: relative; }
.pillars h3 { font-weight: 500; font-size: 1.5rem; line-height: 1.1; }
.pillars p { font-size: 1.02rem; }
.pillar-art-l { position: absolute; left: calc(-1 * clamp(0px, 13vw, 230px)); top: 20px; width: clamp(0px, 14vw, 225px); }
.pillar-art-r { position: absolute; right: -150px; top: -10px; width: 135px; }
.pillars .wrap-wide { padding-left: clamp(0px, 13vw, 210px); padding-right: clamp(0px, 9vw, 140px); }
.guides-row { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1fr) 1px minmax(0, 1.6fr); align-items: center; gap: 0 28px; padding: 10px 0 40px; }
.guides-row .vr { width: 1px; align-self: stretch; background: var(--line); margin: 30px 0; }
.guides-row > .shape { height: clamp(220px, 17vw, 270px); }
.testimonial { position: relative; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: center; isolation: isolate; }
.testimonial::before { content: ""; position: absolute; inset: 6% 20% 4% 0; z-index: -1; background: #e6d6b2 var(--paper-grain); mask: var(--blob-a) 0 0 / 100% 100%; -webkit-mask: var(--blob-a) 0 0 / 100% 100%; }
.testimonial .quote { font-size: clamp(1.15rem, 1.5vw, 1.32rem); padding: 30px 10px 30px 40px; }
.testimonial .shape { height: clamp(200px, 16vw, 250px); }
.cta-band { position: relative; margin-top: 30px; }
.cta-band .moss-band { margin-top: 0; padding: 36px 0 34px; }
.cta-band .inner { display: grid; grid-template-columns: auto 1px minmax(0, 1fr) auto; gap: 26px; align-items: center; }
.cta-band .art-r { position: absolute; right: 6px; bottom: -6px; width: 104px; z-index: 2; pointer-events: none; }
.cta-band .inner { padding-right: 70px; }

.notes-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr)); gap: 22px; margin-top: 26px; }
.note-card { scroll-margin-top: 110px; }
.note-card h3 { font-style: italic; font-size: 1.6rem; margin-bottom: .4em; }
.note-card p { font-size: 1.02rem; }
.kv { margin: 0 0 12px; display: grid; gap: 0; }
.kv > div { display: grid; grid-template-columns: 110px 1fr; gap: 12px; padding: 6px 0; border-top: 1px dashed var(--line); font-size: .98rem; line-height: 1.3; }
.kv dt { font-weight: 600; color: var(--rust); }
.kv dd { margin: 0; }

.more summary { list-style: none; cursor: pointer; width: fit-content; }
.more summary::-webkit-details-marker { display: none; }
.more[open] summary .lucide { transform: rotate(90deg); }
.more p { margin: 10px 0 0; font-size: 1rem; }
.cta-band h2 .big-ico { width: 56px; height: 56px; }
.cta-band .btn svg { width: 1.4em; height: 1.4em; }

/* ---------- herbs (drawn in site.js) ---------- */
[data-herbs] { position: relative; isolation: isolate; overflow-x: clip; }
.herbs { --h: 124px; position: absolute; bottom: -2px; z-index: -1; display: flex; align-items: flex-end; pointer-events: none; }
[data-herb-size="sm"] > .herbs { --h: 92px; }
[data-herb-size="lg"] > .herbs { --h: 168px; }
.herbs--bl { left: clamp(2px, 1.2vw, 22px); }
.herbs--br { right: clamp(2px, 1.2vw, 22px); flex-direction: row-reverse; }
.herbs svg { width: calc(var(--h) * .46); height: var(--h); margin: 0 calc(var(--h) * -.09); transform-origin: 50% 100%; overflow: visible; }
.herbs svg:nth-child(1) { transform: rotate(-7deg); }
.herbs svg:nth-child(2) { height: calc(var(--h) * .8); width: calc(var(--h) * .37); transform: rotate(5deg); }
.herbs svg:nth-child(3) { height: calc(var(--h) * .9); width: calc(var(--h) * .41); transform: rotate(13deg); }
.herbs--br svg { scale: -1 1; }
.herbs--fr { right: 120px; bottom: 48px; --h: 110px; }
.herb-ill { display: block; width: 64px; height: 140px; overflow: visible; }

/* ---------- home: where to paddle ---------- */
.where-grid { display: grid; grid-template-columns: minmax(220px, 300px) minmax(0, 1fr); gap: clamp(30px, 5vw, 80px); align-items: center; max-width: 1180px; }
.where-grid .map-box { margin: 0 auto; width: min(100%, 290px); }
.where-grid h2 { font-size: clamp(2rem, 3vw, 2.6rem); }
.where-grid > div > p { max-width: 36em; }
.dest-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; margin: 22px 0 24px; }
.dest-tile { display: grid; grid-template-columns: 112px 1fr 30px; gap: 14px; align-items: center; padding: 6px 12px 6px 6px; border-radius: 40px 16px 16px 40px; background: var(--paper-light); box-shadow: 0 8px 18px -14px rgba(60, 40, 10, .6); text-decoration: none; transition: transform .15s ease, background-color .15s ease; }
.dest-tile:hover { transform: translateY(-2px); background: #fffaf0; }
.dest-tile .thumb { width: 112px; height: 66px; }
.dest-tile .thumb img { object-position: 78% 55%; }
.dest-tile b { display: block; font-family: var(--f-head); font-weight: 600; font-size: 1.16rem; color: var(--ink); line-height: 1.15; }
.dest-tile i { display: block; font-size: .95rem; color: var(--muted); }
.dest-tile .tag { display: inline-block; margin-top: 4px; padding: 1px 10px; border-radius: 999px; font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; background: var(--ochre-light); color: var(--umber); font-style: normal; }
.dest-tile .go { width: 30px; height: 30px; border-radius: 50%; background: var(--moss); color: var(--cream); display: grid; place-items: center; }
.dest-tile .go .lucide { width: 15px; height: 15px; }

/* ---------- home: seasons ---------- */
.seasons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin-top: 28px; }
.seasons > article { display: grid; grid-template-columns: 70px 1fr; gap: 18px; padding: 6px clamp(16px, 2.4vw, 34px); }
.seasons > article + article { border-left: 1px solid var(--line); }
.seasons h3 { font-style: italic; font-size: 1.6rem; margin: 0 0 .2em; }
.seasons .months { display: inline-block; padding: 3px 14px; border-radius: 999px; background: var(--ochre-light); color: var(--umber); font-weight: 600; font-size: .95rem; margin-bottom: 10px; }
.seasons ul { list-style: none; margin: 0; padding: 0; }
.seasons li { padding: 7px 0; border-top: 1px dashed var(--line); font-size: 1.02rem; line-height: 1.3; }
.seasons li a { font-weight: 600; color: var(--rust); text-decoration: none; }
.seasons li a:hover { text-decoration: underline; }
.center-head { text-align: center; max-width: 720px; margin: 0 auto; }
.center-head .brushed::after { left: 50%; transform: translateX(-50%); }

/* ---------- vjosa page ---------- */
.ways { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; margin-top: 26px; }
.ways .exp-card .ph { aspect-ratio: 16 / 7; }
.ways .exp-card h3 { font-style: italic; font-size: 1.7rem; margin-bottom: .3em; }
.price-line { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0 0 14px; font-size: .98rem; color: var(--umber); }
.price-line span { display: inline-flex; align-items: center; gap: 6px; }
.price-line .lucide { width: 17px; height: 17px; color: var(--rust); }
.base-card { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 30px; align-items: center; background: var(--paper-light) var(--paper-grain); border-radius: 22px 30px 24px 34px / 30px 22px 34px 24px; box-shadow: var(--shadow); padding: clamp(24px, 3vw, 40px); }
.base-card .kv > div { grid-template-columns: 130px 1fr; }

/* the map of Albania (drawn from real geographic data, see tools/build-map.ps1) */
.albania-map svg { display: block; width: 100%; height: auto; filter: drop-shadow(0 12px 18px rgba(70, 50, 20, .22)); }
.albania-map .pin:focus { outline: none; }
.albania-map .pin:focus-visible .pin-r { stroke: var(--ink); stroke-width: 2.5; }
.dest-side .map-box { width: 100%; max-width: 340px; margin: 18px 0 0; }
.where-grid { grid-template-columns: minmax(260px, 380px) minmax(0, 1fr); }
.where-grid .map-box { width: 100%; max-width: 380px; }
/* ---------- vjosa page: park, seasons, around, routes ---------- */
.park-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(26px, 4vw, 56px); align-items: center; }
.stat-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.stat-tiles > div { background: var(--paper-light) var(--paper-grain); border-radius: 18px 14px 20px 12px; box-shadow: var(--shadow); padding: 16px 18px; }
.stat-tiles b { display: block; font-family: var(--f-head); font-weight: 600; font-size: clamp(1.7rem, 2.6vw, 2.2rem); line-height: 1; color: var(--rust); margin-bottom: 6px; }
.stat-tiles span { font-size: .98rem; line-height: 1.25; color: var(--text); }
.src-note { font-size: .88rem; color: var(--muted); font-style: italic; }
.months-strip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin-top: 24px; }
.months-strip article { position: relative; background: var(--paper-light) var(--paper-grain); border-radius: 16px; box-shadow: var(--shadow); padding: 18px 18px 16px; border-top: 5px solid var(--ochre); }
.months-strip article:nth-child(1) { border-top-color: var(--moss-2); }
.months-strip article:nth-child(3) { border-top-color: var(--rust); }
.months-strip article:nth-child(5) { border-top-color: var(--umber); }
.months-strip .m { display: inline-block; font-family: var(--f-head); font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: var(--rust); margin-bottom: 4px; }
.months-strip h3 { font-style: italic; font-size: 1.35rem; margin: 0 0 .35em; }
.months-strip p { font-size: .98rem; line-height: 1.38; margin: 0; }
.around-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px 34px; margin-top: 24px; }
.around-grid > div { padding-top: 14px; border-top: 1px solid var(--line); }
.around-grid h3 { font-size: 1.32rem; }
.around-grid p { font-size: 1.02rem; }
.routes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 22px; }
.routes > div { background: var(--paper-light); border-radius: 14px; padding: 16px 18px; box-shadow: 0 8px 18px -14px rgba(60, 40, 10, .6); }
.routes b { display: flex; align-items: center; gap: 8px; font-family: var(--f-head); font-weight: 600; font-size: 1.12rem; color: var(--ink); }
.routes b .lucide { width: 19px; height: 19px; color: var(--rust); }
.routes .dist { display: inline-block; margin: 6px 0 6px; padding: 2px 12px; border-radius: 999px; background: var(--ochre-light); color: var(--umber); font-weight: 600; font-size: .92rem; }
.routes p { margin: 0; font-size: .98rem; line-height: 1.35; }

/* ---------- day trips: steps, fit, booking widget ---------- */
.steps { list-style: none; margin: 30px 0 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; counter-reset: s; position: relative; }
.steps::before { content: ""; position: absolute; left: 8%; right: 8%; top: 27px; border-top: 2px dashed var(--sage); z-index: -1; }
.steps li { text-align: center; display: flex; flex-direction: column; align-items: center; }
.steps .num { width: 54px; height: 54px; border-radius: 50%; background: var(--moss); color: var(--cream); display: grid; place-items: center; font-family: var(--f-head); font-weight: 600; font-size: 1.4rem; box-shadow: 0 0 0 6px var(--paper); }
.steps .lucide, .steps li > svg { width: 34px; height: 30px; color: var(--rust); margin: 12px 0 4px; stroke-width: 1.5; }
.steps h3 { font-size: 1.22rem; margin: 0 0 .3em; }
.steps p { font-size: .98rem; line-height: 1.35; margin: 0; max-width: 16em; }
.fit-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 22px; align-items: start; }
.fit-grid .note-card { padding: 24px 26px; }
.fit-grid .checks { margin: 10px 0 16px; }
.safety-note { display: grid; grid-template-columns: 30px 1fr; gap: 10px; align-items: start; background: #efe1bf; border-radius: 12px; padding: 12px 14px; margin-bottom: 14px; }
.safety-note .lucide { width: 26px; height: 26px; color: var(--rust); }
.safety-note p { margin: 0; font-size: .98rem; line-height: 1.38; }
.alt-note { font-size: 1rem; margin: 0; }
.alt-note .link-arrow { margin-top: 6px; }
.fit-grid .kv > div { grid-template-columns: 125px 1fr; }
.book-widget { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 28px; align-items: center; color: var(--cream); padding: clamp(28px, 4vw, 46px) clamp(24px, 4vw, 52px); }
.book-widget::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--moss) var(--paper-grain); border-radius: 30px 44px 34px 48px / 44px 30px 48px 34px; box-shadow: var(--shadow); }
.book-widget h2 { color: var(--cream); font-style: italic; font-size: clamp(1.8rem, 2.6vw, 2.3rem); }
.book-widget .eyebrow { color: var(--ochre-light); display: flex; align-items: center; gap: 8px; }
.book-widget p { color: #efe3cb; }
.book-widget__form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.book-widget__form .btn { grid-column: 1 / -1; justify-self: start; margin-top: 4px; }
.book-widget__form .status { grid-column: 1 / -1; color: var(--ochre-light); text-align: left; }
.book-widget .field { background: var(--paper-light); }

/* ---------- floating WhatsApp + mobile booking bar ---------- */
.float-wa { position: fixed; right: 18px; bottom: 18px; z-index: 55; display: inline-flex; align-items: center; gap: 8px; height: 54px; padding: 0 18px 0 14px; border-radius: 999px; background: var(--moss); color: var(--cream); text-decoration: none; font-weight: 600; box-shadow: 0 10px 24px -10px rgba(30, 30, 10, .7); transition: transform .15s ease, background-color .15s ease; }
.float-wa svg { width: 28px; height: 28px; }
.float-wa:hover { transform: translateY(-2px); background: var(--rust); }
.m-book-bar { display: none; }
/* ---------- misc ---------- */
.wave-strip { height: 34px; background: var(--moss) var(--paper-grain); mask: var(--wave-top) 0 0 / 100% 100%; -webkit-mask: var(--wave-top) 0 0 / 100% 100%; margin: 30px 0 -20px; opacity: .92; }
.note-card { background: var(--paper-light); border-radius: 14px; box-shadow: var(--shadow); padding: 18px 22px; }
.status { font-size: .98rem; color: var(--moss); margin-top: 10px; text-align: center; min-height: 1.3em; }
.notfound { text-align: center; padding: 80px 0 60px; }
.notfound h1 { margin-bottom: .3em; }

/* =========================================================================
   Responsive
   ========================================================================= */
@media (max-width: 1180px) {
  .main-nav > ul { gap: 18px; }
  .main-nav a.top, .main-nav button.top { font-size: 1rem; }
  .footer-grid { grid-template-columns: auto 1px 1fr auto auto; }
  .f-news { grid-column: 1 / 4; }
  .socials { grid-column: 4 / -1; padding-top: 30px; }
  .footer-grid > .vr:last-of-type { display: none; }
  .exp-layout { grid-template-columns: 1fr; }
  .exp-layout > .vr { display: none; }
  .other-exp { display: grid; grid-template-columns: 1fr 1.4fr; gap: 10px 30px; align-items: start; }
  .other-exp .link-arrow { grid-column: 2; justify-self: start; }
  .plan-row { grid-template-columns: 1fr 1fr; }
  .plan-row .enquiry { grid-column: 1 / -1; max-width: 720px; justify-self: center; width: 100%; }
}

@media (max-width: 1020px) {
  :root { --gutter: 22px; }
  .nav-toggle { display: inline-flex; }
  .main-nav { position: fixed; inset: 88px 0 auto 0; max-height: calc(100vh - 88px); overflow: auto; background: var(--paper) var(--paper-grain); flex-direction: column; align-items: stretch; gap: 0; padding: 10px var(--gutter) 24px; box-shadow: 0 20px 30px -20px rgba(0, 0, 0, .4); transform: translateY(-8px); opacity: 0; visibility: hidden; transition: .2s ease; }
  .nav-open .main-nav { transform: none; opacity: 1; visibility: visible; }
  .main-nav > ul { flex-direction: column; align-items: stretch; gap: 0; }
  .main-nav li { border-bottom: 1px solid var(--line); }
  .main-nav a.top, .main-nav button.top { width: 100%; justify-content: space-between; padding: 14px 2px; font-size: 1.15rem; }
  .sub { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; background: transparent; padding: 0 0 10px 12px; display: none; }
  .has-sub.open .sub { display: block; }
  .has-sub:hover .sub { display: none; }
  .has-sub.open:hover .sub { display: block; }
  .nav-cta { margin-top: 18px; align-self: flex-start; }
  .nav-bar > .nav-cta-desktop { display: none; }

  .hero { min-height: 0; display: flex; flex-direction: column; }
  .hero__media { position: relative; inset: auto; height: clamp(250px, 52vw, 420px); mask: var(--torn-bottom) bottom / 100% 14px no-repeat, linear-gradient(#000, #000) top / 100% calc(100% - 13px) no-repeat; -webkit-mask: var(--torn-bottom) bottom / 100% 14px no-repeat, linear-gradient(#000, #000) top / 100% calc(100% - 13px) no-repeat; }
  .hero__media img { object-position: 60% 50%; }
  .hero__content { padding: 30px var(--gutter) 40px; max-width: 700px; }
  .hero__flowers { display: none; }
  .hero__topo { top: auto; bottom: 0; }
  .hero__badge { top: 16px; width: 140px; }
  .hero__badge span { font-size: 1.22rem; }

  .intro-band__grid { grid-template-columns: 1fr; gap: 16px; width: min(var(--wrap), 100% - 2 * var(--gutter)); margin-inline: auto; }
  .intro-band__art-l, .intro-band .vr { display: none; }
  .intro-band__art-r { min-height: 90px; }
  .intro-band__art-r .eagle { left: auto; right: 40%; }

  .feature-row__grid { grid-template-columns: 1fr; gap: 22px; }
  .feature-row__photo { margin: 0; height: 280px; }
  .feature-row .panel { margin-top: -70px; }
  .feature-row .vr { display: none; }

  .strip-band__grid { grid-template-columns: 1fr; }
  .strip-band .sprig { display: none; }
  .cards-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .moss-band__grid { grid-template-columns: 1fr; }
  .moss-band .vr { display: none; }
  .moss-band__stones { display: none; }
  .moss-band.has-stones .wrap-wide { padding-right: 0; }

  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-grid .vr { display: none; }
  .f-news, .socials { grid-column: auto; }
  .f-news { grid-column: 1 / -1; }
  .socials { padding-top: 0; }
  .f-mountains, .f-thistle { opacity: .4; }

  .dest-layout { grid-template-columns: minmax(0, 1fr); }
  .dest-side { position: static; display: grid; grid-template-columns: 1fr 240px; gap: 20px; align-items: start; }
  .map-box { margin: 0; }
  .dest-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .choose-head { grid-template-columns: 1fr; gap: 6px; }
  .exp-cards { grid-template-columns: 1fr 1fr; }
  .other-exp { grid-template-columns: 1fr; }
  .other-exp .link-arrow { grid-column: auto; }

  .bottom-split { grid-template-columns: 1fr; }
  .bottom-split .moss-band .inner { padding: 0 var(--gutter); grid-template-columns: 1fr; }
  .bottom-split .moss-band .vr { display: none; }
  .bottom-split .panel { margin: -10px var(--gutter) 0; }

  .facts-row { grid-template-columns: 1fr; gap: 16px; }
  .facts-row__photo { margin: 0; height: 240px; }
  .facts-row .panel { margin-top: -60px; }
  .book-card { margin: 0; }
  .highlights-row { grid-template-columns: 1fr; }
  .highlights-row > .vr, .highlights-row > .spacer { display: none; }

  .split-3 { grid-template-columns: 1fr; gap: 34px; }
  .split-3 > * { padding: 0; }
  .split-3 > * + * { border-left: 0; border-top: 1px solid var(--line); padding-top: 30px; }
  .plan-row { grid-template-columns: 1fr; }
  .logistics { padding-left: 0; }
  .logistics .art { display: none; }
  .faq-row { grid-template-columns: 1fr; }
  .faq-badge { margin-left: 0; justify-self: start; }

  .story-row, .guides-row { grid-template-columns: 1fr; gap: 20px; }
  .story-row .shape { margin: 0; }
  .story-row .panel { margin-top: -60px; }
  .story-row .vr, .guides-row .vr { display: none; }
  .story-row .quote-wrap .eagle { width: 80px; }
  .pillars .wrap-wide { padding: 0; }
  .pillar-art-l, .pillar-art-r { display: none; }
  .testimonial { grid-template-columns: 1fr; }
  .testimonial::before { inset: 0; }
  .cta-band .inner { grid-template-columns: 1fr; }
  .cta-band .vr { display: none; }
  .cta-band .art-r { display: none; }
  .cta-band .inner { padding-right: 0; }
}

@media (max-width: 640px) {
  :root { --gutter: 16px; }
  body { font-size: 1.1rem; }
  .nav-bar { height: 74px; }
  .main-nav { inset: 74px 0 auto 0; max-height: calc(100vh - 74px); }
  .brand svg { width: 70px; height: 40px; }
  .brand b { font-size: 1.18rem; }
  .hero__badge { width: 112px; top: 10px; right: 8px; }
  .hero__badge span { font-size: 1rem; }
  .hero__content { padding: 24px var(--gutter) 34px; }
  .hero__lead { font-size: 1.12rem; }
  .btn { font-size: 1rem; }
  .cards-4, .dest-grid, .exp-cards { grid-template-columns: 1fr; }
  .cards-4 { grid-template-columns: 1fr 1fr; gap: 12px; }
  .side-feature { grid-template-columns: 1fr; }
  .strip-intro { grid-template-columns: 1fr; }
  .strip-intro .outline { display: none; }
  .icon-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 0; }
  .icon-row > div:nth-child(odd) { border-left: 0; }
  .dest-side { grid-template-columns: 1fr; }
  .map-box { margin: 0 auto; }
  .trip-facts { grid-template-columns: 1fr 1fr; gap: 18px 0; }
  .trip-facts > div:nth-child(3) { border-left: 0; }
  .book-card { grid-template-columns: 1fr; }
  .book-card .ph { height: 200px; margin: -10px 20px 24px; }
  .equip { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 16px; }
  .with-art { grid-template-columns: 1fr; }
  .with-art img { display: none; }
  .best-time { grid-template-columns: 1fr; }
  .best-time .shape { margin: 0; }
  .bring .checks { max-width: 100%; }
  .bring .kit { position: static; width: 60%; margin: 10px auto 0; }
  .levels > div, .logistics dl > div { grid-template-columns: 1fr; gap: 6px; }
  .guides-panel .cards-3 { grid-template-columns: 1fr 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .faq-cols { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .facts-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 12px; }
  .mini-list a { grid-template-columns: 84px 1fr 32px; }
  .mini-list .thumb { width: 84px; height: 50px; }
  .days li { grid-template-columns: 52px 1fr; gap: 12px; }
  .days .n { width: 48px; height: 48px; }
}

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

/* responsive rules for the herbs, home map/seasons and Vjosa page */
@media (max-width: 1020px) {
  .where-grid { grid-template-columns: 1fr; }
  .where-grid .map-box { width: 100%; max-width: 360px; }
  .seasons { grid-template-columns: 1fr; gap: 24px; }
  .seasons > article + article { border-left: 0; border-top: 1px solid var(--line); padding-top: 24px; }
  .ways { grid-template-columns: 1fr; }
  .base-card { grid-template-columns: 1fr; }
  .herbs--fr { display: none; }
}
@media (max-width: 640px) {
  .dest-tiles { grid-template-columns: 1fr; }
  .herbs { --h: 84px !important; }
  .base-card .kv > div { grid-template-columns: 1fr; gap: 2px; }
}
/* responsive rules for the expanded Vjosa and day-trip pages and site-wide extras */
@media (max-width: 1020px) {
  .park-grid, .fit-grid, .book-widget { grid-template-columns: 1fr; }
  .months-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .months-strip article:last-child { grid-column: 1 / -1; }
  .around-grid, .routes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 26px; }
  .steps::before { display: none; }
}
@media (max-width: 640px) {
  .stat-tiles { grid-template-columns: 1fr 1fr; gap: 10px; }
  .stat-tiles > div { padding: 12px 14px; }
  .months-strip, .around-grid, .routes { grid-template-columns: 1fr; }
  .steps { grid-template-columns: 1fr; gap: 0; text-align: left; }
  .steps li { display: grid; grid-template-columns: 54px 1fr; column-gap: 14px; text-align: left; align-items: start; padding: 10px 0; border-bottom: 1px dashed var(--line); }
  .steps li > .num { grid-row: span 3; }
  .steps .lucide, .steps li > svg { display: none; }
  .steps p { max-width: none; }
  .fit-grid .kv > div { grid-template-columns: 1fr; gap: 2px; }
  .book-widget__form { grid-template-columns: 1fr; }
  .book-widget__form .btn { justify-self: stretch; justify-content: center; }
  .float-wa { right: 12px; bottom: 12px; width: 54px; padding: 0; justify-content: center; }
  .float-wa span { display: none; }
  .m-book-bar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 54; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 78px 10px 16px; background: var(--paper-light); box-shadow: 0 -8px 20px -12px rgba(40, 30, 10, .5); font-size: 1rem; }
  .m-book-bar b { font-family: var(--f-head); font-size: 1.2rem; color: var(--rust); }
  body:has(.m-book-bar) .float-wa { bottom: 12px; }
  body:has(.m-book-bar) .site-footer { padding-bottom: 64px; }
}
/* phone polish */
@media (max-width: 640px) {
  section[data-herbs] { padding-bottom: 86px !important; }
  .herbs { --h: 72px !important; }
  .hero__topo { display: none; }
  .days .n { font-size: .56rem; letter-spacing: .04em; }
  .days .n b { font-size: 1.15rem; }
  .book-card .txt { padding: 34px 28px 6px 38px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 22px 18px; }
  .f-brand, .f-tag, .f-news, .socials { grid-column: 1 / -1; }
  .f-brand .seal { width: 104px; height: 104px; }
  .footer-bottom { flex-direction: column; font-size: .9rem; }
  .section { padding-top: 34px; padding-bottom: 34px; }
  h2 { font-size: 1.85rem; }
  .center-head h2 { font-size: 1.8rem; }
  .hero__badge { width: 104px; }
  .hero__badge span { font-size: .95rem; }
}
@media (max-width: 640px) {
  .filter-bar { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(-1 * var(--gutter)); padding: 2px var(--gutter) 8px; }
  .filter-bar::-webkit-scrollbar { display: none; }
  .filter-bar > * { flex: none; }
  .tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .tabs > * { flex: none; }
}
@media (max-width: 640px) { .footer-bottom { padding-bottom: 80px; } }

/* ---------- colour sticker icons (drawn in site.js, EMO) ---------- */
svg.emo { flex: none; overflow: visible; filter: drop-shadow(0 2px 2px rgba(70, 50, 20, .18)); }
.head-ico svg.emo { width: 48px; height: 48px; }
.icon-row svg.emo { width: 50px; height: 50px; }
.trip-facts svg.emo { width: 44px; height: 44px; }
.facts-4 svg.emo { width: 36px; height: 36px; }
.steps svg.emo { width: 46px; height: 46px; margin: 10px 0 4px; }
.equip svg.emo { width: 56px; height: 56px; }
.side-feature svg.emo.ico { width: 50px; height: 50px; }
.panel svg.emo.panel__icon { width: 52px; height: 52px; }
svg.emo.big-ico { width: 68px; height: 68px; }
.faq-badge svg.emo { width: 60px; height: 60px; }
.safety-note svg.emo { width: 36px; height: 36px; }
.panel h2 svg.emo { width: 48px; height: 48px; vertical-align: middle; }
.moss-band h2 svg.emo, .bottom-split h2 svg.emo { width: 64px; height: 64px; }
.icon-row > div { gap: 10px; }

/* leaf bullets for lists */
.checks:not(.boxed) li::before { width: 16px; height: 16px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M3 17C2 9 7 3 17 3c1 9-5 14-14 14Z' fill='%238fa060' stroke='%2354492a' stroke-width='1.2' stroke-linejoin='round'/%3E%3Cpath d='M3.5 16.5 13 7' fill='none' stroke='%2354492a' stroke-width='1'/%3E%3C/svg%3E"); transform: translateY(2px); }

/* hedgerow of herbs used as a divider */
.herb-row { display: flex; justify-content: center; align-items: flex-end; gap: 0; height: 96px; margin: 0 auto; position: relative; }
.herb-row::after { content: ""; position: absolute; left: 50%; bottom: 2px; width: min(560px, 80%); transform: translateX(-50%); height: 10px; background: var(--brush) no-repeat center / 100% 100%; opacity: .35; }
.herb-row svg { width: 40px; height: 88px; margin: 0 -6px; overflow: visible; transform-origin: 50% 100%; }
.herb-row svg:nth-child(odd) { height: 76px; transform: rotate(-5deg); }
.herb-row svg:nth-child(3n) { height: 94px; transform: rotate(6deg); }
@media (max-width: 640px) {
  .herb-row { height: 70px; }
  .herb-row svg { width: 30px; height: 64px; }
  .herb-row svg:nth-child(n+6) { display: none; }
}
/* ---------- home: at a glance, trip cards, why Albania ---------- */
.glance-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 26px 0 0; }
.glance-grid > div { display: grid; grid-template-columns: 52px 1fr; gap: 4px 14px; align-items: start; background: var(--paper-light) var(--paper-grain); border-radius: 18px 14px 20px 12px; box-shadow: var(--shadow); padding: 16px 18px; }
.glance-grid svg.emo { grid-row: span 2; width: 50px; height: 50px; }
.glance-grid dt { font-family: var(--f-head); font-weight: 600; font-size: 1.15rem; color: var(--ink); }
.glance-grid dd { margin: 0; font-size: 1rem; line-height: 1.38; }
.trip-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 26px; align-items: stretch; }
.trip-card { position: relative; display: flex; flex-direction: column; background: var(--paper-light) var(--paper-grain); border-radius: 22px 18px 24px 16px; box-shadow: var(--shadow); padding: 26px 24px 24px; }
.trip-card .tc-ico { width: 62px; height: 62px; margin-bottom: 8px; }
.trip-card h3 { font-style: italic; font-size: 1.6rem; margin-bottom: .2em; }
.tc-price { font-family: var(--f-head); font-weight: 600; font-size: 1.5rem; color: var(--rust); margin: 0 0 12px; }
.tc-price span { font-family: var(--f-body); font-weight: 400; font-size: 1rem; color: var(--muted); }
.trip-card .checks { margin-bottom: 18px; font-size: 1.02rem; }
.trip-card .btn { margin-top: auto; align-self: flex-start; }
.trip-card--feat { background: var(--moss) var(--paper-grain); color: var(--cream); transform: translateY(-8px); }
.trip-card--feat h3 { color: var(--cream); }
.trip-card--feat .tc-price { color: var(--ochre-light); }
.trip-card--feat .tc-price span { color: #d9ccb0; }
.steps--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 940px; margin-inline: auto; }
.why-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 30px; margin-top: 28px; }
.why-grid article { display: grid; grid-template-columns: 54px 1fr; gap: 14px; align-items: start; }
.why-grid svg.emo { width: 52px; height: 52px; }
.why-grid h3 { font-size: 1.22rem; margin: 4px 0 .3em; }
.why-grid p { font-size: 1rem; line-height: 1.42; margin: 0; }

/* ---------- waves ---------- */
.wave-divider { height: 46px; margin: 6px 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 46'%3E%3Cg fill='none' stroke-linecap='round'%3E%3Cpath d='M0 14q37.5-12 75 0t75 0 75 0 75 0 75 0 75 0 75 0 75 0' stroke='%23a9c7c4' stroke-width='2.2'/%3E%3Cpath d='M-37.5 24q37.5-12 75 0t75 0 75 0 75 0 75 0 75 0 75 0 75 0 75 0' stroke='%237fa8a1' stroke-width='2.6'/%3E%3Cpath d='M0 34q37.5-12 75 0t75 0 75 0 75 0 75 0 75 0 75 0 75 0' stroke='%2357623a' stroke-width='2' opacity='.55'/%3E%3C/g%3E%3C/svg%3E") repeat-x 0 50% / 600px 46px; opacity: .8; animation: wave-drift 38s linear infinite; mask: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); -webkit-mask: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
@keyframes wave-drift { to { background-position-x: -600px; } }
.moss-band__waves svg { animation: wave-sway 9s ease-in-out infinite alternate; }
@keyframes wave-sway { to { transform: translateX(-24px); } }
.hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 4px; height: 26px; z-index: 0; pointer-events: none; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 26'%3E%3Cpath d='M0 13q18.75-9 37.5 0t37.5 0 37.5 0 37.5 0 37.5 0 37.5 0 37.5 0 37.5 0' fill='none' stroke='%237fa8a1' stroke-width='2' opacity='.6'/%3E%3C/svg%3E") repeat-x 0 0 / 300px 26px; width: 34%; animation: wave-drift 30s linear infinite; }
@media (prefers-reduced-motion: reduce) { .wave-divider, .moss-band__waves svg, .hero::after { animation: none; } }
@media (max-width: 1020px) {
  .glance-grid, .why-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .trip-cards { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; }
  .trip-card--feat { transform: none; }
  .hero::after { display: none; }
}
@media (max-width: 640px) {
  .glance-grid, .why-grid { grid-template-columns: 1fr; }
  .steps--3 { grid-template-columns: 1fr; }
  .wave-divider { height: 34px; background-size: 420px 34px; }
}
.footer-bottom address { font-style: normal; }
.footer-bottom address a { display: inline-block; padding: 6px 0; }

/* ---------- the ink eagle (vector redraw of the mockup sketch) ---------- */
img[src$="eagle.svg"] { aspect-ratio: 664 / 470; height: auto; animation: soar 7s ease-in-out infinite alternate; transform-origin: 50% 60%; filter: drop-shadow(0 10px 8px rgba(60, 40, 15, .16)); }
@keyframes soar { 0% { transform: translate(0, 0) rotate(-3deg); } 50% { transform: translate(6px, -7px) rotate(1deg); } 100% { transform: translate(-5px, 4px) rotate(3deg); } }
.intro-band__art-r .eagle { width: 172px; top: -44px; left: 0; }
.story-row .quote-wrap .eagle { width: 150px; top: -58px; right: -22px; }
.hero img.hero__eagle { position: absolute; z-index: 1; top: 7%; left: 48%; width: clamp(120px, 13vw, 200px); height: auto; pointer-events: none; animation: hero-soar 16s ease-in-out infinite alternate; filter: drop-shadow(0 18px 14px rgba(0, 0, 0, .28)); }
@keyframes hero-soar { 0% { transform: translate(0, 0) rotate(-4deg); } 50% { transform: translate(46px, -14px) rotate(2deg); } 100% { transform: translate(96px, 8px) rotate(5deg); } }

/* ---------- gentle fade-in on scroll (site.js adds .reveal) ---------- */
.reveal { opacity: 0; translate: 0 18px; transition: opacity .6s ease, translate .6s ease; }
.reveal.in { opacity: 1; translate: 0 0; }

@media (max-width: 1020px) {
  .intro-band__art-r .eagle { width: 132px; top: -18px; }
  .hero img.hero__eagle { top: 3%; left: 24%; width: 112px; }
  .story-row .quote-wrap .eagle { width: 104px; right: 0; top: -34px; }
}
@media (prefers-reduced-motion: reduce) {
  img[src$="eagle.svg"], .hero img.hero__eagle { animation: none; }
  .reveal { opacity: 1; translate: none; transition: none; }
}
/* ---------- destinations: at-a-glance table and route guides ---------- */
.glance-wrap { overflow-x: auto; margin-top: 22px; border-radius: 14px; background: var(--paper-light); box-shadow: var(--shadow); }
.glance-wrap:focus-visible { outline: 2px solid var(--rust); outline-offset: 3px; }
table.glance { width: 100%; min-width: 880px; border-collapse: collapse; font-size: 1rem; line-height: 1.3; }
table.glance th, table.glance td { text-align: left; vertical-align: top; padding: 12px 14px; border-top: 1px dashed var(--line); }
table.glance thead th { border-top: 0; background: var(--moss); color: var(--cream); font-family: var(--f-head); font-weight: 600; font-size: .92rem; letter-spacing: .03em; white-space: nowrap; }
table.glance tbody th { position: sticky; left: 0; z-index: 1; background: var(--paper-light); font-family: var(--f-head); font-weight: 600; white-space: nowrap; box-shadow: 1px 0 0 var(--line); }
table.glance tbody th a { color: var(--ink); text-decoration-color: var(--ochre); text-underline-offset: 3px; }
table.glance td small { display: block; margin-top: 2px; font-size: .9rem; color: var(--muted); }
.glance-hint { display: none; margin: 8px 0 0; font-size: .92rem; color: var(--muted); }

.guides { display: grid; gap: 26px; margin-top: 26px; }
.note-card.guide { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 40px; padding: 26px 30px 24px; }
.guide__head { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 18px; }
.guide__head h3 { margin: 0; }
.guide__tag { margin: 0; font-family: var(--f-hand); font-size: 1.4rem; line-height: 1.1; color: var(--rust); }
.nums { grid-column: 1 / -1; list-style: none; margin: 8px 0 10px; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.nums li { padding: 10px 14px; border-radius: 12px; background: var(--paper); font-size: .9rem; line-height: 1.2; color: var(--muted); }
.nums b { display: block; margin-bottom: 2px; font-family: var(--f-head); font-weight: 600; font-size: 1.35rem; color: var(--rust); font-variant-numeric: tabular-nums; }
.guide .kv > div { grid-template-columns: 118px 1fr; }
.guide h4 { margin: 2px 0 8px; font-family: var(--f-head); font-size: 1.15rem; font-weight: 600; color: var(--ink); }
.route-list { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 12px; }
.route-list li { padding-left: 16px; border-left: 2px dashed var(--ochre); }
.route-list b { display: block; font-family: var(--f-head); font-weight: 600; color: var(--ink); line-height: 1.2; }
.route-list .meta { display: block; margin-top: 2px; font-size: .9rem; font-weight: 600; letter-spacing: .02em; color: var(--rust); font-variant-numeric: tabular-nums; }
.route-list p { margin: 3px 0 0; font-size: .98rem; line-height: 1.35; }
.guide .checks { font-size: .98rem; line-height: 1.35; }
.guide > .link-arrow { grid-column: 1 / -1; justify-self: start; margin-top: 4px; }

@media (max-width: 860px) {
  .glance-hint { display: block; }
  .note-card.guide { grid-template-columns: minmax(0, 1fr); padding: 20px 18px; }
  .nums { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .guide .kv > div { grid-template-columns: 1fr; gap: 2px; }
}

.guide--note.note-card { background: transparent; box-shadow: none; border: 1px dashed var(--line); }
.guide--note .nums li { background: var(--paper-light); }
.guide--note p { margin-top: 0; }
/* ---------- destinations: best-months calendar ---------- */
.cal-title { margin: 30px 0 10px; font-size: 1.5rem; font-style: italic; scroll-margin-top: 110px; }
.cal-wrap { max-width: 860px; border-radius: 14px; overflow: hidden; background: var(--paper-light); box-shadow: var(--shadow); }
.cal { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 3px; font-size: .98rem; }
.cal th { padding: 7px 4px; font-weight: 600; text-align: center; color: var(--muted); font-size: .9rem; }
.cal th:first-child { width: 27%; text-align: left; padding-left: 10px; }
.cal tbody th { font-family: var(--f-head); color: var(--ink); font-size: .98rem; line-height: 1.15; }
.cal td { height: 30px; border-radius: 5px; background: var(--paper); }
.cal td.best { background: var(--moss); }
.cal td.good { background: var(--ochre-light); }
.cal-key { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 10px 0 0; font-size: .95rem; color: var(--muted); }
.cal-key span { display: inline-block; width: 18px; height: 14px; margin-left: 10px; border-radius: 3px; background: var(--paper-deep); }
.cal-key span:first-child { margin-left: 0; }
.cal-key .best { background: var(--moss); }
.cal-key .good { background: var(--ochre-light); }
@media (max-width: 560px) {
  .cal { font-size: .86rem; border-spacing: 2px; }
  .cal th { padding: 6px 1px; font-size: .74rem; }
  .cal th:first-child { width: 29%; padding-left: 6px; }
  .cal tbody th { font-size: .84rem; }
  .cal td { height: 26px; }
}

/* ---------- about: review invitation; social icons without a link stay hidden ---------- */
.review-ask::before { content: none; }
.review-ask p { margin: 0 0 12px; }
.review-ask .link-arrow { font-style: normal; font-size: 1.05rem; }
a[data-empty] { display: none; }