:root{
  --ink:#10243e; --muted:#607089; --ice:#eef8ff; --blue:#2b78c5;
  --cyan:#79d5ea; --white:#fff; --line:#dce9f3; --accent:#ffcf66;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#f7fbfe;line-height:1.6}
a{color:inherit;text-decoration:none}
.container{width:min(1120px,92%);margin:auto}
.nav{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav-inner{height:70px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{font-weight:900;font-size:1.15rem;display:flex;align-items:center;gap:10px}
.logo-mark{width:36px;height:36px;border-radius:50%;background:var(--ink);display:grid;place-items:center;color:#fff}
.links{display:flex;gap:22px;color:var(--muted);font-weight:700;font-size:.95rem}
.links a:hover,.links .active{color:var(--blue)}
.hero{padding:90px 0 70px;background:linear-gradient(135deg,#eaf8ff 0%,#fff 55%,#e9f7ff 100%);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center}
.kicker{color:var(--blue);font-weight:900;letter-spacing:.12em;text-transform:uppercase;font-size:.8rem}
h1{font-size:clamp(2.8rem,6vw,5.6rem);line-height:.95;margin:14px 0 22px;letter-spacing:-.055em}
h2{font-size:clamp(2rem,4vw,3.2rem);line-height:1.05;margin:0 0 18px;letter-spacing:-.035em}
h3{margin:0 0 8px}
.lead{font-size:1.15rem;color:var(--muted);max-width:650px}
.btn{display:inline-flex;padding:13px 19px;border-radius:999px;background:var(--ink);color:#fff;font-weight:800;margin-top:20px}
.btn.alt{background:#fff;color:var(--ink);border:1px solid var(--line);margin-left:8px}
.section{padding:78px 0}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:26px;box-shadow:0 12px 35px rgba(16,36,62,.05)}
.card .icon{font-size:2rem;margin-bottom:12px}
.card p,.muted{color:var(--muted)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:30px}
.stat{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px}
.stat b{display:block;font-size:1.8rem}
.penguin-scene{min-height:430px;position:relative;background:linear-gradient(#bdefff 0 65%,#fff 65%);border-radius:36px;overflow:hidden;border:1px solid #cceaf6}
.sun{position:absolute;width:80px;height:80px;border-radius:50%;background:#ffe59b;right:50px;top:45px}
.ice{position:absolute;bottom:0;left:-5%;width:110%;height:42%;background:#fff;clip-path:polygon(0 45%,8% 30%,17% 44%,27% 22%,36% 42%,47% 18%,57% 42%,67% 24%,76% 45%,87% 25%,100% 43%,100% 100%,0 100%)}
.penguin{position:absolute;left:50%;top:49%;transform:translate(-50%,-50%);width:150px;height:220px;background:#14273d;border-radius:48% 48% 42% 42%;box-shadow:inset 0 -18px 0 #0b1b2c}
.belly{position:absolute;left:24px;top:72px;width:102px;height:130px;background:#fff;border-radius:50% 50% 45% 45%}
.eye{position:absolute;top:52px;width:16px;height:16px;background:#fff;border-radius:50%}
.eye:after{content:"";position:absolute;inset:5px;background:#10243e;border-radius:50%}
.eye.l{left:43px}.eye.r{right:43px}
.beak{position:absolute;top:76px;left:61px;width:0;height:0;border-left:15px solid transparent;border-right:15px solid transparent;border-top:24px solid #f6b83f}
.flipper{position:absolute;top:102px;width:35px;height:95px;background:#14273d;border-radius:70%}
.flipper.l{left:-24px;transform:rotate(20deg)}.flipper.r{right:-24px;transform:rotate(-20deg)}
.foot{position:absolute;bottom:-9px;width:55px;height:22px;background:#f6b83f;border-radius:50%}
.foot.l{left:10px}.foot.r{right:10px}
.page-hero{padding:70px 0 45px;background:#eaf8ff}
.page-hero p{max-width:720px;color:var(--muted);font-size:1.1rem}
.species{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.badge{display:inline-block;background:#e9f7ff;color:#216da9;padding:5px 10px;border-radius:999px;font-size:.78rem;font-weight:800;margin-bottom:12px}
.footer{padding:35px 0;border-top:1px solid var(--line);color:var(--muted);font-size:.9rem}
.timeline{border-left:2px solid #bfe2f3;padding-left:25px}
.timeline article{position:relative;margin:0 0 28px}
.timeline article:before{content:"";position:absolute;left:-34px;top:8px;width:14px;height:14px;border-radius:50%;background:var(--blue);border:4px solid #eaf8ff}
@media(max-width:800px){.hero-grid,.species{grid-template-columns:1fr}.grid3,.stats{grid-template-columns:1fr}.links{gap:10px;font-size:.82rem}.hero{padding-top:55px}.penguin-scene{min-height:350px}}