:root{ --cream:#FFEFD2; --cream-deep:#FFDFA8; --orange:#FF8A3D; --orange-dark:#F2660E; --orange-soft:#FFE0BE; --yellow:#FFC94A; --yellow-soft:#FFEDB8; --pink:#FF6FA0; --pink-soft:#FFD9E6; --teal:#2FB6A8; --teal-soft:#D6F2EE; --violet:#9B7CE0; --ink:#4A3826; --ink-soft:#8A7256; --white:#FFFFFF; --card-bg:#FFFBF0; --shadow-warm:0 14px 30px -10px rgba(242,102,14,.25); --radius-lg:32px; --radius-md:24px; --radius-sm:16px; --radius-pill:999px; } *{ box-sizing:border-box; margin:0; padding:0; } html{ scroll-behavior:smooth; overflow-x:hidden; overscroll-behavior-x:none; } body{ font-family:'Nunito',sans-serif; background: radial-gradient(circle at 8% 8%,var(--pink-soft) 0,transparent 16%), radial-gradient(circle at 92% 4%,var(--teal-soft) 0,transparent 14%), linear-gradient(180deg,var(--cream) 0%,var(--cream-deep) 100%); color:var(--ink); overflow-x:hidden; overscroll-behavior-x:none; -webkit-font-smoothing:antialiased; } h1,h2,h3,h4{ font-family:'Baloo 2',sans-serif; font-weight:700; line-height:1.15; color:var(--ink); } a{ text-decoration:none; color:inherit; } img{ max-width:100%; display:block; } ul{ list-style:none; } button{ font-family:inherit; cursor:pointer; border:none; background:none; } :focus-visible{ outline:3px solid var(--orange-dark); outline-offset:3px; border-radius:8px; } /* HEADER */ header{ position:sticky; top:0; z-index:50; background:rgba(255,248,234,.92); backdrop-filter:blur(8px); border-bottom:1px solid rgba(242,102,14,.1); } .header-inner{ display:flex; align-items:center; justify-content:space-between; padding:18px 32px; max-width:1180px; margin:0 auto; gap:24px; } .logo{ display:flex; align-items:center; gap:0; flex-shrink:0; position:relative; } .confetti-piece{ position:absolute; z-index:0; pointer-events:none; animation:float-soft 4.5s ease-in-out infinite; } .confetti-piece.sq{ border-radius:2px; } .confetti-piece.dot{ border-radius:50%; } @media(prefers-reduced-motion:reduce){ .confetti-piece{ animation:none!important; } } .logo-text{ display:flex; flex-direction:column; line-height:1; position:relative; z-index:1; } .logo-text .top{ font-family:'Baloo 2',sans-serif; font-weight:800; font-size:1.55rem; letter-spacing:.5px; color:var(--ink); } .logo-text .bottom{ font-size:.6rem; font-weight:800; letter-spacing:2.5px; color:var(--orange-dark); margin-top:3px; } nav.main-nav{ display:flex; gap:2px; flex:1; justify-content:center; } nav.main-nav a{ display:flex; align-items:center; gap:6px; padding:10px 12px; border-radius:var(--radius-pill); font-weight:700; font-size:.88rem; color:var(--ink-soft); transition:background .2s,color .2s,transform .2s; white-space:nowrap; } nav.main-nav a:hover{ background:var(--orange-soft); color:var(--orange-dark); transform:translateY(-1px); } nav.main-nav a.active{ background:var(--orange); color:#fff; box-shadow:var(--shadow-warm); } nav.main-nav .icon{ font-size:1.05rem; } nav.main-nav a.nav-highlight{ background:var(--pink-soft); color:#D9407A; } nav.main-nav a.nav-highlight:hover{ background:var(--pink); color:#fff; } .mobile-nav a.nav-highlight{ background:var(--pink-soft); color:#D9407A; } .btn-portal{ display:flex; align-items:center; gap:8px; background:var(--yellow); color:var(--ink); padding:12px 22px; border-radius:var(--radius-pill); font-weight:800; font-size:.95rem; box-shadow:0 8px 0 0 #E0A526; transition:transform .15s,box-shadow .15s; flex-shrink:0; } .btn-portal:hover{ transform:translateY(-2px); box-shadow:0 10px 0 0 #E0A526; } .btn-portal:active{ transform:translateY(2px); box-shadow:0 4px 0 0 #E0A526; }

/* MOBILE MENU */
.menu-toggle{ display:none; flex-direction:column; justify-content:center; align-items:center; gap:5px; width:44px; height:44px; flex-shrink:0; border-radius:var(--radius-pill); background:var(--orange-soft); }
.menu-toggle .bar{ display:block; width:20px; height:3px; border-radius:2px; background:var(--orange-dark); transition:transform .25s,opacity .25s; }
.menu-toggle[aria-expanded="true"] .bar:nth-child(1){ transform:translateY(8px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] .bar:nth-child(2){ opacity:0; }
.menu-toggle[aria-expanded="true"] .bar:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }
.mobile-nav{ position:absolute; top:100%; left:18px; right:18px; z-index:60; background:var(--card-bg); border-radius:var(--radius-md); box-shadow:var(--shadow-warm); padding:10px; display:flex; flex-direction:column; gap:2px; opacity:0; visibility:hidden; transform:translateY(-10px); transition:opacity .22s,transform .22s,visibility .22s; }
.mobile-nav.open{ opacity:1; visibility:visible; transform:translateY(8px); }
.mobile-nav a{ display:flex; align-items:center; gap:12px; padding:13px 16px; border-radius:var(--radius-sm); font-weight:700; font-size:1rem; color:var(--ink-soft); transition:background .2s,color .2s; }
.mobile-nav a .icon{ font-size:1.15rem; }
.mobile-nav a:hover{ background:var(--orange-soft); color:var(--orange-dark); }
.mobile-nav a.active{ background:var(--orange); color:#fff; }
.mobile-nav-backdrop{ position:fixed; inset:0; background:rgba(74,56,38,.25); z-index:55; opacity:0; visibility:hidden; transition:opacity .22s,visibility .22s; }
.mobile-nav-backdrop.open{ opacity:1; visibility:visible; }

/* DECOR */ .confetti{ position:absolute; pointer-events:none; z-index:1; } 

@keyframes float-soft{ 0%,100%{transform:translateY(0) rotate(var(--rot,0deg))} 50%{transform:translateY(-10px) rotate(var(--rot,0deg))} } 
@keyframes balloon-drift{ 0%,100%{transform:translateY(0) rotate(-3deg)} 50%{transform:translateY(-16px) rotate(3deg)} }
.float{ animation:float-soft 5s ease-in-out infinite; } 
.balloon{ animation:balloon-drift 6s ease-in-out infinite; } 

@media(prefers-reduced-motion:reduce){ .float,.balloon{ animation:none!important; } } 
/* HERO */ .hero{ position:relative; padding:64px 32px 56px; max-width:1180px; margin:0 auto; display:grid; grid-template-columns:1.05fr .95fr .78fr; gap:28px; align-items:stretch; min-height:500px; } .hero-copy{ position:relative; z-index:3; padding-top:8px; } .eyebrow-wave{ font-family:'Baloo 2'; font-weight:700; font-size:1.9rem; color:var(--ink); margin-bottom:2px; } .hero-copy h1{ font-size:2.5rem; margin-bottom:18px; } .hero-copy h1 .accent{ color:var(--orange-dark); display:block; } .hero-copy p{ font-size:1.05rem; color:var(--ink-soft); line-height:1.65; max-width:380px; margin-bottom:26px; } .remember-card{ display:inline-flex; gap:14px; align-items:flex-start; background:var(--card-bg); border:2px dashed var(--orange); border-radius:var(--radius-md); padding:18px 22px; max-width:340px; } .remember-card .star{ font-size:1.4rem; flex-shrink:0; margin-top:2px; } .remember-card strong{ display:block; font-family:'Baloo 2'; font-size:1.05rem; margin-bottom:4px; } .remember-card span{ font-size:.9rem; color:var(--ink-soft); line-height:1.5; } .hero-stage{ position:relative; display:flex; align-items:flex-end; justify-content:center; min-height:420px; } .stage-arch{ position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:78%; height:84%; background:radial-gradient(ellipse at 50% 100%,#FFD89B 0%,#FFC568 60%,transparent 100%); border-radius:50% 50% 0 0/60% 60% 0 0; opacity:.7; z-index:0; } .hero-character{ position:relative; z-index:2; width:100%; max-width:330px; filter:drop-shadow(0 15px 12px rgba(74,56,38,.14)); } .mission-card{ position:relative; z-index:3; background:var(--card-bg); border-radius:var(--radius-lg); padding:26px 26px 22px; box-shadow:var(--shadow-warm); display:flex; flex-direction:column; height:fit-content; overflow:visible; } .mission-card .corner-badge{ position:absolute; top:-22px; right:-18px; width:62px; height:62px; z-index:4; } .tag-title{ display:flex; align-items:center; gap:8px; font-family:'Baloo 2'; font-weight:700; font-size:1.05rem; color:var(--ink); margin-bottom:18px; } .day-chip{ display:inline-block; background:var(--teal-soft); color:var(--teal); font-weight:800; font-size:.78rem; padding:6px 14px; border-radius:var(--radius-pill); margin-bottom:14px; width:fit-content; } .mission-card h3{ font-size:1.25rem; margin-bottom:10px; line-height:1.25; } .mission-card p{ font-size:.92rem; color:var(--ink-soft); line-height:1.55; margin-bottom:18px; } .btn-cta{ display:inline-flex; align-items:center; justify-content:center; gap:8px; background:linear-gradient(135deg,var(--orange) 0%,var(--orange-dark) 100%); color:#fff; font-weight:800; font-size:.95rem; padding:13px 22px; border-radius:var(--radius-pill); box-shadow:0 8px 0 0 #C84F08; transition:transform .15s,box-shadow .15s; width:100%; } .btn-cta:hover{ transform:translateY(-2px); box-shadow:0 10px 0 0 #C84F08; } .btn-cta:active{ transform:translateY(2px); box-shadow:0 4px 0 0 #C84F08; } 

.btn-cta #mission-countdown {
  font-family:'Baloo 2',sans-serif;
  font-size:2.2rem;
  font-weight:800;
  letter-spacing:1px;
  line-height:1;
}

.mission-timer{ display:flex; align-items:center; gap:10px; margin-top:18px; padding-top:18px; border-top:1px solid #F3E7D4; font-size:.88rem; color:var(--ink-soft); font-weight:700; } 
.mission-timer time{
    color:var(--orange-dark);
    font-family:'Baloo 2',sans-serif;
    font-size:1rem;
    font-weight:800;
    line-height:1;
    letter-spacing:.2px;
}
 /* SECTION GRID */ .section-grid{ max-width:1180px; margin:0 auto; padding:54px 32px 28px; display:grid; grid-template-columns:1.55fr 1fr; gap:24px; align-items:start; } .panel{ background:var(--card-bg); border-radius:var(--radius-lg); padding:30px; box-shadow:0 10px 26px -12px rgba(74,56,38,.12); } .panel-title{ display:flex; align-items:center; gap:10px; font-size:1.4rem; margin-bottom:20px; } .panel-title .emoji{ font-size:1.3rem; } .story-video{ position:relative; border-radius:var(--radius-md); overflow:hidden; aspect-ratio:16/8.3; margin-bottom:22px; background:#dff2f8; } .story-video svg{ width:100%; height:100%; display:block; } .play-btn{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:60px; height:60px; border-radius:50%; background:rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center; box-shadow:0 8px 20px rgba(0,0,0,.18); transition:transform .2s; } .story-video:hover .play-btn{ transform:translate(-50%,-50%) scale(1.08); } .play-btn::after{ content:''; width:0; height:0; border-top:11px solid transparent; border-bottom:11px solid transparent; border-left:16px solid var(--orange-dark); margin-left:4px; } .story-body h3{ font-size:1.3rem; margin-bottom:10px; } .story-body p{ color:var(--ink-soft); line-height:1.65; margin-bottom:18px; max-width:520px; } .guide-panel{ display:flex; flex-direction:column; align-items:center; text-align:center; justify-content:flex-end; position:relative; overflow:visible; padding-top:70px; min-height:410px; } .guide-character-wrap{ position:absolute; top:-54px; left:50%; transform:translateX(-50%); width:190px; z-index:2; } .guide-character-wrap .halo{ position:absolute; top:38px; left:50%; transform:translateX(-50%); width:150px; height:150px; border-radius:50%; background:radial-gradient(circle,var(--yellow-soft) 0%,transparent 72%); z-index:-1; } .guide-character{ width:100%; display:block; filter:drop-shadow(0 14px 14px rgba(74,56,38,.18)); } .guide-panel h3{ font-size:1.3rem; margin-bottom:8px; } .guide-panel p{ color:var(--ink-soft); line-height:1.55; margin-bottom:20px; font-size:.95rem; } .link-arrow{ display:inline-flex; align-items:center; gap:6px; font-weight:800; color:var(--orange-dark); border-bottom:2px solid transparent; transition:border-color .2s; } .link-arrow:hover{ border-color:var(--orange-dark); } /* THREE CARDS */ .cards-row{ max-width:1180px; margin:0 auto; padding:0 32px 28px; display:grid; grid-template-columns:1fr 1fr 1fr; gap:24px; } .task-card{ background:var(--card-bg); border-radius:var(--radius-lg); padding:26px; box-shadow:0 10px 26px -12px rgba(74,56,38,.12); display:flex; flex-direction:column; } .task-card .panel-title{ font-size:1.15rem; margin-bottom:18px; } .task-illustration{ width:100%; aspect-ratio:16/10; border-radius:var(--radius-sm); overflow:hidden; margin-bottom:18px; } .task-illustration svg{ width:100%; height:100%; display:block; } .task-card h4{ font-size:1.05rem; margin-bottom:8px; } .task-card p{ font-size:.9rem; color:var(--ink-soft); line-height:1.55; margin-bottom:18px; flex-grow:1; } .btn-secondary{ display:inline-flex; align-items:center; gap:6px; background:var(--yellow-soft); color:var(--orange-dark); font-weight:800; font-size:.9rem; padding:11px 20px; border-radius:var(--radius-pill); transition:background .2s,transform .2s; width:fit-content; } .btn-secondary:hover{ background:var(--yellow); transform:translateY(-2px); } .badges-illustration{ width:100%; aspect-ratio:16/10; border-radius:var(--radius-sm); overflow:hidden; margin-bottom:18px; background:linear-gradient(160deg,#FFE9C2 0%,#FFDFA3 100%); display:flex; align-items:center; justify-content:flex-start; padding-left:28px; position:relative; } .badges-illustration::before, .badges-illustration::after{ content:'✦'; position:absolute; color:#FFCB6B; font-size:1.1rem; opacity:.8; } .badges-illustration::before{ top:14px; left:18px; } .badges-illustration::after{ bottom:14px; right:22px; } .badges-row{ display:flex; gap:16px; } .badge-circle{ width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.5rem; box-shadow:0 6px 14px -4px rgba(0,0,0,.25),0 0 0 4px rgba(255,255,255,.6); } .badge-circle.gold{ background:linear-gradient(135deg,#FFD15C,#FFA53D); } .badge-circle.pink{ background:linear-gradient(135deg,#FF9FC4,#FF6FA0); } .badge-circle.teal{ background:linear-gradient(135deg,#5FD6C4,#2FB6A8); } /* DOUBLE CTA */ .double-cta{ max-width:1180px; margin:0 auto; padding:0 32px 60px; display:grid; grid-template-columns:1fr 1fr; gap:24px; } .cta-banner{ background:var(--card-bg); border-radius:var(--radius-lg); display:grid; grid-template-columns:1fr 1fr; overflow:hidden; box-shadow:0 10px 26px -12px rgba(74,56,38,.12); } .cta-banner-copy{ padding:30px; display:flex; flex-direction:column; } .cta-banner-copy .panel-title{ font-size:1.15rem; margin-bottom:10px; } .cta-banner-copy p{ font-size:.9rem; color:var(--ink-soft); line-height:1.55; margin-bottom:20px; flex-grow:1; } .cta-banner-img{ position:relative; min-height:200px; } .cta-banner-img svg{ width:100%; height:100%; display:block; } /* BIRTHDAY PAGE */
.bday-hero{ position:relative; max-width:900px; margin:0 auto; padding:70px 32px 50px; text-align:center; overflow:visible; }
.bday-hero-badge{ display:inline-flex; align-items:center; gap:8px; background:var(--pink-soft); color:#D9407A; font-weight:800; font-size:.85rem; padding:9px 18px; border-radius:var(--radius-pill); margin-bottom:22px; }
.bday-hero h1{ font-size:2.7rem; margin-bottom:20px; }
.bday-hero .lead{ font-size:1.1rem; color:var(--ink-soft); line-height:1.65; max-width:620px; margin:0 auto 34px; }
.bday-hero .lead strong{ color:var(--ink); }
.bday-hero-actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

.section-head{ max-width:720px; margin:0 auto 40px; text-align:center; padding:0 32px; }
.section-head .kicker{ display:inline-block; font-weight:800; color:var(--orange-dark); font-size:.85rem; letter-spacing:1px; text-transform:uppercase; margin-bottom:10px; }
.section-head h2{ font-size:2rem; }

.activity-grid{ max-width:1180px; margin:0 auto 70px; padding:0 32px; display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.activity-card{ background:var(--card-bg); border-radius:var(--radius-md); padding:26px 22px; box-shadow:0 10px 26px -12px rgba(74,56,38,.12); text-align:center; transition:transform .2s,box-shadow .2s; }
.activity-card:hover{ transform:translateY(-4px); box-shadow:0 16px 30px -12px rgba(74,56,38,.2); }
.activity-card .ic{ width:60px; height:60px; margin:0 auto 16px; border-radius:50%; background:var(--orange-soft); display:flex; align-items:center; justify-content:center; font-size:1.7rem; }
.activity-card h4{ font-size:1.05rem; margin-bottom:8px; }
.activity-card p{ font-size:.88rem; color:var(--ink-soft); line-height:1.5; }

.manifesto{ max-width:1180px; margin:0 auto 70px; padding:0 32px; }
.manifesto-inner{ background:linear-gradient(135deg,#F2660E 0%,#D9407A 100%); border-radius:var(--radius-lg); padding:60px 40px; text-align:center; color:#fff; box-shadow:var(--shadow-warm); }
.manifesto-inner .lead-line{ font-size:1.15rem; opacity:.92; max-width:560px; margin:0 auto 26px; line-height:1.6; }
.manifesto-words{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px 16px; max-width:640px; margin:0 auto 26px; }
.manifesto-words span{ font-family:'Baloo 2'; font-weight:800; font-size:1.6rem; }
.manifesto-words span:nth-child(2n){ color:#FFE49A; }
.manifesto-inner .close-line{ font-size:1.05rem; font-weight:700; opacity:.95; }

.timeline-section{ max-width:1180px; margin:0 auto 70px; padding:0 32px; }
.timeline{ max-width:680px; margin:0 auto; }
.timeline-step{ display:grid; grid-template-columns:64px 1fr; gap:20px; position:relative; padding-bottom:34px; }
.timeline-step:last-child{ padding-bottom:0; }
.timeline-step:not(:last-child)::before{ content:''; position:absolute; left:31px; top:64px; bottom:-2px; width:3px; background:var(--orange-soft); }
.timeline-icon{ width:64px; height:64px; border-radius:50%; background:linear-gradient(135deg,var(--orange) 0%,var(--orange-dark) 100%); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.6rem; box-shadow:var(--shadow-warm); z-index:1; flex-shrink:0; }
.timeline-content{ background:var(--card-bg); border-radius:var(--radius-md); padding:20px 24px; box-shadow:0 10px 26px -12px rgba(74,56,38,.12); }
.timeline-content h4{ font-size:1.1rem; margin-bottom:6px; }
.timeline-content p{ color:var(--ink-soft); font-size:.92rem; line-height:1.55; }

.bday-final-cta{ max-width:1180px; margin:0 auto 70px; padding:0 32px; }
.bday-final-cta-inner{ background:var(--card-bg); border-radius:var(--radius-lg); padding:56px 40px; text-align:center; box-shadow:0 10px 26px -12px rgba(74,56,38,.12); position:relative; overflow:hidden; }
.bday-final-cta-inner h2{ font-size:1.9rem; margin-bottom:14px; }
.bday-final-cta-inner p{ color:var(--ink-soft); max-width:480px; margin:0 auto 28px; line-height:1.6; }

.form-privacy-note{
  text-align:center;
  font-size:.72rem;
  line-height:1.4;
  color:var(--ink-soft);
  margin:2px 0 10px;
}

.form-privacy-note a{
  color:inherit;
  text-decoration:underline;
}


.contact-chips{ display:flex; justify-content:center; gap:14px; flex-wrap:wrap; margin-top:22px; }
.contact-chip{ display:inline-flex; align-items:center; gap:10px; background:var(--orange-soft); color:var(--orange-dark); font-weight:800; font-size:.92rem; padding:11px 20px; border-radius:var(--radius-pill); transition:background .2s,transform .2s; }
.contact-chip:hover{ background:var(--orange); color:#fff; transform:translateY(-2px); }

@media(max-width:1180px){ .activity-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:640px){ .bday-hero{ padding:44px 18px 36px; } .bday-hero h1{ font-size:2rem; } .activity-grid{ grid-template-columns:1fr; padding:0 18px; margin-bottom:50px; } .section-head{ padding:0 18px; } .manifesto, .timeline-section, .bday-final-cta{ padding:0 18px; margin-bottom:50px; } .manifesto-inner{ padding:40px 22px; } .manifesto-words span{ font-size:1.25rem; } .bday-final-cta-inner{ padding:40px 22px; } .timeline-step{ grid-template-columns:52px 1fr; gap:14px; } .timeline-icon{ width:52px; height:52px; font-size:1.3rem; } .timeline-step:not(:last-child)::before{ left:25px; top:52px; } }

/* FOOTER */ footer{ background:linear-gradient(135deg,var(--orange) 0%,var(--orange-dark) 100%); color:#fff; padding:44px 32px 0; overflow:hidden; } .footer-inner{ max-width:1180px; margin:0 auto; display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:32px; padding-bottom:30px; border-bottom:1px solid rgba(255,255,255,.25); } .footer-logo .logo-text .top{ color:#fff; } .footer-logo .logo-text .bottom{ color:#FFE8C2; } .footer-values{ display:flex; gap:30px; flex-wrap:wrap; } .footer-value{ display:flex; flex-direction:column; align-items:center; gap:8px; font-weight:700; font-size:.85rem; } .footer-value .ic{ width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.18); display:flex; align-items:center; justify-content:center; font-size:1.3rem; } .footer-social{ display:flex; flex-direction:column; align-items:flex-end; gap:12px; } .footer-social .label{ font-weight:800; font-family:'Baloo 2'; font-size:1.05rem; } .footer-contact{ display:flex; flex-direction:column; gap:10px; } .footer-contact a{ display:inline-flex; align-items:center; gap:10px; color:#fff; font-weight:700; font-size:.95rem; transition:opacity .2s; } .footer-contact a:hover{ opacity:.8; } .footer-contact .ic-round{ width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.18); display:flex; align-items:center; justify-content:center; font-size:1rem; flex-shrink:0; } .social-icons{ display:flex; gap:10px; } .social-icons a{ width:40px; height:40px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; transition:transform .2s,box-shadow .2s; box-shadow:0 4px 10px -2px rgba(0,0,0,.15); } .social-icons a:hover{ transform:translateY(-3px) scale(1.06); box-shadow:0 8px 16px -2px rgba(0,0,0,.22); } .social-icons a svg{ width:20px; height:20px; display:block; } .footer-bottom{ background:var(--cream-deep); margin:0 -32px; margin-top:30px; padding:20px 32px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; font-size:.85rem; color:var(--ink-soft); } .footer-bottom-inner{ max-width:1180px; margin:0 auto; width:100%; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; } .footer-links{ display:flex; gap:22px; flex-wrap:wrap; } .footer-links a{ color:var(--ink-soft); } .footer-links a:hover{ text-decoration:underline; color:var(--orange-dark); } /* RESPONSIVE */ @media(max-width:1180px){ .hero{ grid-template-columns:1fr 1fr; } .hero-stage{ grid-column:1/-1; order:-1; min-height:320px; } .section-grid, .cards-row, .double-cta{ grid-template-columns:1fr; } nav.main-nav{ display:none; } .menu-toggle{ display:flex; } } @media(max-width:640px){ .header-inner{ padding:14px 18px; gap:10px; } .logo{ min-width:0; flex-shrink:1; } .logo-text{ min-width:0; } .logo-text .bottom{ letter-spacing:1.2px; font-size:.52rem; white-space:normal; } .btn-portal{ padding:10px 14px; font-size:.85rem; gap:5px; } .hero, .section-grid, .cards-row, .double-cta{ padding-left:18px; padding-right:18px; } .hero{ grid-template-columns:1fr; padding-top:36px; } .hero-copy h1{ font-size:2rem; } .hero-stage{ min-height:290px; } .mission-card{ padding:24px 20px; } .cta-banner{ grid-template-columns:1fr; } .cta-banner-img{ order:-1; aspect-ratio:16/9; } footer{ padding:36px 18px 0; } .footer-bottom{ margin:0 -18px; margin-top:24px; padding:18px; } .footer-bottom-inner{ flex-direction:column; align-items:flex-start; gap:10px; } .footer-inner{ flex-direction:column; } .footer-social{ align-items:flex-start; } .footer-values{ gap:20px; } } 
 
 
 /* RUCH POSTACI PODCZAS MISJI */

.hero-character.mission-active {
  animation: mission-character 3.5s ease-in-out infinite;
  transform-origin: 50% 100%;
}

@keyframes mission-character {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }

  15% {
    transform: translateY(-8px) rotate(-2deg);
  }

  30% {
    transform: translateY(0) rotate(2deg);
  }

  45% {
    transform: translateY(-5px) rotate(-1deg);
  }

  60% {
    transform: translateY(0) rotate(0deg);
  }
}