:root {
  --bg: #08110d;
  --bg2:#0b1712;
  --panel: rgba(255,255,255,.055);
  --panel-2: rgba(255,255,255,.03);
  --text: #f5efe6;
  --muted: rgba(245,239,230,.74);
  --muted-2: rgba(245,239,230,.55);
  --stroke: rgba(255,255,255,.12);
  --stroke-2: rgba(255,255,255,.18);
  --gold: #d0a14c;
  --gold-2: #f0c15c;
  --blue: #5e9fc9;
  --green: #2a7a58;
  --shadow: 0 22px 70px rgba(0,0,0,.38);
  --shadow-sm: 0 8px 24px rgba(0,0,0,.2);
  --radius-xl: 28px;
  --radius-lg: 20px;
  --radius-md: 14px;
  --max: 1240px;
  --serif: 'Playfair Display', Georgia, serif;
  --sans: 'Raleway', system-ui, sans-serif;
}

[data-theme="light"] {
  --bg: #f7f2ea;
  --bg2:#efe7d6;
  --panel: rgba(255,255,255,.84);
  --panel-2: rgba(255,255,255,.62);
  --text: #102017;
  --muted: rgba(16,32,23,.80);
  --muted-2: rgba(16,32,23,.66);
  --stroke: rgba(16,32,23,.16);
  --stroke-2: rgba(16,32,23,.24);
  --shadow: 0 22px 65px rgba(21,38,26,.12);
  --shadow-sm: 0 8px 20px rgba(21,38,26,.08);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; min-height:100vh; overflow-x:hidden;
  font-family:var(--sans); color:var(--text); background:
    radial-gradient(circle at top left, rgba(208,161,76,.08), transparent 28%),
    radial-gradient(circle at 85% 20%, rgba(94,159,201,.09), transparent 26%),
    linear-gradient(180deg,var(--bg),var(--bg2));
  transition:background .3s ease,color .3s ease;
}
a{color:inherit; text-decoration:none}
img{display:block; max-width:100%}
button,input,select,textarea{font:inherit}
button{cursor:pointer; background:none; border:0}

.grain,.dots{pointer-events:none; position:fixed; inset:0; z-index:0}
.grain{opacity:.05; mix-blend-mode:overlay; background-image: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='.7' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");}
.dots{opacity:.03; background-image:radial-gradient(circle, var(--gold) 1px, transparent 1px); background-size:42px 42px;}

.nav{
  position:fixed; inset:0 0 auto 0; z-index:100;
  backdrop-filter: blur(22px) saturate(1.35);
  background:rgba(8,17,13,.83); border-bottom:1px solid var(--stroke);
}
[data-theme="light"] .nav{background:rgba(247,242,234,.9)}
.nav-inner,.wrap{max-width:var(--max); margin:0 auto; padding:0 28px}
.nav-inner{min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:20px}
.logo{display:flex; align-items:center; gap:14px; color:inherit}
.logo-mark{
  width:46px;height:46px;border-radius:14px; flex:none; display:grid; place-items:center;
  background:linear-gradient(145deg,#17311f,#0f2116); border:1px solid rgba(208,161,76,.28);
  box-shadow:0 6px 18px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.04);
}
.logo-mark svg{width:26px;height:26px}
.logo-text strong{display:block; font-family:var(--serif); font-size:16px; line-height:1.05}
.logo-text span{display:block; font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted-2); margin-top:3px}
.nav-menu{display:flex; align-items:center; gap:3px; flex-wrap:wrap}
.nav-link{
  position:relative; padding:9px 13px; border-radius:10px; font-size:13px; font-weight:700; color:var(--muted);
}
.nav-link:hover,.nav-link.active{color:var(--text); background:var(--panel)}
.nav-link.active::after{content:''; position:absolute; left:13px; right:13px; bottom:3px; height:2px; border-radius:999px; background:linear-gradient(90deg,var(--gold),var(--gold-2))}
.nav-right{display:flex; align-items:center; gap:8px}
.lang-sw{display:flex; gap:2px; padding:3px; border-radius:12px; border:1px solid var(--stroke); background:var(--panel-2)}
.lang-btn{padding:5px 11px; border-radius:8px; font-size:11px; font-weight:800; letter-spacing:.05em; color:var(--muted-2)}
.lang-btn.active{background:linear-gradient(135deg, rgba(208,161,76,.38), rgba(94,159,201,.24)); color:var(--text)}
.nav-btn{width:38px;height:38px;border-radius:12px;border:1px solid var(--stroke);background:var(--panel);color:var(--muted);display:grid;place-items:center;transition:.18s ease}
.nav-btn:hover{transform:translateY(-1px); color:var(--text); border-color:var(--stroke-2)}
.nav-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.burger{display:none; flex-direction:column; gap:5px; padding:8px}
.burger span{width:20px;height:2px;border-radius:2px;background:var(--muted);transition:.2s ease}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{display:none; position:fixed; inset:72px 0 0; z-index:99; background:rgba(8,17,13,.97); backdrop-filter:blur(18px); padding:20px; flex-direction:column; gap:6px}
[data-theme="light"] .mobile-menu{background:rgba(247,242,234,.97)}
.mobile-menu.open{display:flex}
.mobile-link{padding:14px 16px; border-radius:14px; border:1px solid transparent; font-size:16px; font-weight:700; color:var(--muted)}
.mobile-link:hover,.mobile-link.active{color:var(--gold-2); border-color:rgba(208,161,76,.22); background:rgba(208,161,76,.08)}

