:root{--ink:#16384b;--muted:#61737b;--sea:#087b91;--line:#dce6e9;--bg:#f7faf9;--light:#edf7f8}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.65}a{color:var(--sea);text-decoration:none}a:hover{text-decoration:underline}a:focus-visible{outline:3px solid #f0a636;outline-offset:3px}
header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.nav{max-width:1180px;margin:auto;padding:16px 22px;display:flex;align-items:center;justify-content:space-between;gap:24px}.logo{font-size:27px;font-weight:800;letter-spacing:-.5px;color:var(--ink);white-space:nowrap}.tag{display:block;font-size:12px;font-weight:400;color:#718087;letter-spacing:0}.main-nav{display:flex;align-items:center;justify-content:flex-end;flex-wrap:nowrap;gap:20px;margin-left:auto;white-space:nowrap}.main-nav>a{display:inline-block;margin:0;font-size:14px;font-weight:700;color:var(--ink);flex:0 0 auto}.main-nav .plan-button{background:#ed8747;color:#fff;padding:10px 16px;border-radius:24px}.hero,.wrap{max-width:1180px;margin:auto;padding-left:22px;padding-right:22px}.hero{padding-top:25px}.crumb{font-size:13px;color:#718087;margin-bottom:18px}.heroimage{height:410px;border-radius:22px;background-color:#b8dfe8;background-image:var(--beach-photo,linear-gradient(145deg,#b8e0e8 0 35%,#d6bd8a 58%,#5b8789));background-size:cover;background-position:center;background-repeat:no-repeat;box-shadow:0 10px 30px #16384b18}.hero h1{font-size:48px;line-height:1.05;letter-spacing:-1.5px;margin:27px 0 8px}.lead{font-size:20px;max-width:850px;color:#405963;margin:0}.actions{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0 30px}.btn{display:inline-block;background:var(--ink);color:#fff;padding:11px 17px;border-radius:9px;font-weight:700;font-size:14px}.btn:hover{text-decoration:none;background:#0d5369}.btn.alt{background:#e7f2f4;color:var(--ink)}.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 25px}.fact,section{background:#fff;border:1px solid var(--line);border-radius:16px}.fact{padding:16px}.fact b{display:block;color:#718087;font-size:12px;text-transform:uppercase;letter-spacing:.6px}.fact strong{font-size:17px}.grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:32px}section{padding:27px 29px;margin-bottom:22px}h2{font-size:28px;line-height:1.2;margin:0 0 13px}h3{font-size:18px;margin:20px 0 6px}p{margin:0 0 15px}.tip{background:#edf7f8;border-left:4px solid var(--sea);padding:15px;border-radius:8px}.nearby a{display:block;padding:10px 0;border-bottom:1px solid var(--line)}.nearby a:last-child{border-bottom:0}.beach-navigation{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:24px 0}.prev-beach,.next-beach{display:block;background:#edf7f8;padding:20px;border-radius:12px;color:#16384b;text-decoration:none}.prev-beach:hover,.next-beach:hover{background:#e1f1f3;text-decoration:none}.prev-beach span,.next-beach span{display:block;font-size:12px;text-transform:uppercase;color:#718087;margin-bottom:5px}.prev-beach strong,.next-beach strong{display:block;font-size:20px}.prev-beach small,.next-beach small{display:block;margin-top:4px;color:#61737b}.next-beach{text-align:right}footer{background:#15394b;color:#dce9ed;padding:32px 22px}.foot{max-width:1180px;margin:auto;display:flex;justify-content:space-between;gap:20px}.small{font-size:12px;color:#aec2c9}
.beach-conditions{width:100%;background:#fff;border-block:1px solid #dfe8eb}.beach-conditions-inner{max-width:1180px;margin:0 auto;padding:8px 24px;display:flex;align-items:center;justify-content:center;overflow-x:auto;scrollbar-width:none}.beach-conditions-inner::-webkit-scrollbar{display:none}.beach-conditions-title{flex:0 0 auto;padding-right:18px;margin-right:4px;border-right:1px solid #dce6e9;line-height:1.05}.beach-conditions-title span{display:block;font-size:9px;font-weight:800;letter-spacing:1.5px;color:#007f91}.beach-conditions-title strong{display:block;margin-top:3px;font-size:14px;font-weight:800;color:#073d48;white-space:nowrap}.beach-weather-item{flex:0 0 auto;display:flex;align-items:center;gap:7px;min-height:34px;padding:0 12px;border-right:1px solid #e3ebed}.beach-weather-icon{width:20px;display:flex;align-items:center;justify-content:center;font-size:16px;line-height:1}.beach-weather-item small{display:block;margin-bottom:3px;font-size:8px;line-height:1;letter-spacing:1px;font-weight:800;color:#718087}.beach-weather-item strong{display:block;font-size:13px;line-height:1;font-weight:800;color:#073d48;white-space:nowrap}.beach-conditions-footer{max-width:1180px;margin:0 auto;padding:5px 24px 6px;display:flex;justify-content:space-between;gap:20px;font-size:8px;color:#7a898e}.beach-conditions-footer a{color:#7a898e}.beach-disclaimer{max-width:1180px;margin:0 auto;padding:0 24px 7px;font-size:8px;color:#89969a}.beach-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:24px 0 42px}.gallery-slot{height:280px;border-radius:18px;background:linear-gradient(145deg,#b8e0e8 0 35%,#d6bd8a 58%,#5b8789);display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:700;text-shadow:0 1px 4px #16384b;padding:12px;text-align:center}.gallery-slot img{display:block;width:100%;height:100%;object-fit:cover;border-radius:18px}.beach-gallery figure{margin:0}.beach-gallery figcaption{margin-top:9px;text-align:center;font-size:13px;color:var(--muted)}.access-box{background:#edf7f8;border-left:4px solid var(--sea);padding:15px;border-radius:8px}
@media(max-width:900px){.main-nav{gap:14px}.main-nav>a{font-size:13px}.nav{gap:14px}.quick{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:1fr}}
@media(max-width:800px){.nav{align-items:flex-start;flex-direction:column}.main-nav{width:100%;justify-content:flex-start;flex-wrap:wrap;white-space:normal;gap:10px 16px}.heroimage{height:290px;border-radius:16px}.hero h1{font-size:38px}.lead{font-size:18px}section{padding:22px}.beach-gallery{grid-template-columns:1fr;gap:18px}.gallery-slot{height:260px}.beach-conditions-inner{justify-content:flex-start;padding:8px 16px}.beach-weather-item{padding:0 10px}.beach-conditions-title{padding-right:14px}.beach-conditions-footer{padding-left:16px;padding-right:16px}.beach-disclaimer{padding-left:16px;padding-right:16px}}
@media(max-width:480px){.quick{grid-template-columns:1fr}.heroimage{height:230px}.hero{padding-left:16px;padding-right:16px}.wrap{padding-left:16px;padding-right:16px}.hero h1{font-size:35px}.beach-navigation{grid-template-columns:1fr}.next-beach{text-align:left}.foot{flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
