*{box-sizing:border-box}
body{margin:0;font-family:'Nunito Sans',system-ui,Segoe UI,Roboto,sans-serif;color:#0c2340;background:#f6e7c8;line-height:1.7}
h1,h2,h3,.logo{font-family:'Baloo 2',system-ui,sans-serif;line-height:1.2;color:#0c2340}
a{color:#0e7490;font-weight:600}a:hover{color:#c2410c}
.w{max-width:960px;margin:0 auto;padding:16px 20px}
header{background:#0c2340;color:#fff;position:relative}
header .w{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}
.logo{font-size:1.5rem;font-weight:800;margin:0;color:#fff;display:flex;align-items:center;gap:10px}
.logo .sun{width:26px;height:26px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fde68a,#f97316 70%);box-shadow:0 0 0 4px #f9731633;flex:0 0 26px}
.logo small{font-family:'Nunito Sans',sans-serif;font-weight:700;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#fdba74}
header nav a{color:#fff;text-decoration:none;margin-left:6px;font-weight:700;padding:6px 14px;border-radius:999px}
header nav a:hover{background:#ffffff1f;color:#fde68a}
.hero{position:relative;text-align:center;padding:56px 0 96px;color:#0c2340;
background:linear-gradient(180deg,#7dd3fc 0%,#bae6fd 35%,#fed7aa 58%,#38bdf8 60%,#0e7490 100%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:60px;
background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 60' preserveAspectRatio='none'><path d='M0,30 C150,60 300,0 450,25 C600,50 750,5 900,28 C1050,50 1150,20 1200,30 L1200,60 L0,60 Z' fill='%23f6e7c8'/></svg>") no-repeat bottom/100% 100%}
.hero h1{font-size:clamp(1.8rem,5vw,2.8rem);margin:.3em 0;color:#0c2340;text-shadow:0 1px 0 #ffffff99}
.hero p{display:inline-block;background:#fffbeb;color:#0c2340;padding:10px 20px;border-radius:999px;font-weight:600;box-shadow:0 4px 14px #0c234022;max-width:100%}
main h2,article h2{color:#0e7490}article h2{margin-top:1.6em}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px}
.card{background:#fffdf7;border-radius:22px;padding:24px;box-shadow:0 6px 20px #0c23401a;border-top:6px solid #0e7490;transition:transform .2s}
.card:hover{transform:translateY(-3px)}.card .ic{font-size:2.6rem}
.disc{background:#fff7ed;border-left:5px solid #f97316;padding:12px 16px;border-radius:14px;font-size:.92rem}
.tw{overflow-x:auto}table{width:100%;border-collapse:collapse;background:#fffdf7;font-size:.93rem;margin:16px 0;border-radius:14px;overflow:hidden}
th,td{border:1px solid #e9d5a8;padding:8px 10px;text-align:left}th{background:#0e7490;color:#fff}
.prod{background:#fffdf7;border:2px solid #99d5e0;border-radius:22px;padding:18px;margin:20px 0;display:flex;gap:16px;flex-wrap:wrap}
.prod .ic{font-size:3rem;flex:0 0 64px;text-align:center}.prod .b{flex:1 1 260px}.price{font-size:.88rem;color:#475569}
.btn{display:inline-block;background:#fb7185;color:#0c2340;padding:10px 22px;border-radius:999px;font-weight:800;text-decoration:none;margin:6px 8px 0 0;box-shadow:0 4px 12px #fb718566}
.btn:hover{background:#f97316;color:#0c2340}
.ph{font-family:monospace;background:#ffe4e6;color:#9f1239;padding:2px 6px;border-radius:6px}
footer{background:#0c2340;color:#e2e8f0;font-size:.88rem;margin-top:48px;border-top:6px solid #f97316}footer a{color:#7dd3fc}
svg{max-width:100%;height:auto}
@media(max-width:600px){header nav a{margin-left:0;padding:6px 10px}.hero{padding:40px 0 80px}}