.page{display:none; position:relative; z-index:1; padding-top:72px}
.page.active{display:block}
.section{padding:72px 0}
.section-head{margin-bottom:34px}
.section-kicker{display:inline-flex; align-items:center; gap:8px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); font-weight:800; margin-bottom:12px}
.section-kicker::before{content:''; width:24px; height:2px; border-radius:99px; background:var(--gold)}
.section-title{margin:0 0 12px; font-family:var(--serif); font-size:clamp(30px,4vw,52px); line-height:1.06; letter-spacing:-.02em}
.section-sub{margin:0; max-width:760px; color:var(--muted); line-height:1.75; font-size:16px}

.hero{position:relative; min-height:calc(100vh - 72px); display:flex; align-items:center; overflow:hidden}
.hero-media,.hero-media img,.hero-overlay,.hero-wave{position:absolute; inset:0}
.hero-media img{width:100%;height:100%;object-fit:cover;filter:brightness(.46) saturate(.92)}
[data-theme="light"] .hero-media img{filter:brightness(.6) saturate(.88)}
.hero-overlay{background:linear-gradient(180deg, rgba(8,17,13,.12), rgba(8,17,13,.68) 75%, var(--bg) 100%), linear-gradient(90deg, rgba(8,17,13,.72), transparent 60%)}
[data-theme="light"] .hero-overlay{background:linear-gradient(180deg, rgba(247,242,234,.04), rgba(247,242,234,.5) 78%, var(--bg) 100%), linear-gradient(90deg, rgba(21,38,26,.5), transparent 60%)}
.hero-wave{top:auto; bottom:-1px; height:90px}
.hero-wave svg{display:block; width:100%; height:100%}
.hero-content{position:relative; z-index:2; padding:36px 0; max-width:760px}
.badge{display:inline-flex; align-items:center; gap:8px; padding:7px 14px; border-radius:999px; border:1px solid rgba(208,161,76,.32); background:rgba(208,161,76,.1); color:var(--gold-2); font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; margin-bottom:18px}
.badge svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hero h1{margin:0 0 18px; font-family:var(--serif); font-size:clamp(44px,8vw,92px); line-height:.94; letter-spacing:-.03em}
.hero h1 em{font-style:italic; color:var(--gold-2)}
.hero-sub{max-width:600px; color:var(--muted); font-size:17px; line-height:1.8; margin:0 0 30px}
.hero-cta{display:flex; flex-wrap:wrap; gap:12px}
.btn-primary,.btn-ghost,.chip-btn{display:inline-flex; align-items:center; gap:9px; border-radius:14px; padding:14px 26px; font-weight:800; font-size:14px; transition:.18s ease}
.btn-primary{color:#fff; background:linear-gradient(135deg,var(--gold),#a96f24); box-shadow:0 12px 30px rgba(208,161,76,.28)}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 16px 34px rgba(208,161,76,.34)}
.btn-ghost{color:var(--text); border:1px solid var(--stroke-2); background:var(--panel)}
.btn-ghost:hover{transform:translateY(-2px); background:rgba(255,255,255,.1)}
.btn-primary svg,.btn-ghost svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hero-stats{display:flex; flex-wrap:wrap; gap:28px; margin-top:38px; padding-top:28px; border-top:1px solid var(--stroke)}
.stat b{display:block; font-family:var(--serif); font-size:30px; color:var(--gold-2); line-height:1}
.stat span{display:block; margin-top:4px; font-size:12px; letter-spacing:.05em; text-transform:uppercase; color:var(--muted-2)}

.grid-4{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px}
.grid-3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px}
.grid-2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px}
.card{border-radius:var(--radius-xl); overflow:hidden; border:1px solid var(--stroke); background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025)); box-shadow:var(--shadow-sm); transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease}
[data-theme="light"] .card{background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.7))}
.card:hover{transform:translateY(-4px); box-shadow:var(--shadow); border-color:var(--stroke-2)}
.card-img{width:100%; height:200px; object-fit:cover}
.card-body{padding:20px 20px 18px}
.card-tag{display:inline-flex; align-items:center; gap:6px; margin-bottom:12px; padding:4px 10px; border-radius:999px; background:rgba(208,161,76,.14); color:var(--gold-2); font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase}
.card-title{margin:0 0 8px; font-family:var(--serif); font-size:20px; line-height:1.22}
.card-text{margin:0; color:var(--muted); line-height:1.7; font-size:14px}
.card-footer{padding:14px 20px 18px; border-top:1px solid var(--stroke); color:var(--muted-2); font-size:12px; display:flex; justify-content:space-between; gap:10px; align-items:center}
.card-footer svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.quicklinks{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:-54px; position:relative; z-index:3}
.ql-card{padding:20px 18px; border-radius:18px; border:1px solid var(--stroke); background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03)); backdrop-filter:blur(16px); cursor:pointer; transition:.2s ease}
[data-theme="light"] .ql-card{background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.74))}
.ql-card:hover{transform:translateY(-3px); border-color:rgba(208,161,76,.3); background:rgba(208,161,76,.08)}
.ql-icon{font-size:28px; line-height:1; margin-bottom:10px}
.ql-title{font-family:var(--serif); font-size:17px; font-weight:700; margin-bottom:6px}
.ql-sub{font-size:12px; color:var(--muted-2); line-height:1.55}

