:root {
  --flame: #F0442E;
  --charcoal: #171C24;
  --ivory: #FFF4EE;
  --muted: #6f737c;
  --border: rgba(23,28,36,.11);
  --font-display: "Manrope", sans-serif;
  --font-body: "DM Sans", sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; min-height: 100vh; color: var(--charcoal); font-family: var(--font-body);
  background:
    radial-gradient(ellipse at 76% 27%, rgba(240,68,46,.17), transparent 34%),
    radial-gradient(ellipse at 10% 85%, rgba(255,184,142,.35), transparent 35%),
    linear-gradient(135deg, #fffaf6 0%, var(--ivory) 43%, #ffe2d5 100%);
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
.ambient { position: fixed; pointer-events: none; filter: blur(70px); opacity: .32; z-index: -1; border-radius: 50%; animation: drift 14s ease-in-out infinite alternate; }
.ambient-one { width: 340px; height: 340px; background: #ff7b61; right: -150px; top: 22%; }
.ambient-two { width: 250px; height: 250px; background: #ffd0b8; left: -120px; bottom: 4%; animation-delay: -6s; }
.topbar { width: min(1240px, calc(100% - 72px)); height: 94px; margin: auto; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(23,28,36,.09); position: relative; z-index: 5; }
.brand, .footer-brand { display: inline-flex; align-items: center; gap: 11px; font: 800 21px var(--font-display); letter-spacing: -1px; }
.brand-mark { width: 37px; height: 37px; filter: drop-shadow(0 5px 8px rgba(240,68,46,.2)); }
.brand-campus { color: var(--flame); }
.nav-links { display: flex; align-items: center; gap: 34px; color: #555963; font-size: 13px; font-weight: 600; }
.nav-links a { transition: color .2s ease, transform .2s ease; }
.nav-links a:hover { color: var(--flame); transform: translateY(-1px); }
.nav-links a span { font-size: 11px; color: var(--flame); margin-left: 3px; }
.menu-toggle { display: none; border: 0; background: transparent; padding: 8px; }
.menu-toggle span { display: block; width: 23px; height: 2px; margin: 5px; background: var(--charcoal); }
main { width: min(1240px, calc(100% - 72px)); margin: auto; }
.hero { min-height: 610px; display: grid; grid-template-columns: 1.03fr .97fr; align-items: center; gap: 42px; padding: 58px 0 48px; }
.hero-copy { max-width: 560px; position: relative; z-index: 2; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; color: #a23a2c; background: rgba(240,68,46,.08); border: 1px solid rgba(240,68,46,.15); border-radius: 99px; padding: 9px 13px; font-size: 10px; font-weight: 800; letter-spacing: 1.6px; }
.pulse { width: 7px; height: 7px; background: var(--flame); border-radius: 50%; box-shadow: 0 0 0 4px rgba(240,68,46,.12); animation: pulse 1.8s infinite; }
h1 { font: 800 clamp(46px, 5.3vw, 72px)/1.07 var(--font-display); letter-spacing: -4.4px; margin: 26px 0 22px; }
.gradient-text { background: linear-gradient(100deg, var(--flame) 0%, #ff805f 48%, #b62b37 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.intro { color: #626570; font-size: 16px; line-height: 1.8; max-width: 465px; margin: 0 0 22px; }
.audience-pills { display: flex; align-items: center; gap: 12px; color: #5d6069; font-size: 12px; font-weight: 700; margin-bottom: 25px; }
.audience-pills span { padding: 8px 12px; border: 1px solid rgba(23,28,36,.12); background: rgba(255,255,255,.45); border-radius: 9px; }
.audience-pills i { width: 4px; height: 4px; border-radius: 50%; background: var(--flame); }
.subscribe-form { max-width: 470px; }
.input-wrap { display: flex; align-items: center; gap: 11px; background: rgba(255,255,255,.83); border: 1px solid rgba(23,28,36,.13); border-radius: 13px; padding: 0 15px; height: 57px; box-shadow: 0 8px 24px rgba(67,35,23,.04); transition: border-color .2s, box-shadow .2s; }
.input-wrap:focus-within { border-color: var(--flame); box-shadow: 0 0 0 4px rgba(240,68,46,.1); }
.input-wrap svg { width: 19px; height: 19px; fill: none; stroke: #a2a3aa; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
.input-wrap input { border: 0; outline: 0; width: 100%; min-width: 0; background: transparent; font: 13px var(--font-body); color: var(--charcoal); }
.input-wrap input::placeholder { color: #a0a1a8; }
.submit-btn { display: flex; justify-content: center; align-items: center; gap: 18px; width: 100%; height: 55px; margin-top: 11px; border: 0; border-radius: 13px; color: white; background: linear-gradient(105deg, #F0442E, #d9342e); box-shadow: 0 10px 20px rgba(240,68,46,.22); font: 700 14px var(--font-body); cursor: pointer; transition: transform .2s, box-shadow .2s, filter .2s; }
.submit-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 26px rgba(240,68,46,.28); filter: saturate(1.1); }
.submit-btn:active { transform: translateY(0); }
.submit-btn span { font-size: 19px; transition: transform .2s; }
.submit-btn:hover span { transform: translateX(4px); }
.form-note { color: #898991; font-size: 11px; margin: 12px 0 0; }
.form-message { font-size: 12px; font-weight: 600; min-height: 15px; margin: 8px 0 0; }
.form-message.success { color: #247b52; }
.form-message.error { color: #b52b25; }
.trust-line { display: flex; align-items: center; gap: 8px; margin-top: 25px; font-size: 11px; font-weight: 600; color: #73757e; }
.check { display: grid; place-items: center; width: 18px; height: 18px; color: #297a53; background: #dff3e7; border-radius: 50%; font-size: 11px; }
.hero-art { min-height: 475px; position: relative; display: grid; place-items: center; perspective: 900px; }
.art-glow { position: absolute; width: 350px; height: 350px; border-radius: 50%; background: radial-gradient(circle, rgba(240,68,46,.18), rgba(255,200,174,.13) 50%, transparent 70%); animation: glow 5s ease-in-out infinite alternate; }
.orbit { position: absolute; border: 1px solid rgba(240,68,46,.16); border-radius: 50%; transform: rotate(-22deg); }
.orbit-a { width: 470px; height: 270px; }
.orbit-b { width: 400px; height: 360px; transform: rotate(36deg); border-color: rgba(23,28,36,.08); }
.campus-card { width: min(410px, 90%); background: rgba(255,255,255,.87); border: 1px solid rgba(255,255,255,.9); border-radius: 23px; box-shadow: 0 28px 80px rgba(89,42,28,.17), 0 3px 10px rgba(89,42,28,.05); overflow: hidden; position: relative; z-index: 1; transform: rotateY(-5deg) rotateX(2deg); animation: cardFloat 6s ease-in-out infinite; backdrop-filter: blur(18px); }
.card-top { height: 58px; display: flex; align-items: center; justify-content: space-between; padding: 0 20px; border-bottom: 1px solid rgba(23,28,36,.07); }
.mini-brand { display: flex; align-items: center; gap: 7px; font: 800 11px var(--font-display); letter-spacing: -.3px; }
.mini-brand img { width: 19px; height: 19px; }
.live-dot { font-size: 8px; letter-spacing: 1px; font-weight: 800; color: #c14a3b; }
.campus-illustration { height: 250px; position: relative; overflow: hidden; background: linear-gradient(160deg,#fff2e9,#ffded0 60%,#f8c5b4); }
.sun { position: absolute; width: 75px; height: 75px; border-radius: 50%; background: linear-gradient(135deg,#ffb66c,#f0442e); top: 28px; right: 70px; opacity: .86; }
.cloud { position: absolute; height: 12px; width: 56px; border-radius: 20px; background: rgba(255,255,255,.75); }
.cloud:before,.cloud:after { content:""; position:absolute; background:inherit; border-radius:50%; }
.cloud:before { width:21px;height:21px;left:9px;top:-9px; }.cloud:after { width:17px;height:17px;right:9px;top:-6px; }
.cloud-a { top:53px; left:53px; }.cloud-b { top:91px; right:38px; transform:scale(.7); }
.building { position:absolute; bottom:35px; background:linear-gradient(100deg,#fff8f0,#ffe8d9); border:1px solid rgba(179,91,66,.18); box-shadow: 5px 8px 0 rgba(190,89,62,.08); }
.building-left { width:90px;height:104px;left:39px;border-radius:3px 3px 0 0; }
.building-center { width:124px;height:145px;left:50%;transform:translateX(-50%);z-index:2;background:linear-gradient(100deg,#fffaf4,#fff0e5); }
.building-right { width:82px;height:88px;right:34px;border-radius:3px 3px 0 0; }
.roof { position:absolute; width:0;height:0; border-left:70px solid transparent;border-right:70px solid transparent;border-bottom:28px solid #d94a39;top:-28px;left:-9px; }
.windows { position:absolute; inset:15px 12px 10px; background:repeating-linear-gradient(90deg,transparent 0 12px,rgba(240,68,46,.33) 12px 17px,transparent 17px 27px),repeating-linear-gradient(0deg,transparent 0 19px,rgba(240,68,46,.25) 19px 24px,transparent 24px 33px); opacity:.8; }
.building-center .windows { inset:22px 18px 14px; background:repeating-linear-gradient(90deg,transparent 0 14px,rgba(240,68,46,.36) 14px 21px,transparent 21px 34px),repeating-linear-gradient(0deg,transparent 0 20px,rgba(240,68,46,.26) 20px 26px,transparent 26px 38px); }
.door { position:absolute; width:25px;height:43px;bottom:0;left:calc(50% - 12px);background:#b84336;border-radius:10px 10px 0 0; }
.ground { position:absolute; height:43px; bottom:0; left:0; right:0; background:linear-gradient(#e9a98f,#d98570); }
.path { position:absolute; bottom:0;left:calc(50% - 21px);width:42px;height:42px;background:#ffe9d9;clip-path:polygon(40% 0,60% 0,100% 100%,0 100%);z-index:3; }
.tree { position:absolute; bottom:26px; width:28px;height:65px;z-index:4; }.tree-a{left:22px}.tree-b{right:20px;transform:scale(.8)}
.tree i { position:absolute; bottom:0; left:11px;width:6px;height:27px;background:#8b5844; }.tree b { position:absolute; top:0;left:0;width:28px;height:38px;border-radius:60% 40% 55% 45%;background:#6c9274;box-shadow:inset -4px -2px 0 rgba(0,0,0,.06); }
.card-bottom { padding: 17px 20px 19px; display:flex; align-items:center; justify-content:space-between; }
.card-bottom strong { display:block;font:800 14px var(--font-display);letter-spacing:-.4px; }.card-bottom small { display:block;color:#8c8d94;font-size:10px;margin-top:5px; }
.arrow-bubble { display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:#fff0e9;color:var(--flame);font-size:19px; }
.float-chip { display:flex;align-items:center;gap:10px;position:absolute;z-index:3;padding:12px 15px;background:rgba(255,255,255,.91);border:1px solid rgba(255,255,255,.95);border-radius:14px;box-shadow:0 15px 35px rgba(77,42,30,.13);backdrop-filter:blur(14px);animation:chipFloat 5s ease-in-out infinite; }
.float-chip strong { display:block;font:800 11px var(--font-display); }.float-chip small { display:block;font-size:9px;color:#8b8b92;margin-top:3px; }
.chip-school { top:70px;left:-5px; }.chip-safe { right:-5px;bottom:74px;animation-delay:-2.5s; }
.chip-icon { display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#fff0e8;color:var(--flame);font-size:19px; }
.shield { display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#e5f4e9;color:#32815a;font-weight:800; }
.spark { position:absolute;color:var(--flame);animation:twinkle 3s ease-in-out infinite; }.spark-one{top:72px;right:58px;font-size:25px}.spark-two{bottom:80px;left:25px;font-size:18px;animation-delay:-1s}.spark-three{top:140px;left:25px;font-size:13px;animation-delay:-2s}
.bottom-strip { display:flex;align-items:center;justify-content:space-between;gap:25px;padding:24px 30px;margin:2px 0 54px;background:rgba(255,255,255,.48);border:1px solid rgba(255,255,255,.8);border-radius:18px;box-shadow:0 12px 35px rgba(87,45,28,.04); }
.strip-item { display:flex;align-items:center;gap:13px;flex:1; }.strip-icon { display:grid;place-items:center;flex:0 0 auto;width:39px;height:39px;border-radius:12px;background:rgba(240,68,46,.09);color:var(--flame);font-size:20px; }
.strip-item strong { font:800 12px var(--font-display); }.strip-item p { color:#85858c;font-size:10px;margin:5px 0 0; }.strip-divider { height:38px;width:1px;background:rgba(23,28,36,.1); }
.footer { width:min(1240px,calc(100% - 72px));margin:auto;min-height:84px;border-top:1px solid rgba(23,28,36,.1);display:flex;align-items:center;justify-content:space-between;gap:20px;color:#777983;font-size:11px; }
.footer-brand { color:var(--charcoal);font-size:12px;letter-spacing:-.3px;gap:7px; }.footer-brand img{width:22px;height:22px}
.copyright { text-align:center; }.footer nav { display:flex;gap:20px;font-weight:600; }.footer nav a:hover{color:var(--flame)}
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
.reveal { opacity:0; transform:translateY(20px); animation:reveal .8s cubic-bezier(.2,.7,.2,1) forwards; }.hero-art.reveal{animation-delay:.16s}.bottom-strip.reveal{animation-delay:.3s}
@keyframes reveal { to { opacity:1;transform:translateY(0); } }
@keyframes pulse { 0%,100%{box-shadow:0 0 0 4px rgba(240,68,46,.12)}50%{box-shadow:0 0 0 7px rgba(240,68,46,.02)} }
@keyframes cardFloat { 0%,100%{transform:translateY(0) rotateY(-5deg) rotateX(2deg)}50%{transform:translateY(-9px) rotateY(-3deg) rotateX(1deg)} }
@keyframes chipFloat { 0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)} }
@keyframes glow { from{transform:scale(.94);opacity:.7}to{transform:scale(1.08);opacity:1} }
@keyframes twinkle { 0%,100%{transform:rotate(0) scale(1);opacity:.8}50%{transform:rotate(20deg) scale(1.25);opacity:1} }
@keyframes drift { from{transform:translate(0,0)}to{transform:translate(-35px,25px)} }
@media (max-width: 980px) {
  .topbar,main,.footer{width:calc(100% - 44px)}.hero{gap:12px}.hero-art{transform:scale(.9)}h1{letter-spacing:-3px}.bottom-strip{padding:20px;gap:16px}
  .chip-school{left:-15px}.chip-safe{right:-15px}
}
@media (max-width: 760px) {
  .topbar{height:76px}.brand{font-size:19px}.brand-mark{width:32px;height:32px}.menu-toggle{display:block;cursor:pointer}
  .nav-links{display:none;position:absolute;top:66px;right:0;left:0;padding:14px;background:rgba(255,250,246,.97);border:1px solid var(--border);border-radius:14px;box-shadow:0 16px 35px rgba(23,28,36,.1);flex-direction:column;align-items:stretch;gap:0}
  .nav-links.open{display:flex}.nav-links a{padding:13px 10px}.hero{grid-template-columns:1fr;padding:52px 0 25px;gap:8px}.hero-copy{max-width:620px}h1{font-size:clamp(46px,11vw,66px)}.intro{font-size:15px}.hero-art{min-height:405px;transform:none;margin-top:0}.campus-card{width:min(400px,84%)}.chip-school{left:2%}.chip-safe{right:0}.orbit-a{width:90%;}.orbit-b{width:85%}
  .bottom-strip{display:grid;grid-template-columns:1fr;padding:20px;margin-bottom:34px;gap:17px}.strip-divider{width:100%;height:1px}.strip-item p{font-size:11px}
  .footer{padding:22px 0;display:grid;grid-template-columns:1fr auto;gap:15px}.copyright{grid-row:2;grid-column:1 / -1;text-align:left;order:3}.footer nav{gap:14px;justify-self:end}
}
@media (max-width: 420px) {
  .topbar,main,.footer{width:calc(100% - 32px)}.hero{padding-top:38px}.eyebrow{font-size:9px;letter-spacing:1.1px}h1{font-size:44px;letter-spacing:-2.7px}.audience-pills{gap:7px}.audience-pills span{padding:8px;font-size:11px}.hero-art{min-height:350px}.campus-illustration{height:215px}.campus-card{width:87%}.card-top{padding:0 13px}.card-bottom{padding:14px}.chip-school{top:26px}.chip-safe{bottom:36px}.float-chip{padding:9px 10px}.float-chip strong{font-size:10px}.float-chip small{font-size:8px}.footer{grid-template-columns:1fr}.footer nav{justify-self:start;grid-row:3}.copyright{grid-row:2}.footer-brand{grid-row:1}
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}
