:root { --red:#8f0d25; --red-dark:#590414; --red-bright:#c42642; --blue:#86bee0; --cream:#fff8ef; }
* { box-sizing:border-box; }
html { background:var(--red-dark); }
body { margin:0; color:var(--cream); font-family:Arial,Helvetica,sans-serif; }
.page-shell { position:relative; min-height:100svh; overflow:hidden; display:grid; place-items:start center; padding:34px 16px 48px; background:radial-gradient(circle at 50% -10%,rgba(255,255,255,.16),transparent 32%),linear-gradient(155deg,var(--red-bright) 0%,var(--red) 42%,var(--red-dark) 100%); }
.page-shell::before { content:""; position:fixed; inset:0; opacity:.12; pointer-events:none; background-image:repeating-linear-gradient(120deg,transparent 0 22px,rgba(255,255,255,.22) 23px,transparent 24px 48px); }
.glow { position:fixed; border-radius:50%; filter:blur(2px); opacity:.22; border:2px solid rgba(255,255,255,.5); }
.glow-one { width:340px; height:340px; top:-190px; right:-150px; }
.glow-two { width:240px; height:240px; bottom:-150px; left:-90px; }
.card { position:relative; z-index:1; width:min(100%,520px); text-align:center; }
.crest-wrap { width:146px; height:146px; margin:0 auto 18px; padding:7px; border-radius:50%; background:rgba(255,255,255,.95); box-shadow:0 18px 45px rgba(45,0,8,.35),0 0 0 4px rgba(255,255,255,.22); }
.crest { width:100%; height:100%; border-radius:50%; object-fit:cover; display:block; }
.eyebrow { margin:0 0 5px; font-size:12px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:#ffd9c2; }
h1 { margin:0; font-size:clamp(38px,11vw,58px); line-height:.95; letter-spacing:.055em; font-weight:950; text-shadow:0 3px 0 rgba(73,0,14,.35); }
.intro { margin:12px 0 22px; font-size:20px; font-weight:700; }
.links { display:grid; gap:11px; }
.social-link { min-height:72px; display:grid; grid-template-columns:48px 1fr 24px; align-items:center; gap:12px; padding:10px 15px 10px 12px; border:1px solid rgba(255,255,255,.6); border-radius:18px; color:var(--red-dark); text-align:left; text-decoration:none; background:rgba(255,248,239,.95); box-shadow:0 9px 22px rgba(46,0,8,.22); transition:transform .18s ease,box-shadow .18s ease,background .18s ease; }
.social-link:hover,.social-link:focus-visible { transform:translateY(-2px); background:#fff; box-shadow:0 13px 27px rgba(46,0,8,.3); outline:3px solid var(--blue); outline-offset:2px; }
.social-link:active { transform:scale(.985); }
.link-icon { width:48px; height:48px; display:grid; place-items:center; border-radius:14px; background:var(--red); color:#fff; font-size:21px; font-weight:900; }
.link-copy { display:grid; gap:3px; }
.link-copy strong { font-size:18px; line-height:1.1; }
.link-copy small { color:#865661; font-size:12px; }
.arrow { color:var(--red); font-size:21px; font-weight:800; }
.side-actions { position:fixed; z-index:2; top:50%; left:clamp(20px,4vw,68px); width:min(480px,36vw); transform:translateY(-50%); }
.join-promo { position:relative; overflow:hidden; display:flex; flex-direction:column; min-height:min(70vh,560px); padding:29px 27px 25px; color:#fff; text-align:left; text-decoration:none; background-image:linear-gradient(180deg,rgba(55,0,11,.84) 0%,rgba(87,3,19,.48) 31%,rgba(39,0,8,.06) 58%,rgba(46,0,9,.86) 100%),url("team-join.jpg?v=2"); background-position:center,center; background-size:cover; border:2px solid rgba(255,255,255,.76); border-radius:30px; box-shadow:0 24px 54px rgba(46,0,8,.42); transition:transform .18s ease,box-shadow .18s ease; }
.join-promo:hover,.join-promo:focus-visible { transform:translateY(-3px); box-shadow:0 29px 62px rgba(46,0,8,.5); outline:3px solid var(--blue); outline-offset:3px; }
.join-promo::after { content:""; position:absolute; inset:0; border-radius:28px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.2); pointer-events:none; }
.join-kicker { position:relative; z-index:1; display:inline-flex; align-items:center; align-self:flex-start; gap:7px; padding:7px 10px; color:#fff; font-size:11px; font-weight:900; letter-spacing:.055em; text-transform:uppercase; background:rgba(143,13,37,.86); border:1px solid rgba(255,255,255,.42); border-radius:999px; backdrop-filter:blur(5px); }
.join-promo h2 { position:relative; z-index:1; margin:17px 0 10px; color:#fff; font-size:clamp(30px,2.7vw,42px); line-height:1.02; letter-spacing:-.025em; text-shadow:0 3px 12px rgba(0,0,0,.7); }
.join-promo p { position:relative; z-index:1; margin:0; color:rgba(255,255,255,.92); font-size:14px; font-weight:700; line-height:1.45; text-shadow:0 2px 8px rgba(0,0,0,.8); }
.join-gift { position:relative; z-index:1; display:block; margin-top:auto; margin-bottom:12px; padding:11px 12px; color:#fff; font-size:13px; font-weight:900; text-align:center; background:rgba(89,4,20,.78); border:1px solid rgba(255,255,255,.55); border-radius:12px; backdrop-filter:blur(6px); }
.join-button { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; min-height:56px; padding:0 17px 0 19px; color:var(--red-dark); font-size:16px; font-weight:900; text-decoration:none; background:#fff8ef; border-radius:15px; box-shadow:0 10px 24px rgba(0,0,0,.26); transition:transform .18s ease,box-shadow .18s ease; }
.join-button span:last-child { font-size:23px; }
.about-actions { position:fixed; z-index:2; top:50%; right:clamp(20px,4vw,68px); width:min(480px,36vw); transform:translateY(-50%); }
.about-promo { position:relative; overflow:hidden; display:flex; flex-direction:column; min-height:min(70vh,560px); color:#fff; text-align:left; text-decoration:none; background-image:url("about-cover.jpg?v=3"); background-position:center top; background-size:cover; border:2px solid rgba(255,255,255,.64); border-radius:30px; box-shadow:0 24px 54px rgba(46,0,8,.42); transition:transform .18s ease,box-shadow .18s ease; }
.about-promo:hover,.about-promo:focus-visible { transform:translateY(-3px); box-shadow:0 29px 62px rgba(46,0,8,.5); outline:3px solid var(--blue); outline-offset:3px; }
.about-number { position:relative; z-index:1; align-self:flex-start; padding:7px 11px; font-size:11px; font-weight:900; letter-spacing:.12em; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.36); border-radius:999px; }
.about-button { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; min-height:56px; margin-top:auto; padding:0 18px; color:var(--red-dark); font-size:18px; font-weight:900; background:var(--cream); border-radius:15px; box-shadow:0 10px 24px rgba(0,0,0,.28); }
footer { margin-top:28px; }
footer img { width:54px; height:54px; object-fit:cover; border-radius:50%; opacity:.9; background:#fff; }
footer p { margin:8px 0 18px; font-size:13px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
footer small { display:block; max-width:450px; margin:0 auto; font-size:10px; line-height:1.45; color:rgba(255,255,255,.7); }
@media (max-width:390px) { .page-shell{padding-top:24px}.crest-wrap{width:124px;height:124px}.social-link{min-height:66px;border-radius:16px}.link-icon{width:44px;height:44px} }
@media (min-width:1051px) and (max-width:1460px) {
  .card { width:min(100%,460px); }
  .side-actions,.about-actions { width:min(340px,27vw); }
  .side-actions { left:20px; }
  .about-actions { right:20px; }
  .join-promo,.about-promo { min-height:min(68vh,540px); padding:23px 20px 21px; }
  .join-promo h2 { font-size:30px; }
  .about-copy strong { font-size:44px; }
}
@media (max-width:1050px) {
  .page-shell { align-content:start; }
  .card { left:auto; order:1; }
  .side-actions,.about-actions { position:relative; top:auto; right:auto; left:auto; width:min(100%,520px); margin-top:18px; transform:none; }
  .side-actions { order:2; }
  .about-actions { order:3; }
  .join-promo { min-height:560px; padding:23px; background-position:center,54% 48%; }
  .about-promo { min-height:420px; }
  .join-promo h2 { font-size:30px; }
}
@media (prefers-reduced-motion:reduce) { .social-link{transition:none} }

.info-shell { min-height:100svh; padding:24px 14px 48px; background:linear-gradient(155deg,var(--red-bright),var(--red) 42%,var(--red-dark)); }
.info-card { width:min(100%,760px); margin:0 auto; padding:24px clamp(18px,5vw,44px) 34px; color:var(--red-dark); background:rgba(255,248,239,.98); border-radius:26px; box-shadow:0 20px 55px rgba(45,0,8,.35); }
.back-link { display:inline-block; margin-bottom:18px; color:var(--red); font-weight:800; text-decoration:none; }
.info-logo { display:block; width:94px; height:94px; margin:0 auto 14px; object-fit:cover; border-radius:50%; box-shadow:0 8px 25px rgba(45,0,8,.22); }
.info-card .eyebrow { color:var(--red); text-align:center; }
.info-title { margin:6px auto 24px; color:var(--red-dark); font-size:clamp(32px,8vw,52px); line-height:1; text-align:center; text-shadow:none; }
.lead-block { padding:22px; color:#fff; background:var(--red); border-radius:20px; }
.lead-block h2 { margin:0 0 12px; font-size:clamp(22px,5vw,30px); }
.lead-block p:last-child { margin-bottom:0; }
.info-section { margin-top:30px; }
.info-section h2 { margin:0 0 14px; font-size:25px; color:var(--red); }
.info-section p,.lead-block p,.notice,.closing { line-height:1.6; }
.check-list { display:grid; gap:10px; padding:0; list-style:none; }
.check-list li { position:relative; padding:13px 14px 13px 44px; background:#fff; border-radius:14px; box-shadow:0 5px 16px rgba(89,4,20,.09); }
.check-list li::before { content:"✓"; position:absolute; left:16px; color:var(--red); font-weight:900; }
.schedule-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.schedule-card { display:grid; gap:7px; padding:18px; background:#fff; border-left:5px solid var(--red); border-radius:14px; box-shadow:0 5px 16px rgba(89,4,20,.09); }
.schedule-card span { color:#865661; }
.action-list { display:grid; gap:10px; }
.action-button { display:grid; grid-template-columns:40px 1fr 22px; align-items:center; gap:10px; padding:14px; color:#fff; background:var(--red); border-radius:14px; text-decoration:none; }
.action-button span { display:grid; place-items:center; width:40px; height:40px; background:rgba(255,255,255,.16); border-radius:11px; }
.action-button b { font-size:20px; }
.notice { margin-top:28px; padding:18px; background:#ffe3b8; border-radius:16px; }
.notice strong { color:var(--red); }
.closing { margin:28px 0 18px; font-size:19px; font-weight:800; text-align:center; }
.back-button { display:block; padding:15px; color:var(--red-dark); font-weight:800; text-align:center; text-decoration:none; border:2px solid var(--red); border-radius:14px; }
.about-page { max-width:680px; }
.story-gallery { margin:12px auto 28px; }
.story-stage { position:relative; display:grid; place-items:center; }
.story-track { display:flex; width:min(100%,430px); overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; border-radius:24px; box-shadow:0 18px 42px rgba(45,0,8,.28); }
.story-track::-webkit-scrollbar { display:none; }
.story-slide { flex:0 0 100%; margin:0; scroll-snap-align:center; background:#4d0311; }
.story-slide img { display:block; width:100%; height:auto; aspect-ratio:9/16; object-fit:cover; }
.story-arrow { position:absolute; z-index:2; top:50%; width:48px; height:48px; padding:0; color:#fff; font-size:38px; line-height:1; background:rgba(89,4,20,.88); border:2px solid rgba(255,255,255,.75); border-radius:50%; box-shadow:0 8px 20px rgba(45,0,8,.28); cursor:pointer; transform:translateY(-50%); }
.story-prev { left:0; }
.story-next { right:0; }
.story-controls { display:flex; align-items:center; justify-content:center; gap:14px; margin-top:17px; }
.story-counter { min-width:48px; color:var(--red); font-weight:900; }
.story-dots { display:flex; gap:7px; }
.story-dot { width:9px; height:9px; padding:0; background:#d6aab2; border:0; border-radius:50%; cursor:pointer; }
.story-dot.is-active { background:var(--red); transform:scale(1.35); }
.story-hint { margin:12px 0 0; color:#865661; font-size:13px; text-align:center; }
@media (max-width:600px) { .story-arrow{width:42px;height:42px}.story-prev{left:-5px}.story-next{right:-5px} }
@media (max-width:600px) { .info-shell{padding:0}.info-card{min-height:100svh;border-radius:0}.schedule-grid{grid-template-columns:1fr}.action-button strong{font-size:14px} }