.feature{display:grid; grid-template-columns:1.05fr .95fr; overflow:hidden; border:1px solid var(--stroke); border-radius:var(--radius-xl); background:var(--panel)}
.feature img{width:100%; height:100%; object-fit:cover; min-height:420px}
.feature-body{padding:44px; display:flex; flex-direction:column; justify-content:center; background:linear-gradient(135deg, rgba(208,161,76,.08), rgba(8,17,13,.74))}
[data-theme="light"] .feature-body{background:linear-gradient(135deg, rgba(208,161,76,.08), rgba(247,242,234,.96))}
.feature-body p{margin:0 0 22px; color:var(--muted); line-height:1.8; font-size:15px}
.bullet-list{margin:0 0 26px; padding:0; list-style:none; display:flex; flex-direction:column; gap:10px}
.bullet-list li{display:flex; gap:10px; color:var(--muted); line-height:1.6; font-size:14px}
.bullet-list li::before{content:'🎣'; flex:none}

.lake-hero{position:relative; overflow:hidden; border-radius:var(--radius-xl); margin-bottom:22px; border:1px solid var(--stroke)}
.lake-hero img{width:100%; height:360px; object-fit:cover; filter:brightness(.7)}
.lake-hero .overlay{position:absolute; inset:0; background:linear-gradient(0deg, rgba(8,17,13,.88) 0%, rgba(8,17,13,.08) 55%)}
.lake-copy{position:absolute; left:0; right:0; bottom:0; padding:30px; color:#fff}
.lake-copy h3{margin:0 0 8px; font-family:var(--serif); font-size:38px; line-height:1.08}
.lake-copy p{margin:0; max-width:700px; color:rgba(255,255,255,.76); line-height:1.7}
.facts{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:18px 0 36px}
.fact{padding:16px; border-radius:16px; border:1px solid var(--stroke); background:var(--panel-2); text-align:center}
.fact b{display:block; font-family:var(--serif); font-size:22px; color:var(--gold-2); margin-bottom:4px}
.fact span{font-size:12px; color:var(--muted-2)}

.fish-detail{display:grid; grid-template-columns:1fr 1fr; gap:26px; padding:28px; border-radius:var(--radius-xl); border:1px solid var(--stroke); background:var(--panel-2); margin-bottom:18px}
.fish-detail img{width:100%; height:240px; object-fit:cover; border-radius:18px}
.fish-detail h3{margin:0 0 6px; font-family:var(--serif); font-size:26px}
.fish-detail .latin{margin:0 0 14px; color:var(--muted-2); font-size:13px; font-style:italic}
.fish-detail p{margin:0 0 16px; color:var(--muted); line-height:1.75; font-size:14px}
.specs{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px}
.spec{padding:11px 13px; border-radius:12px; border:1px solid var(--stroke); background:rgba(255,255,255,.03)}
[data-theme="light"] .spec{background:rgba(255,255,255,.7)}
.spec b{display:block; font-size:12px; color:var(--text); margin-bottom:2px}
.spec span{font-size:12px; color:var(--muted-2)}
.fish-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px}
.fish-card{border-radius:20px; overflow:hidden; border:1px solid var(--stroke); background:var(--panel-2); box-shadow:var(--shadow-sm); transition:.2s ease}
.fish-card:hover{transform:translateY(-4px); border-color:rgba(94,159,201,.35); box-shadow:var(--shadow)}
.fish-img{width:100%; height:170px; object-fit:cover}
.fish-body{padding:16px}
.fish-name{margin:0 0 3px; font-family:var(--serif); font-size:18px}
.fish-latin{margin:0 0 10px; font-size:11px; font-style:italic; color:var(--muted-2)}
.fish-tags{display:flex; flex-wrap:wrap; gap:5px}
.fish-tag{padding:3px 8px; border-radius:999px; font-size:11px; font-weight:700; background:rgba(94,159,201,.14); color:#67b0da}
.fish-desc{margin:10px 0 0; color:var(--muted); line-height:1.65; font-size:13px}

.map-panel{border:1px solid var(--stroke); border-radius:var(--radius-xl); overflow:hidden; background:var(--panel)}
.map-panel-head{padding:30px 30px 18px}
.map-shell{padding:0 30px 30px}
.map-legend{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; padding:0 30px 30px}
.map-note{margin:0 30px 30px; padding:14px 16px; border-radius:14px; border:1px solid rgba(208,161,76,.24); background:rgba(208,161,76,.08); color:var(--muted); line-height:1.65; font-size:13px}
.legend-item{padding:12px 14px; border-radius:14px; border:1px solid var(--stroke); background:var(--panel-2); font-size:13px; color:var(--muted); display:flex; align-items:flex-start; gap:10px}
.legend-dot{width:12px;height:12px;border-radius:50%; flex:none; margin-top:4px; background:var(--gold-2)}
.legend-dot.blue{background:var(--blue)}
.legend-dot.green{background:var(--green)}
.legend-dot.red{background:#d96c56}
.map-frame{aspect-ratio:16/9; border-radius:20px; overflow:hidden; border:1px solid var(--stroke)}
.map-frame img{width:100%; height:100%; object-fit:cover; display:block}

.spot-card{display:grid; grid-template-columns:280px 1fr; gap:0; overflow:hidden; border-radius:var(--radius-xl); border:1px solid var(--stroke); background:var(--panel-2); margin-bottom:16px; transition:.2s ease}
.spot-card:hover{transform:translateY(-3px); box-shadow:var(--shadow); border-color:rgba(208,161,76,.28)}
.spot-img{width:100%; height:100%; min-height:210px; object-fit:cover}
.spot-body{padding:24px 26px}
.spot-rank{display:inline-grid; place-items:center; width:34px; height:34px; border-radius:10px; margin-bottom:12px; background:linear-gradient(135deg,var(--gold),#a36a21); color:#fff; font-family:var(--serif); font-size:16px; font-weight:800}
.spot-body h3{margin:0 0 8px; font-family:var(--serif); font-size:22px}
.spot-body p{margin:0 0 14px; color:var(--muted); line-height:1.72; font-size:14px}
.spot-chips{display:flex; flex-wrap:wrap; gap:7px}
.chip{padding:4px 10px; border-radius:999px; border:1px solid var(--stroke); background:rgba(255,255,255,.03); color:var(--muted); font-size:12px; font-weight:700}
.chip.gold{border-color:rgba(208,161,76,.28); background:rgba(208,161,76,.1); color:var(--gold-2)}
.chip.blue{border-color:rgba(94,159,201,.28); background:rgba(94,159,201,.1); color:#7cc1e8}

.gear{display:grid; grid-template-columns:1.05fr .95fr; gap:30px}
.steps{display:flex; flex-direction:column; gap:14px}
.step{display:flex; gap:16px; padding:18px 20px; border:1px solid var(--stroke); border-radius:18px; background:var(--panel-2)}
.step-num{width:34px; flex:none; font-family:var(--serif); font-size:28px; color:rgba(208,161,76,.4); line-height:1}
.step h4{margin:0 0 6px; font-family:var(--serif); font-size:18px}
.step p{margin:0; color:var(--muted); line-height:1.68; font-size:14px}
.sidebar{display:flex; flex-direction:column; gap:14px}
.tip{padding:18px 18px 16px; border-radius:18px; border:1px solid var(--stroke); background:linear-gradient(135deg, rgba(208,161,76,.09), rgba(255,255,255,.02))}
[data-theme="light"] .tip{background:linear-gradient(135deg, rgba(208,161,76,.08), rgba(255,255,255,.78))}
.tip h4{margin:0 0 10px; font-family:var(--serif); font-size:16px; color:var(--gold-2)}
.tip p,.tip li{color:var(--muted); line-height:1.68; font-size:13px}
.tip ul{margin:0; padding-left:18px}
.table-wrap{overflow:auto; border:1px solid var(--stroke); border-radius:18px}
.table{width:100%; border-collapse:collapse; min-width:760px; background:var(--panel-2)}
.table th,.table td{padding:13px 14px; border-bottom:1px solid rgba(255,255,255,.05); text-align:left; vertical-align:top; font-size:14px}
[data-theme="light"] .table th,[data-theme="light"] .table td{border-bottom:1px solid rgba(21,38,26,.08)}
.table th{font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted-2)}
.table td{color:var(--muted)}
.table tr:hover td{background:rgba(255,255,255,.03)}
.table td:first-child{color:var(--text); font-weight:700}

.gal-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px}
.gal-item{position:relative; overflow:hidden; border-radius:18px; border:1px solid var(--stroke); aspect-ratio:4/3; cursor:pointer; background:var(--panel-2)}
.gal-item.big{grid-column:span 2; aspect-ratio:16/9}
.gal-item img{width:100%; height:100%; object-fit:cover; transition:transform .35s ease, filter .2s ease; filter:saturate(.88)}
.gal-item:hover img{transform:scale(1.05); filter:saturate(1.02)}
.gal-overlay{position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,17,13,0), rgba(8,17,13,.56)); display:flex; align-items:flex-end; padding:14px; opacity:0; transition:.2s ease}
.gal-item:hover .gal-overlay{opacity:1}
.gal-overlay span{color:#fff; font-size:13px; font-weight:700}
.lightbox{position:fixed; inset:0; z-index:500; display:none; align-items:center; justify-content:center; padding:18px; background:rgba(0,0,0,.9); backdrop-filter:blur(12px)}
.lightbox.open{display:flex}
.lightbox img{max-width:92vw; max-height:88vh; border-radius:18px; border:1px solid rgba(255,255,255,.12)}
.lb-close{position:fixed; top:18px; right:18px; width:44px; height:44px; border-radius:14px; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.08); color:#fff; display:grid; place-items:center}
.lb-close svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}

.footer{padding:50px 0 30px; border-top:1px solid var(--stroke); margin-top:38px}
.footer-inner{display:grid; grid-template-columns:1.7fr 1fr 1fr 1fr; gap:28px; margin-bottom:34px}
.footer-brand p{margin:12px 0 0; max-width:320px; color:var(--muted); line-height:1.7; font-size:13px}
.footer-col h5{margin:0 0 14px; font-family:var(--serif); font-size:15px}
.footer-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px}
.footer-col a{font-size:13px; color:var(--muted-2)}
.footer-col a:hover{color:var(--gold-2)}
.footer-bottom{padding-top:20px; border-top:1px solid var(--stroke); display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; color:var(--muted-2); font-size:12px}
.footer-bottom a{color:var(--gold-2)}

