.map-hero{background:#f4e8d0;padding:2.5rem 0 3rem;border-bottom:3px double #8b6914;position:relative}
.sea-beast{position:absolute;font-size:3rem;opacity:.12;pointer-events:none;color:#2c1810}
.sea-beast.left{left:2%;bottom:15%;transform:rotate(-15deg)}
.sea-beast.right{right:3%;top:20%;transform:rotate(10deg) scaleX(-1)}

.map-hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:2rem;align-items:center;position:relative;z-index:1}
@media(max-width:860px){.map-hero-grid{grid-template-columns:1fr}}

.coord-box{position:absolute;top:0;right:0;font-family:"Courier New",monospace;font-size:.68rem;color:#6b5040;border:1px solid #c4a870;padding:.35rem .55rem;background:#faf0dc;line-height:1.5}
@media(max-width:860px){.coord-box{position:static;margin-bottom:1rem;display:inline-block}}

.wind-rose{width:64px;height:64px;border:2px solid #8b6914;border-radius:50%;position:relative;margin-bottom:1rem;background:#faf0dc}
.wind-rose::before,.wind-rose::after{content:"";position:absolute;background:#8b4513}
.wind-rose::before{width:2px;height:70%;left:50%;top:15%;transform:translateX(-50%)}
.wind-rose::after{width:70%;height:2px;top:50%;left:15%;transform:translateY(-50%)}
.wind-rose span{position:absolute;font-size:.55rem;color:#8b4513;font-weight:800;font-family:"Courier New",monospace}
.wind-rose .n{top:2px;left:50%;transform:translateX(-50%)}
.wind-rose .s{bottom:2px;left:50%;transform:translateX(-50%)}
.wind-rose .e{right:2px;top:50%;transform:translateY(-50%)}
.wind-rose .w{left:2px;top:50%;transform:translateY(-50%)}

.map-hero h1{font-size:clamp(1.3rem,3.5vw,1.8rem);color:#2c1810;line-height:1.35;margin-bottom:.75rem;font-family:Georgia,serif}
.map-hero h1 em{color:#8b4513;font-style:normal}
.map-desc{color:#5a4030;font-size:.92rem;margin-bottom:1.2rem;max-width:520px}
.map-btns{display:flex;flex-wrap:wrap;gap:.65rem;margin-bottom:1.5rem}

.chart-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem}
.chart-stats .cs{background:#faf0dc;border:2px solid #c4a870;padding:.75rem;text-align:center}
.chart-stats strong{display:block;font-size:1.25rem;color:#8b4513;font-family:Georgia,serif}
.chart-stats span{font-size:.7rem;color:#6b5040}

.map-frame{border:3px double #8b6914;padding:10px;background:#faf0dc;position:relative}
.map-frame::after{content:"";position:absolute;inset:6px;border:1px solid #c4a870;pointer-events:none}
.map-frame img{width:100%;position:relative;z-index:1}
.map-caption{text-align:center;font-size:.72rem;color:#6b5040;margin-top:.55rem;font-family:"Courier New",monospace;letter-spacing:.08em}

.legend-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
@media(max-width:768px){.legend-cards{grid-template-columns:1fr}}
.legend-card{padding:1.1rem;position:relative}
.legend-card .beast{font-size:1.6rem;margin-bottom:.45rem;opacity:.85}
.legend-card .sym{font-family:"Courier New",monospace;font-size:.65rem;color:#8b6914;font-weight:700;margin-bottom:.4rem}
.legend-card h3{font-size:.95rem;color:#2c1810;margin-bottom:.4rem;font-family:Georgia,serif}
.legend-card p{font-size:.82rem;color:#6b5040;line-height:1.55}

.voyage-route{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;counter-reset:voyage}
@media(max-width:768px){.voyage-route{grid-template-columns:1fr}}
.voyage-leg{text-align:center;padding:1rem .75rem;position:relative}
.voyage-leg::after{content:"→";position:absolute;right:-.6rem;top:50%;transform:translateY(-50%);color:#8b6914;font-size:1.2rem}
.voyage-leg:last-child::after{display:none}
@media(max-width:768px){.voyage-leg::after{display:none}}
.voyage-leg .leg-coord{font-family:"Courier New",monospace;font-size:.68rem;color:#8b6914;margin-bottom:.5rem}
.voyage-leg h3{font-size:.92rem;color:#2c1810;margin-bottom:.35rem;font-family:Georgia,serif}
.voyage-leg p{font-size:.8rem;color:#6b5040;line-height:1.5}

.chart-dual{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
@media(max-width:768px){.chart-dual{grid-template-columns:1fr}}
.chart-pane{padding:0;overflow:hidden}
.chart-pane .pane-head{background:#2c1810;color:#d4a853;padding:.55rem 1rem;font-size:.75rem;font-weight:800;letter-spacing:.06em;font-family:"Courier New",monospace}
.chart-pane .pane-body{padding:1rem 1.1rem}
.chart-pane h3{font-size:.92rem;color:#2c1810;margin-bottom:.55rem;font-family:Georgia,serif}
.chart-pane li{font-size:.82rem;color:#6b5040;padding:.28rem 0 .28rem 1rem;position:relative}
.chart-pane li::before{content:"✦";position:absolute;left:0;color:#8b6914;font-size:.55rem;top:.4rem}

.section-parch{background:#ede0c8}
.hero-img-wrap{margin-top:1.5rem;max-width:640px}
.hero-img-wrap .map-frame{padding:8px}

.map-cta{background:#2c1810;padding:2.5rem 0;text-align:center;border-top:3px double #8b6914}
.map-cta h2{font-size:clamp(1.1rem,3vw,1.45rem);color:#d4a853;margin-bottom:.45rem;font-family:Georgia,serif}
.map-cta p{color:#a89070;font-size:.88rem;margin-bottom:1.1rem}