:root {
  --ink: #0b1713;
  --forest: #102a20;
  --forest-2: #18392c;
  --moss: #5d754d;
  --heather: #8b6d86;
  --gold: #d6b66b;
  --sand: #e8dfcf;
  --mist: #f3f1eb;
  --white: #fff;
  --muted: #657168;
  --line: rgba(16, 42, 32, .14);
  --shadow: 0 20px 60px rgba(8, 22, 17, .14);
  --radius: 26px;
  --max: 1220px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--mist);
  line-height: 1.6;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input { font: inherit; }

.container { width: min(var(--max), calc(100% - 42px)); margin: 0 auto; }
.eyebrow { text-transform: uppercase; letter-spacing: .18em; font-size: .75rem; font-weight: 800; color: var(--gold); }
.kicker { text-transform: uppercase; letter-spacing: .16em; font-size: .73rem; font-weight: 800; color: var(--moss); }
.display { font-family: Georgia, "Times New Roman", serif; font-weight: 500; letter-spacing: -.035em; line-height: .98; }

.site-header {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  transition: .3s ease;
  color: #fff;
}
.site-header.scrolled { background: rgba(11,23,19,.9); backdrop-filter: blur(18px); box-shadow: 0 8px 28px rgba(0,0,0,.16); }
.nav { min-height: 86px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:12px; font-weight:800; letter-spacing:.02em; }
.brand-mark { width:43px; height:43px; border:1px solid rgba(255,255,255,.55); border-radius:50%; display:grid; place-items:center; font-family:Georgia,serif; color:var(--gold); position:relative; }
.brand-mark::after { content:""; position:absolute; width:24px; height:1px; background:rgba(255,255,255,.55); transform:rotate(-42deg); }
.brand-copy { line-height:1.05; font-size:.9rem; }
.brand-copy span { display:block; font-weight:500; opacity:.78; font-size:.68rem; text-transform:uppercase; letter-spacing:.18em; margin-top:3px; }
.nav-links { display:flex; align-items:center; gap:28px; font-size:.88rem; font-weight:700; }
.nav-links a { opacity:.86; }
.nav-links a:hover { opacity:1; color:var(--gold); }
.nav-cta { border:1px solid rgba(255,255,255,.45); padding:11px 17px; border-radius:999px; }
.menu-toggle { display:none; border:0; background:transparent; color:#fff; font-size:1.5rem; }

.hero {
  min-height: 100vh;
  color:#fff;
  background:
    linear-gradient(90deg, rgba(8,17,15,.72) 0%, rgba(8,17,15,.46) 42%, rgba(8,17,15,.28) 100%),
    linear-gradient(180deg, rgba(4,10,8,.32) 0%, rgba(4,10,8,.10) 24%, rgba(4,10,8,.52) 100%),
    url('hero-sunset.png') center center / cover no-repeat;
  overflow:hidden; position:relative; display:flex; align-items:flex-end;
}
.hero::before, .course-hero::before {
  content:""; position:absolute; inset:0;
  background-image:
    radial-gradient(circle at 78% 26%, rgba(255,255,255,.08) 0 72px, transparent 73px),
    radial-gradient(circle at 80% 26%, rgba(255,255,255,.05) 0 132px, transparent 133px),
    linear-gradient(180deg, rgba(255,255,255,.05), transparent 28%);
}
.hero-mountains { display:none; }
.hero-mountains .ridge-1, .hero-mountains .ridge-2 { display:none; }
.hero-content { position:relative; z-index:3; padding:170px 0 82px; width:min(930px,100%); }
.hero-content .eyebrow, .hero h1, .hero p { text-shadow:0 2px 14px rgba(0,0,0,.34); }
.hero h1 { font-size:clamp(3.8rem, 9vw, 8.2rem); margin:14px 0 24px; }
.hero p { font-size:clamp(1.05rem,2vw,1.35rem); max-width:700px; color:rgba(255,255,255,.84); margin:0 0 32px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:13px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:14px 20px; border-radius:999px; font-weight:800; font-size:.9rem; border:1px solid transparent; transition:.2s ease; }
.btn-primary { background:var(--gold); color:#172016; }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 12px 28px rgba(0,0,0,.2); }
.btn-ghost { border-color:rgba(255,255,255,.4); color:#fff; backdrop-filter:blur(8px); }
.btn-dark { background:var(--forest); color:#fff; }
.hero-badge { position:absolute; right:5vw; bottom:70px; z-index:3; width:150px; height:150px; border:1px solid rgba(255,255,255,.34); border-radius:50%; display:grid; place-items:center; text-align:center; font-size:.72rem; text-transform:uppercase; letter-spacing:.14em; color:rgba(255,255,255,.78); transform:rotate(8deg); }
.hero-badge strong { display:block; color:var(--gold); font-family:Georgia,serif; font-size:2.2rem; letter-spacing:0; line-height:1; text-transform:none; }

.stats-strip { background:var(--forest); color:#fff; }
.stats { display:grid; grid-template-columns:repeat(3,1fr); }
.stat { padding:25px 28px; border-right:1px solid rgba(255,255,255,.11); }
.stat:last-child { border:0; }
.stat strong { display:block; font-family:Georgia,serif; font-size:1.7rem; color:var(--gold); font-weight:500; }
.stat span { font-size:.83rem; color:rgba(255,255,255,.68); text-transform:uppercase; letter-spacing:.1em; }

.section { padding:104px 0; }
.section-sm { padding:70px 0; }
.section-head { display:flex; justify-content:space-between; gap:40px; align-items:end; margin-bottom:48px; }
.section-head h2 { font-size:clamp(2.5rem,5vw,5rem); margin:8px 0 0; max-width:780px; }
.section-head p { max-width:470px; color:var(--muted); margin:0; }

.intro-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:72px; align-items:center; }
.intro-copy h2 { font-size:clamp(2.7rem,5.8vw,5.7rem); margin:10px 0 26px; }
.intro-copy p { color:#4f5e54; font-size:1.06rem; }
.landscape-card { min-height:520px; border-radius:var(--radius); background:
  radial-gradient(circle at 65% 25%, rgba(255,255,255,.34), transparent 18%),
  linear-gradient(180deg, transparent 0 45%, rgba(8,28,20,.82) 88%),
  linear-gradient(135deg,#8d9a82,#59715f 44%,#223d31 100%);
  position:relative; overflow:hidden; box-shadow:var(--shadow); }
.landscape-card::before { content:""; position:absolute; inset:35% -10% -10%; background:#314b3d; clip-path:polygon(0 68%,10% 48%,24% 60%,37% 29%,50% 58%,62% 34%,76% 57%,88% 41%,100% 63%,100% 100%,0 100%); }
.landscape-card::after { content:"From Speyside to the Far North"; position:absolute; left:34px; bottom:32px; color:#fff; font-family:Georgia,serif; font-size:2rem; max-width:320px; line-height:1.05; }

.trail-panel { background:#0e261d; color:#fff; overflow:hidden; position:relative; }
.trail-panel::before { content:""; position:absolute; inset:0; background:repeating-linear-gradient(35deg,transparent 0 56px,rgba(255,255,255,.018) 57px 58px); }
.trail-grid { position:relative; display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; align-items:start; }
.trail-grid h2 { font-size:clamp(3rem,6vw,6rem); margin:10px 0 22px; }
.trail-grid p { color:rgba(255,255,255,.68); }
.route { position:relative; padding:6px 0; }
.route::before { content:""; position:absolute; left:19px; top:20px; bottom:20px; width:1px; background:linear-gradient(var(--gold), rgba(214,182,107,.14)); }
.route-item { display:grid; grid-template-columns:40px 1fr auto; gap:18px; align-items:center; padding:12px 0; position:relative; }
.route-dot { width:39px; height:39px; border-radius:50%; border:1px solid rgba(214,182,107,.55); background:#102c21; display:grid; place-items:center; color:var(--gold); font-size:.72rem; font-weight:800; z-index:2; }
.route-item strong { display:block; font-family:Georgia,serif; font-size:1.2rem; font-weight:500; }
.route-item span { color:rgba(255,255,255,.55); font-size:.78rem; text-transform:uppercase; letter-spacing:.09em; }
.route-item a { font-size:.8rem; font-weight:800; color:var(--gold); }

.course-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.course-card { min-height:420px; border-radius:22px; overflow:hidden; position:relative; color:#fff; box-shadow:0 14px 36px rgba(18,42,32,.11); isolation:isolate; }
.course-card::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 14%,rgba(6,17,13,.15) 40%,rgba(6,17,13,.92) 100%); z-index:1; }
.course-card::after { content:""; position:absolute; inset:0; background:repeating-radial-gradient(ellipse at 73% 48%,transparent 0 19px,rgba(255,255,255,.055) 20px 21px,transparent 22px 42px); z-index:0; }
.course-art { position:absolute; inset:0; z-index:-1; transition:transform .45s ease; }
.course-card:hover .course-art { transform:scale(1.04); }
.course-card-content { position:absolute; inset:auto 24px 24px; z-index:2; }
.course-card .meta { font-size:.68rem; text-transform:uppercase; letter-spacing:.15em; color:var(--gold); font-weight:800; }
.course-card h3 { font-family:Georgia,serif; font-size:2rem; margin:7px 0 11px; line-height:1; font-weight:500; }
.course-card p { font-size:.88rem; color:rgba(255,255,255,.72); margin:0 0 13px; }
.course-card .arrow { font-size:.82rem; font-weight:800; }
.art-spey { background:linear-gradient(135deg,#9ca98e,#526d59 48%,#263e32); }
.art-boat { background:linear-gradient(135deg,#8a9b78,#506d50 46%,#243829); }
.art-newtonmore { background:linear-gradient(135deg,#839b94,#58776a 42%,#263e36); }
.art-nairn { background:linear-gradient(135deg,#a9b7ad,#6f8e88 42%,#315c56); }
.art-muir { background:linear-gradient(135deg,#a28b71,#687555 44%,#354638); }
.art-golspie { background:linear-gradient(135deg,#c6b890,#72866b 42%,#3f6153); }
.art-brora { background:linear-gradient(135deg,#c1b28c,#657b68 43%,#27433b); }
.art-reay { background:linear-gradient(135deg,#8e9999,#5d746f 42%,#263c3b); }
.art-fortrose { background:linear-gradient(135deg,#b8b69d,#657f76 46%,#254740); }

.braid { background:#e7dfcf; }
.braid-grid { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
.braid-portrait { aspect-ratio:4/5; border-radius:var(--radius); background:
  radial-gradient(circle at 50% 26%, rgba(236,221,190,.7) 0 8%, transparent 8.4%),
  radial-gradient(ellipse at 50% 38%, #493e33 0 11%, transparent 11.5%),
  radial-gradient(ellipse at 50% 65%, #6e6458 0 27%, transparent 27.5%),
  linear-gradient(145deg,#877d6e,#312f2b); box-shadow:var(--shadow); position:relative; overflow:hidden; filter:sepia(.25); }
.braid-portrait::after { content:"JAMES BRAID\A 1870—1950"; white-space:pre; position:absolute; left:28px; bottom:26px; color:#fff; font-family:Georgia,serif; font-size:1.4rem; line-height:1.2; letter-spacing:.03em; }
.braid-copy h2 { font-size:clamp(3rem,5.5vw,5.5rem); margin:10px 0 24px; }
.braid-copy p { color:#4e5c52; }
.quote { border-left:2px solid var(--gold); padding-left:22px; margin:28px 0; font-family:Georgia,serif; font-size:1.4rem; line-height:1.35; color:#29362f; }

.cta-band { padding:88px 0; background:linear-gradient(135deg,#132c22,#2d4939); color:#fff; }
.cta-inner { display:flex; align-items:center; justify-content:space-between; gap:40px; }
.cta-inner h2 { font-size:clamp(2.6rem,5vw,5rem); margin:8px 0 0; }
.cta-inner p { color:rgba(255,255,255,.65); max-width:620px; }

.site-footer { background:#081812; color:#fff; padding:58px 0 30px; }
.footer-grid { display:grid; grid-template-columns:1.3fr .7fr .7fr; gap:50px; padding-bottom:42px; border-bottom:1px solid rgba(255,255,255,.1); }
.footer-grid p { color:rgba(255,255,255,.58); max-width:480px; }
.footer-nav h4 { font-size:.73rem; text-transform:uppercase; letter-spacing:.15em; color:var(--gold); margin:0 0 13px; }
.footer-nav a { display:block; color:rgba(255,255,255,.67); margin:7px 0; font-size:.9rem; }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; padding-top:24px; color:rgba(255,255,255,.42); font-size:.78rem; }

/* Course pages */
.course-hero { min-height:78vh; color:#fff; position:relative; display:flex; align-items:flex-end; overflow:hidden; background:linear-gradient(135deg,#547060,#173428); }
.course-hero::after { content:""; position:absolute; inset:35% -7% -20%; background:rgba(12,37,28,.72); clip-path:polygon(0 70%,11% 50%,23% 63%,35% 39%,46% 62%,61% 44%,74% 65%,86% 47%,100% 64%,100% 100%,0 100%); }
.course-hero .container { position:relative; z-index:3; }
.course-hero-content { padding:170px 0 64px; max-width:920px; }
.course-hero h1 { font-size:clamp(3.5rem,8vw,7.5rem); margin:11px 0 20px; }
.course-hero p { max-width:700px; font-size:1.16rem; color:rgba(255,255,255,.76); }
.course-hero .course-number { position:absolute; right:3vw; bottom:28px; z-index:3; font-family:Georgia,serif; font-size:9rem; line-height:1; color:rgba(255,255,255,.08); }
.hero-spey { background:linear-gradient(135deg,#809176,#345343 48%,#122a20); }
.hero-boat { background:linear-gradient(135deg,#7f9472,#3b5a40 48%,#10291d); }
.hero-newtonmore { background:linear-gradient(135deg,#7f9590,#3f6359 48%,#132f29); }
.hero-nairn { background:linear-gradient(135deg,#9caaa5,#4f7773 48%,#183f3c); }
.hero-muir { background:linear-gradient(135deg,#9a8870,#586a4b 48%,#273d31); }
.hero-golspie { background:linear-gradient(135deg,#b6a986,#5d806c 48%,#244b40); }
.hero-brora { background:linear-gradient(135deg,#a99e82,#4f6f60 48%,#183c33); }
.hero-reay { background:linear-gradient(135deg,#7f8e90,#506e69 48%,#1a3a39); }
.hero-fortrose { background:linear-gradient(135deg,#aaa993,#55766d 48%,#153d37); }

.course-layout { display:grid; grid-template-columns:1.25fr .75fr; gap:72px; align-items:start; }
.course-main h2 { font-size:clamp(2.7rem,5vw,4.8rem); margin:8px 0 25px; }
.course-main p { color:#4f5f55; font-size:1.04rem; }
.course-side { position:sticky; top:112px; background:#fff; border-radius:22px; padding:28px; box-shadow:var(--shadow); }
.fact { padding:14px 0; border-bottom:1px solid var(--line); }
.fact:last-child { border-bottom:0; }
.fact span { display:block; color:var(--muted); font-size:.7rem; text-transform:uppercase; letter-spacing:.12em; font-weight:800; }
.fact strong { display:block; margin-top:4px; font-family:Georgia,serif; font-size:1.12rem; font-weight:500; }
.story-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:38px; }
.story-card { background:#fff; border-radius:20px; padding:25px; border:1px solid rgba(16,42,32,.08); }
.story-card .num { font-family:Georgia,serif; color:var(--gold); font-size:2rem; }
.story-card h3 { margin:7px 0 8px; font-size:1rem; }
.story-card p { margin:0; font-size:.88rem; }
.next-course { display:grid; grid-template-columns:1fr 1fr; }
.next-course a { padding:44px; min-height:190px; background:#112d22; color:#fff; display:flex; flex-direction:column; justify-content:center; }
.next-course a:last-child { background:#173b2d; text-align:right; align-items:flex-end; }
.next-course span { font-size:.7rem; text-transform:uppercase; letter-spacing:.15em; color:var(--gold); }
.next-course strong { font-family:Georgia,serif; font-size:1.8rem; font-weight:500; margin-top:6px; }

.reveal { opacity:0; transform:translateY(20px); transition:.7s ease; }
.reveal.visible { opacity:1; transform:none; }

@media (max-width: 980px) {
  .menu-toggle { display:block; }
  .nav-links { position:fixed; left:20px; right:20px; top:76px; display:none; flex-direction:column; align-items:stretch; padding:20px; border-radius:18px; background:#0d241b; box-shadow:var(--shadow); }
  .nav-links.open { display:flex; }
  .hero-badge { display:none; }
  .intro-grid, .trail-grid, .braid-grid, .course-layout { grid-template-columns:1fr; }
  .course-side { position:static; }
  .course-grid { grid-template-columns:repeat(2,1fr); }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .footer-grid > :first-child { grid-column:1/-1; }
  .section-head, .cta-inner { align-items:flex-start; flex-direction:column; }
}

@media (max-width: 680px) {
  .container { width:min(100% - 28px, var(--max)); }
  .nav { min-height:72px; }
  .brand-copy { font-size:.78rem; }
  .hero-content { padding:138px 0 58px; }
  .hero { min-height:88vh; }
  .stats { grid-template-columns:1fr; }
  .stat { border-right:0; border-bottom:1px solid rgba(255,255,255,.1); padding:19px 0; }
  .section { padding:76px 0; }
  .section-sm { padding:54px 0; }
  .course-grid, .story-grid { grid-template-columns:1fr; }
  .course-card { min-height:380px; }
  .route-item { grid-template-columns:40px 1fr; }
  .route-item a { grid-column:2; margin-top:-10px; }
  .landscape-card { min-height:390px; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-grid > :first-child { grid-column:auto; }
  .footer-bottom { flex-direction:column; }
  .next-course { grid-template-columns:1fr; }
  .next-course a:last-child { text-align:left; align-items:flex-start; }
  .course-hero { min-height:68vh; }
  .course-hero-content { padding:130px 0 45px; }
  .course-hero .course-number { font-size:6rem; }
}