.reveal{opacity:0; transform:translateY(18px); transition:opacity .55s ease, transform .55s ease}
.reveal.show{opacity:1; transform:none}

@media (max-width:1100px){
  .grid-4,.quicklinks,.facts,.map-legend,.footer-inner{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fish-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:860px){
  .nav-menu{display:none}
  .burger{display:flex}
  .feature,.gear,.fish-detail,.spot-card{grid-template-columns:1fr}
  .fish-grid,.grid-3,.grid-4,.gal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gal-item.big{grid-column:span 2}
  .hero{min-height:680px}
  .hero-content{padding:26px 0 40px}
  .hero-stats{gap:18px}
  .card-img{height:180px}
  .lake-copy h3{font-size:32px}
}
@media (max-width:640px){
  .nav-inner,.wrap{padding:0 16px}
  .section{padding:58px 0}
  .hero h1{font-size:clamp(38px,12vw,62px)}
  .hero-sub{font-size:16px}
  .quicklinks{grid-template-columns:1fr 1fr; margin-top:16px}
  .fish-grid,.grid-3,.grid-4,.gal-grid,.facts,.map-legend,.footer-inner{grid-template-columns:1fr}
  .map-panel-head,.map-shell,.map-legend,.map-note{padding-left:16px;padding-right:16px}
  .map-note{margin-left:16px;margin-right:16px}
  .lake-copy{padding:22px}
  .lake-copy h3{font-size:28px}
  .spot-body,.feature-body{padding:22px}
  .footer-bottom{padding-top:18px}
}


/* === Added visuals and contrast fixes === */
.section-sub, .card-text, .fish-desc, .spot-body p, .step p, .tip p, .tip li, .map-note, .legend-item {
  text-shadow: 0 1px 0 rgba(255,255,255,.02);
}

.map-svg-frame{
  border-radius:20px;
  overflow:hidden;
  border:1px solid var(--stroke);
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
}
.map-svg-frame svg{display:block;width:100%;height:auto}
.map-svg-frame a{cursor:pointer}
.map-svg-frame .pin{transition:transform .18s ease, opacity .18s ease}
.map-svg-frame a:hover .pin{transform:translateY(-3px)}
.map-svg-frame text{paint-order:stroke fill; stroke:rgba(255,255,255,.45); stroke-width:2px; stroke-linejoin:round}

.legend-item{
  display:flex; align-items:center; gap:10px;
  padding:12px 14px; border-radius:14px;
  border:1px solid var(--stroke); background:var(--panel-2);
  color:var(--muted); font-size:13px; line-height:1.5;
}
.legend-dot{
  width:10px; height:10px; border-radius:999px; flex:none;
  background:var(--gold-2); box-shadow:0 0 0 4px rgba(208,161,76,.12);
}
.legend-dot.red{background:#d52b1e; box-shadow:0 0 0 4px rgba(213,43,30,.10)}
.legend-dot.blue{background:#2e84d6; box-shadow:0 0 0 4px rgba(46,132,214,.10)}
.legend-dot.green{background:#2f8f5b; box-shadow:0 0 0 4px rgba(47,143,91,.10)}

.spot-card{scroll-margin-top:90px}
.spot-card:target{
  border-color:rgba(208,161,76,.45);
  box-shadow:0 0 0 1px rgba(208,161,76,.2), var(--shadow);
}

.steps{display:flex;flex-direction:column;gap:14px}
.step{
  display:grid;
  grid-template-columns:48px 102px 1fr;
  gap:16px;
  align-items:center;
}
.step-num{align-self:start;padding-top:8px}
.step-visual{
  width:102px;height:102px; border-radius:18px;
  border:1px solid var(--stroke);
  background:linear-gradient(135deg, rgba(208,161,76,.06), rgba(94,159,201,.06));
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; flex:none;
}
.step-visual img{width:100%;height:100%;object-fit:contain;padding:12px}
.step-body h4{margin:0 0 8px; font-family:var(--serif); font-size:18px}
.step-body p{margin:0; color:var(--muted); line-height:1.72; font-size:14px}

@media(max-width:860px){
  .step{grid-template-columns:48px 88px 1fr}
  .step-visual{width:88px;height:88px}
}
@media(max-width:600px){
  .step{grid-template-columns:1fr}
  .step-num{padding-top:0}
  .step-visual{width:100%;height:120px}
}

/* Gear step aliases for new markup */
.gear-step{display:grid;grid-template-columns:48px 102px 1fr;gap:16px;align-items:center;padding:18px 20px;border:1px solid var(--stroke);border-radius:18px;background:var(--panel-2)}
.gear-step .step-num{align-self:start;padding-top:8px;width:auto}
.gear-step .step-visual{width:102px;height:102px;border-radius:18px;border:1px solid var(--stroke);background:linear-gradient(135deg, rgba(208,161,76,.06), rgba(94,159,201,.06));display:flex;align-items:center;justify-content:center;overflow:hidden;flex:none}
.gear-step .step-visual img{width:100%;height:100%;object-fit:contain;padding:12px}
.gear-step .step-body h4{margin:0 0 8px;font-family:var(--serif);font-size:18px}
.gear-step .step-body p{margin:0;color:var(--muted);line-height:1.72;font-size:14px}
@media(max-width:860px){
  .gear-step{grid-template-columns:48px 88px 1fr}
  .gear-step .step-visual{width:88px;height:88px}
}
@media(max-width:600px){
  .gear-step{grid-template-columns:1fr}
  .gear-step .step-num{padding-top:0}
  .gear-step .step-visual{width:100%;height:120px}
}

.map-svg-frame svg text{paint-order:stroke fill}