:root{--sky:#2fb4f0;--sky2:#8fdcff;--sea:#0a6fd1;--deep:#06418a;--or:#ff7a1a;--or2:#ffa53a;--navy:#0b2a5b;--white:#fff}
*{box-sizing:border-box}html,body{margin:0;overflow-x:hidden}
body{font-family:"Nunito",system-ui,sans-serif;color:var(--navy);background:#f2fbff}
a{color:inherit}
.logo{font-family:"Lilita One","Fredoka",sans-serif;letter-spacing:.5px;text-decoration:none;font-size:28px;color:#fff;-webkit-text-stroke:2px var(--navy);paint-order:stroke fill;text-shadow:0 3px 0 var(--navy)}
.logo b{color:var(--or);font-weight:inherit}
header.nav{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 18px;background:var(--sky)}
.nav .right{display:flex;gap:10px;align-items:center}
select,.pill{font:700 14px Nunito,sans-serif;border:2px solid var(--navy);border-radius:999px;padding:6px 12px;background:#fff;color:var(--navy);text-decoration:none}
.pill.cart{background:var(--or);color:#fff}
.hero{position:relative;overflow:hidden;background:linear-gradient(#36b8f2 0%,#8fdcff 62%,#1a8be0 62%,#0a6fd1 80%,#06418a 100%);min-height:520px;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;padding:30px 5vw 60px}
.sun{position:absolute;right:6%;top:24px;width:110px;height:110px;border-radius:50%;background:radial-gradient(#ffb43a,#ff8a12);box-shadow:0 0 0 14px #ffc85a55,0 0 60px #ffb23a}
.cloud{position:absolute;background:#fff;border-radius:60px;height:36px;opacity:.95}
.cloud:before,.cloud:after{content:"";position:absolute;background:#fff;border-radius:50%}
.cloud:before{width:50px;height:50px;top:-24px;left:18px}.cloud:after{width:36px;height:36px;top:-16px;left:56px}
.hero h1{font-family:"Lilita One",sans-serif;font-size:clamp(52px,8vw,104px);line-height:.95;margin:0;color:#fff;-webkit-text-stroke:5px var(--navy);paint-order:stroke fill;text-shadow:0 7px 0 var(--navy)}
.hero h1 span{color:var(--or)}
.tag{display:inline-block;margin:22px 0;font-weight:900;font-size:clamp(17px,2.2vw,24px);background:#fffc;padding:8px 16px;border-radius:14px}
.tag em{color:var(--or);font-style:normal}
.btn{display:inline-block;border:0;cursor:pointer;font:900 22px Nunito,sans-serif;color:#fff;background:linear-gradient(var(--or2),var(--or));padding:14px 34px;border-radius:999px;box-shadow:0 5px 0 #c4520a,0 8px 18px #0004;text-decoration:none}
.btn:active{transform:translateY(3px);box-shadow:0 2px 0 #c4520a}
.btn.small{font-size:17px;padding:11px 24px}
.fishwrap{position:relative;text-align:center;z-index:2}
.fishwrap img{width:min(420px,90%);transform:rotate(-8deg);animation:jump 3s ease-in-out infinite;filter:drop-shadow(0 12px 10px #0003)}
@keyframes jump{50%{transform:rotate(-4deg) translateY(-16px)}}
.splash{position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);width:70%;height:40px;border-radius:50%;background:radial-gradient(#fff 0 30%,#bdf0ff 45%,transparent 70%)}
.waves{position:absolute;left:0;right:0;bottom:0;height:60px;background:repeating-radial-gradient(circle at 50% 120%,#ffffff33 0 6px,transparent 6px 26px)}
main{max-width:1180px;margin:0 auto;padding:30px 18px}
h2{font-family:"Lilita One",sans-serif;font-size:36px;margin:10px 0 20px;color:var(--sea)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px}
.card{background:#fff;border-radius:20px;overflow:hidden;text-decoration:none;box-shadow:0 4px 0 #cfe9f7,0 6px 16px #0b2a5b14;transition:transform .15s}
.card:hover{transform:translateY(-4px) rotate(-.5deg)}
.card img{width:100%;aspect-ratio:1;object-fit:cover;display:block;background:#eef8ff}
.card .t{padding:10px 14px 2px;font-weight:900}
.card .p{padding:0 14px 14px;color:var(--or);font-weight:900}
.tbd{font-size:11px;background:#ffe9d6;color:#b44d00;border-radius:6px;padding:1px 6px;margin-left:4px;vertical-align:middle}
.pp{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:start}
.pp img{width:100%;border-radius:24px;background:#fff;box-shadow:0 6px 20px #0b2a5b22}
.pp h1{font-family:"Lilita One",sans-serif;font-size:42px;margin:0 0 8px}
.price{font-size:28px;font-weight:900;color:var(--or)}
.sizes{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 22px}
.sizes button{font:800 16px Nunito;min-width:54px;padding:10px;border-radius:12px;border:2px solid var(--navy);background:#fff;cursor:pointer;color:var(--navy)}
.sizes button.on{background:var(--sea);color:#fff;border-color:var(--sea)}
.note{background:#fff6e8;border:2px dashed var(--or2);border-radius:14px;padding:10px 14px;margin:14px 0;font-size:14px}
.msg{font-weight:800;margin-top:12px;min-height:1.2em}
.err{color:#c0281b}
table.cart{width:100%;border-collapse:collapse;background:#fff;border-radius:18px;overflow:hidden}
.cart td{padding:12px;border-bottom:1px solid #e3f2fb;vertical-align:middle}
.cart img{width:70px;border-radius:10px}
.qty{width:56px;font:700 15px Nunito;padding:6px;border-radius:8px;border:2px solid #9cc}
.sum{text-align:right;margin-top:18px}
footer{background:var(--deep);color:#cfeaff;text-align:center;padding:26px 16px;margin-top:40px;font-size:14px}
@media(max-width:760px){.hero{grid-template-columns:1fr;text-align:center;min-height:0;padding-top:20px}.fishwrap img{width:62%}.sun{width:70px;height:70px;right:4%}.pp{grid-template-columns:1fr}.logo{font-size:22px}.cart td:nth-child(1){display:none}.hide-m{display:none}}
.cats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.chip{font-weight:900;text-decoration:none;border:2px solid var(--sea);color:var(--sea);background:#fff;border-radius:999px;padding:8px 16px}
.chip small{opacity:.7}.chip.on{background:var(--sea);color:#fff}
.sw{font-size:12px;color:var(--navy);font-weight:700}
.thumbs{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}.thumbs img{width:72px;border-radius:10px;cursor:pointer;box-shadow:none;border:2px solid #cfe9f7}
.note.ship{background:#e8f6ff;border-color:var(--sea)}