:root { --blue:#087bc1; --cyan:#24b8dd; --navy:#0b2740; --pale:#eef8fc; --line:#d9e4ea; --muted:#607383; --content:1280px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#fff; color:var(--navy); font-family:"Helvetica Neue","Noto Sans JP",Arial,sans-serif; }
img { max-width:100%; }
a { color:inherit; text-decoration:none; }
.site-header { height:86px; display:flex; align-items:center; justify-content:space-between; padding:0 max(5vw,calc((100vw - var(--content))/2)); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20; background:rgba(255,255,255,.96); backdrop-filter:blur(10px); }
.brand { display:flex; align-items:center; }
.brand img { width:220px; height:58px; object-fit:contain; object-position:left center; }
nav { display:flex; align-items:center; gap:30px; font-size:12px; font-weight:700; letter-spacing:.11em; }
nav a { padding:34px 0 30px; border-bottom:3px solid transparent; }
nav a:hover { color:var(--blue); border-color:var(--cyan); }
.shop-link { color:var(--blue); }

.hero { min-height:720px; display:grid; grid-template-columns:1fr 1.08fr; padding:66px max(5vw,calc((100vw - var(--content))/2)) 58px; gap:clamp(38px,6vw,90px); align-items:center; overflow:hidden; }
.hero-copy { position:relative; z-index:2; text-align:center; }
.eyebrow { margin:0 0 21px; color:var(--blue); font-size:12px; font-weight:800; letter-spacing:.18em; }
h1 { margin:0; font-size:clamp(38px,4.5vw,66px); line-height:1.15; letter-spacing:-.045em; }
.hero-lead { max-width:650px; margin:26px auto 30px; font-size:16px; line-height:1.95; color:var(--muted); }
.hero-actions { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; }
.button { min-height:53px; padding:0 27px; display:inline-flex; align-items:center; justify-content:center; font-size:13px; font-weight:800; letter-spacing:.05em; transition:.2s ease; }
.button:hover { transform:translateY(-2px); }
.primary { background:var(--blue); color:#fff; }
.secondary { border:1px solid var(--line); background:#fff; }
.hero-roster { position:relative; min-height:0; aspect-ratio:16/9; overflow:hidden; background:var(--navy); border:1px solid var(--line); }
.hero-brand-panel { display:flex; align-items:center; justify-content:center; padding:clamp(34px,5.5vw,78px); background:linear-gradient(145deg,#fbfdff 0%,#edf8fc 55%,#dff2f9 100%); }
.hero-brand-panel:before { content:""; position:absolute; inset:0; opacity:.58; background-image:linear-gradient(rgba(8,123,193,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(8,123,193,.09) 1px,transparent 1px); background-size:64px 64px; }
.hero-brand-panel:after { content:""; position:absolute; right:-18%; bottom:-54%; width:72%; aspect-ratio:1; border-radius:50%; background:rgba(8,123,193,.08); }
.hero-panel-logo { position:relative; z-index:2; display:block; width:min(88%,720px); height:auto; object-fit:contain; }
.hero-panel-meta { position:absolute; z-index:3; right:28px; top:25px; color:var(--navy); text-align:right; }
.hero-panel-meta span { display:block; margin-bottom:6px; color:var(--blue); font-size:10px; font-weight:800; letter-spacing:.18em; }
.hero-panel-meta strong { font-size:19px; letter-spacing:.08em; }

.stats { display:grid; grid-template-columns:repeat(4,1fr); width:min(calc(100% - 10vw),var(--content)); margin:0 auto; border:1px solid var(--line); }
.stats div { padding:30px; border-right:1px solid var(--line); display:flex; flex-direction:column; gap:8px; }
.stats div:last-child { border-right:0; }
.stats strong { font-size:24px; letter-spacing:-.03em; }
.stats .small { font-size:10px; margin-left:5px; letter-spacing:.08em; }
.stats span:last-child { color:var(--muted); font-size:10px; font-weight:800; letter-spacing:.15em; }
.section { padding:120px max(5vw,calc((100vw - var(--content))/2)); }
.about { display:grid; grid-template-columns:1fr 1fr; gap:11vw; background:var(--pale); margin-top:90px; }
h2 { margin:0; font-size:clamp(34px,4vw,54px); line-height:1.28; letter-spacing:-.035em; }
.about-copy { padding-top:34px; }
.about-copy p { margin:0 0 22px; color:var(--muted); line-height:2.05; }
.text-link { display:inline-block; margin-top:15px; color:var(--blue); font-size:13px; font-weight:800; }
.section-topline { display:flex; justify-content:space-between; gap:60px; align-items:flex-end; margin-bottom:70px; }
.section-topline>p { max-width:430px; margin:0; color:var(--muted); line-height:1.8; }

.members { padding-bottom:80px; }
.division-accordions { display:grid; gap:22px; }
.division-accordion { border:1px solid var(--line); background:#fff; }
.division-accordion summary { display:grid; grid-template-columns:minmax(360px,45%) 1fr; min-height:250px; cursor:pointer; list-style:none; transition:.2s ease; }
.division-accordion summary::-webkit-details-marker { display:none; }
.division-accordion summary:hover { background:#f8fbfc; }
.division-summary-art { position:relative; min-width:0; overflow:hidden; background:var(--navy); }
.division-summary-art>img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.portrait-strip { display:flex; align-items:stretch; background:linear-gradient(135deg,#e8f7fb,#d5edf7); }
.portrait-strip img { display:block; width:25%; height:100%; object-fit:cover; object-position:center; }
.streamer-art { background:linear-gradient(135deg,#f6edf6,#dff5fb); }
.streamer-art img { width:33.333%; object-fit:contain; object-position:center bottom; }
.division-summary-copy { position:relative; padding:42px 74px 42px 42px; display:flex; flex-direction:column; justify-content:center; }
.division-summary-copy>span { color:var(--blue); font-size:10px; font-weight:800; letter-spacing:.18em; }
.division-summary-copy h3 { margin:12px 0 14px; font-size:clamp(26px,3vw,42px); line-height:1.15; letter-spacing:.02em; }
.division-summary-copy p { margin:0; color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.15em; }
.division-summary-copy b { position:absolute; right:30px; top:50%; translate:0 -50%; color:var(--blue); font-size:34px; font-weight:300; transition:.2s ease; }
.division-accordion[open] .division-summary-copy b { rotate:45deg; }
.division-members { padding:34px; border-top:1px solid var(--line); background:#f8fafb; }
.division-feature { max-width:1120px; margin:0 auto 28px; aspect-ratio:16/9; overflow:hidden; border:1px solid var(--line); background:var(--navy); }
.division-feature img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.member-grid { display:grid; gap:18px; }
.member-grid.five { grid-template-columns:repeat(5,1fr); }
.member-grid.four { grid-template-columns:repeat(4,1fr); }
.member-grid.three { grid-template-columns:repeat(3,1fr); max-width:1120px; margin-inline:auto; }
.member-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:780px; margin-inline:auto; }
.member-grid.one { grid-template-columns:minmax(260px,360px); justify-content:center; }
.member-card { min-width:0; border:1px solid var(--line); background:#fff; transition:.22s ease; }
.member-card:hover { transform:translateY(-4px); border-color:#a8d5e9; box-shadow:0 18px 36px rgba(8,52,80,.09); }
.member-photo { position:relative; width:100%; height:auto; aspect-ratio:1/1; overflow:hidden; display:flex; align-items:flex-end; justify-content:center; background:linear-gradient(145deg,#f9fcfd 35%,#e7f5fa); }
.member-photo:after { content:""; position:absolute; inset:auto 0 0; height:22%; background:linear-gradient(transparent,rgba(8,123,193,.06)); pointer-events:none; }
.member-photo img { width:100%; height:100%; object-fit:contain; object-position:center bottom; display:block; }
.member-photo.photo-cover img { object-fit:cover; object-position:center; }
.member-info { min-height:91px; padding:20px 21px 23px; border-top:1px solid var(--line); display:flex; flex-direction:column; justify-content:center; }
.member-info span { color:var(--blue); font-size:10px; font-weight:800; letter-spacing:.17em; }
.member-info h4 { margin:7px 0 0; font-size:21px; letter-spacing:.02em; }
.member-info small { margin-top:12px; color:var(--muted); font-size:9px; font-weight:800; letter-spacing:.15em; }
.roster-note { margin:28px 0 0; color:var(--muted); font-size:12px; }

.profile-main { min-height:calc(100vh - 86px); }
.profile-hero { min-height:720px; padding:72px max(5vw,calc((100vw - var(--content))/2)); display:grid; grid-template-columns:minmax(320px,.85fr) 1.15fr; align-items:center; gap:clamp(50px,8vw,120px); background:linear-gradient(135deg,#f7fbfd,var(--pale)); }
.profile-portrait { position:relative; width:min(100%,520px); aspect-ratio:4/5; justify-self:center; display:flex; align-items:flex-end; justify-content:center; overflow:hidden; border:1px solid var(--line); background:#fff; }
.profile-portrait:before { content:""; position:absolute; inset:0; opacity:.65; background-image:linear-gradient(rgba(8,123,193,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(8,123,193,.08) 1px,transparent 1px); background-size:42px 42px; }
.profile-portrait img { position:relative; z-index:1; width:100%; height:100%; object-fit:contain; object-position:center bottom; }
.profile-copy { max-width:680px; }
.profile-breadcrumb { margin:0 0 25px; color:var(--blue); font-size:11px; font-weight:800; letter-spacing:.15em; }
.profile-role { display:inline-block; margin-bottom:13px; padding:8px 12px; background:var(--navy); color:#fff; font-size:10px; font-weight:800; letter-spacing:.15em; }
.profile-copy h1 { font-size:clamp(52px,7vw,96px); letter-spacing:-.045em; }
.profile-intro { max-width:600px; margin:25px 0 32px; color:var(--muted); line-height:1.9; }
.profile-meta { display:grid; grid-template-columns:1fr 1fr; margin:0 0 32px; border:1px solid var(--line); background:#fff; }
.profile-meta div { padding:20px; }
.profile-meta div+div { border-left:1px solid var(--line); }
.profile-meta dt { margin-bottom:8px; color:var(--blue); font-size:9px; font-weight:800; letter-spacing:.17em; }
.profile-meta dd { margin:0; font-size:15px; font-weight:800; }
.profile-social-links { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:10px; margin:0 0 28px; }
.profile-social-links a { min-width:0; padding:14px 15px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:12px; border:1px solid var(--line); background:rgba(255,255,255,.86); color:var(--navy); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.profile-social-links a:hover { transform:translateY(-2px); border-color:#9ccfe3; box-shadow:0 12px 26px rgba(8,52,80,.08); }
.profile-social-links .social-platform { color:var(--blue); font-family:Consolas,"SFMono-Regular",monospace; font-size:9px; font-weight:800; letter-spacing:.13em; }
.profile-social-links .social-account { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:800; }
.profile-social-links .social-arrow { color:#7a94a5; font-size:13px; }
.profile-links { display:flex; gap:12px; flex-wrap:wrap; }
.profile-note { padding:80px max(5vw,calc((100vw - var(--content))/2)); text-align:center; }
.profile-note p { margin:18px auto 30px; max-width:680px; color:var(--muted); line-height:1.9; }
.vtuber-profile .profile-hero { background:linear-gradient(135deg,#fbf8fc 0%,#f3f3fb 46%,#eaf6fb 100%); }
.vtuber-profile .profile-portrait { border-color:#d8c5df; background:linear-gradient(145deg,#fff,#f5edf8); }
.vtuber-profile .profile-portrait:before { background-image:linear-gradient(rgba(129,45,127,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(129,45,127,.07) 1px,transparent 1px); }
.vtuber-profile .profile-role { background:#562457; }
.profile-visuals { padding:90px max(5vw,calc((100vw - var(--content))/2)); background:#081f32; color:#fff; }
.profile-visuals-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; margin-bottom:42px; }
.profile-visuals-heading .eyebrow { margin-bottom:12px; color:#c784d2; }
.profile-visuals-heading h2 { font-size:clamp(34px,4vw,56px); }
.profile-social { margin:0; color:#a8bfd0; font-family:Consolas,"SFMono-Regular",monospace; font-size:11px; font-weight:700; letter-spacing:.12em; }
.profile-media-grid { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(260px,.7fr); gap:22px; }
.profile-media-card { min-width:0; margin:0; overflow:hidden; border:1px solid rgba(255,255,255,.15); background:#102b41; }
.profile-media-card img { display:block; width:100%; height:100%; object-fit:contain; }
.profile-media-card.main-visual { aspect-ratio:16/9; background:#fff; }
.profile-media-card.name-logo { display:flex; flex-direction:column; align-items:center; justify-content:center; aspect-ratio:1/1; padding:34px; background:radial-gradient(circle at 50% 45%,#263c59,#071a2a 68%); }
.profile-media-card.name-logo img { width:100%; height:auto; max-height:calc(100% - 42px); object-fit:contain; }
.profile-media-card figcaption { padding:13px 16px; color:#9eb4c4; font-size:9px; font-weight:700; letter-spacing:.13em; }
.profile-media-card.main-visual figcaption { display:none; }
.profile-media-grid.single { grid-template-columns:minmax(0,1fr); max-width:1180px; margin-inline:auto; }
.profile-media-card.key-visual { background:#111; }
.profile-media-card.key-visual img { width:100%; height:auto; object-fit:contain; }
.itaru-profile .profile-hero { background:linear-gradient(135deg,#fff 0%,#fbf3f3 48%,#edf5f8 100%); }
.itaru-profile .profile-portrait { border-color:#e1c0c2; background:linear-gradient(145deg,#fff,#f9eeee); }
.itaru-profile .profile-portrait:before { background-image:linear-gradient(rgba(176,24,35,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(176,24,35,.07) 1px,transparent 1px); }
.itaru-profile .profile-role { background:#8d1621; }
.itaru-profile .profile-visuals { background:linear-gradient(135deg,#160b0d,#081f32 72%); }
.itaru-profile .profile-visuals-heading .eyebrow { color:#ff7b83; }

.sponsors { border-top:1px solid var(--line); background:var(--pale); }
.sponsor-heading { max-width:760px; margin:0 auto 58px; text-align:center; }
.sponsor-heading .eyebrow { margin-bottom:16px; }
.sponsor-heading>p:last-child { margin:20px 0 0; color:var(--muted); line-height:1.8; }
.sponsor-grid { display:flex; flex-wrap:wrap; justify-content:center; gap:16px; width:min(100%,var(--content)); margin:0 auto; }
.sponsor-card { flex:0 1 calc((100% - 64px)/5); min-width:180px; min-height:190px; padding:30px 22px 22px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; text-align:center; background:#fff; border:1px solid var(--line); }
.sponsor-card img { display:block; width:100%; height:82px; max-width:210px; object-fit:contain; object-position:center; margin:auto; }
.sponsor-card.moma img { height:76px; background:#000; }
.sponsor-card p { min-height:16px; margin:0; color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.08em; }
.sponsor-note { margin:25px 0 0; text-align:center; color:var(--muted); font-size:11px; }

.achievements { background:#f8fafb; }
.achievement-list { border-top:1px solid var(--line); }
.achievement-list .achievement-row { display:grid; grid-template-columns:90px 1.2fr 1fr 40px; gap:25px; align-items:center; padding:29px 8px; border-bottom:1px solid var(--line); transition:.2s ease; }
.achievement-list .achievement-row:hover { padding-left:18px; background:#fff; }
.achievement-list .year { color:var(--blue); font-weight:800; }
.achievement-list h3 { margin:0; font-size:19px; }
.achievement-list p { margin:0; color:var(--muted); }
.arrow { color:var(--blue); font-size:22px; }
.shop-banner { width:min(calc(100% - 10vw),var(--content)); margin:90px auto; padding:65px 6vw; display:flex; align-items:center; justify-content:space-between; gap:40px; color:#fff; background:linear-gradient(115deg,#076fb0,#23acd0); }
.shop-banner .eyebrow { color:#c9f4ff; }
.shop-banner h2 { font-size:clamp(28px,3vw,42px); }
.button.white { background:#fff; color:var(--blue); white-space:nowrap; }
.contact { display:grid; grid-template-columns:.9fr 1.1fr; gap:10vw; }
.contact-box { border-top:4px solid var(--blue); padding:35px 0; }
.contact-box>p { color:var(--muted); line-height:1.9; }
.contact-box ul { list-style:none; padding:0; margin:30px 0; border-top:1px solid var(--line); }
.contact-box li { padding:16px 5px; border-bottom:1px solid var(--line); }
.company-details { margin-top:26px; color:var(--muted); font-size:13px; line-height:1.7; }
.company-details p { margin:4px 0; }
.active-site-card { position:relative; display:block; margin-top:30px; aspect-ratio:3/1; overflow:hidden; background:var(--navy); border:1px solid var(--line); }
.active-site-card:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,20,34,.9) 0%,rgba(3,20,34,.35) 58%,rgba(3,20,34,.1) 100%); transition:.25s ease; }
.active-site-card img { display:block; width:100%; height:100%; object-fit:cover; transition:.35s ease; }
.active-site-label { position:absolute; z-index:2; left:24px; right:24px; bottom:22px; display:grid; grid-template-columns:1fr auto; align-items:end; gap:6px 20px; color:#fff; }
.active-site-label small { grid-column:1/-1; color:#bdefff; font-size:9px; font-weight:800; letter-spacing:.19em; }
.active-site-label strong { font-size:17px; letter-spacing:.03em; }
.active-site-label b { color:#bdefff; font-size:10px; letter-spacing:.1em; }
.active-site-card:hover img { transform:scale(1.025); }
.active-site-card:hover:after { background:linear-gradient(90deg,rgba(3,20,34,.83) 0%,rgba(3,20,34,.27) 58%,rgba(3,20,34,.06) 100%); }
.trademark-note { display:flex; align-items:flex-start; gap:8px; margin:18px 0 0; color:var(--muted); font-size:11px; line-height:1.7; }
.trademark-note span { flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:21px; height:21px; border:1px solid var(--blue); border-radius:50%; color:var(--blue); font-size:11px; font-weight:800; }
footer { min-height:180px; background:var(--navy); color:#fff; padding:45px max(5vw,calc((100vw - var(--content))/2)); display:grid; grid-template-columns:1fr auto auto; gap:50px; align-items:center; }
footer p { color:#b7c7d3; font-size:12px; }
.footer-brand img { filter:brightness(0) invert(1); max-width:210px; }

@media (max-width:1100px) {
  .member-grid.five { grid-template-columns:repeat(3,1fr); }
  .member-grid.four { grid-template-columns:repeat(2,1fr); }
  .sponsor-card { flex-basis:calc((100% - 32px)/3); }
}
@media (max-width:900px) {
  .site-header { height:72px; } nav { display:none; }
  .hero { grid-template-columns:1fr; padding-top:55px; }
  .hero-roster { min-height:0; }
  .stats { grid-template-columns:1fr 1fr; }
  .stats div:nth-child(2) { border-right:0; } .stats div:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .about,.contact { grid-template-columns:1fr; gap:40px; }
  .section { padding:85px 5vw; }
  .section-topline { align-items:flex-start; flex-direction:column; gap:20px; }
  .member-grid.three { grid-template-columns:repeat(2,1fr); }
  .division-accordion summary { grid-template-columns:1fr; }
  .division-summary-art { min-height:220px; }
  .profile-hero { grid-template-columns:1fr; gap:45px; }
  .sponsor-card { flex-basis:calc((100% - 16px)/2); }
  .achievement-list .achievement-row { grid-template-columns:65px 1fr 25px; }
  .achievement-list p { grid-column:2; }
  .shop-banner { align-items:flex-start; flex-direction:column; }
  footer { grid-template-columns:1fr; gap:15px; }
  .profile-visuals-heading { align-items:flex-start; flex-direction:column; }
  .profile-media-grid { grid-template-columns:1fr; }
  .profile-media-card.name-logo { max-width:520px; width:100%; justify-self:center; }
}
@media (max-width:560px) {
  .brand img { width:175px; }
  .hero { min-height:auto; padding-left:0; padding-right:0; }
  .hero-copy { padding:0 5vw; }
  h1 { font-size:39px; }
  .hero-roster { min-height:0; border-left:0; border-right:0; }
  .hero-brand-panel { padding:34px; }
  .hero-panel-meta { top:18px; right:20px; }
  .hero-panel-meta strong { font-size:15px; }
  .active-site-card { aspect-ratio:16/7; }
  .active-site-label { left:18px; right:18px; bottom:16px; grid-template-columns:1fr; }
  .active-site-label b { margin-top:3px; }
  .stats { width:100%; margin:0 auto; border-left:0; border-right:0; }
  .stats div { padding:22px 5vw; }
  .about { margin-top:60px; }
  .division-summary-art { min-height:180px; }
  .division-summary-copy { padding:26px 60px 26px 24px; }
  .division-summary-copy b { right:20px; }
  .division-members { padding:18px; }
  .member-grid.five,.member-grid.four,.member-grid.three,.member-grid.two { grid-template-columns:1fr 1fr; gap:10px; }
  .member-info { padding:15px; }
  .member-info h4 { font-size:16px; }
  .achievement-list .achievement-row { grid-template-columns:58px 1fr 20px; gap:10px; }
  .achievement-list h3 { font-size:16px; }
  .achievement-list p { font-size:13px; }
  .shop-banner { width:100%; margin:50px auto; padding:55px 5vw; }
  .profile-hero { padding:45px 5vw 60px; }
  .profile-portrait { max-width:420px; }
  .profile-copy h1 { font-size:52px; }
}
@media (max-width:380px) {
  .member-grid.five,.member-grid.four,.member-grid.three,.member-grid.two,.member-grid.one { grid-template-columns:1fr; }
  .sponsor-card { flex-basis:100%; }
}

/* Precision-tech layer: restrained motion and technical detail on the existing white/blue identity. */
body { background:#fcfeff; }
.scroll-progress { --progress:0%; position:fixed; z-index:50; top:0; left:0; width:var(--progress); height:2px; pointer-events:none; background:linear-gradient(90deg,var(--blue),var(--cyan)); box-shadow:0 0 10px rgba(36,184,221,.32); }
.site-header { border-bottom-color:#cfdee6; box-shadow:0 8px 32px rgba(13,49,74,.035); }
.site-header:after { content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px; background:linear-gradient(90deg,transparent 0%,rgba(8,123,193,.45) 35%,rgba(36,184,221,.7) 50%,rgba(8,123,193,.45) 65%,transparent 100%); transform:scaleX(.3); transform-origin:center; transition:.45s ease; }
.site-header:hover:after { transform:scaleX(1); }
.tech-status { min-height:34px; padding:0 max(5vw,calc((100vw - var(--content))/2)); display:flex; align-items:center; justify-content:space-between; gap:24px; overflow:hidden; white-space:nowrap; border-bottom:1px solid var(--line); background:#f6fafc; color:#6d8190; font-family:Consolas,"SFMono-Regular",monospace; font-size:9px; font-weight:700; letter-spacing:.13em; }
.tech-status span { display:flex; align-items:center; gap:8px; }
.tech-status i { width:6px; height:6px; border-radius:50%; background:#20a776; box-shadow:0 0 0 4px rgba(32,167,118,.1); animation:statusPulse 2.4s ease-in-out infinite; }
.hero { position:relative; min-height:700px; background:radial-gradient(circle at 12% 15%,rgba(36,184,221,.055),transparent 28%),linear-gradient(180deg,#fff 0%,#fbfdfe 100%); }
.hero:before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.27; background-image:linear-gradient(rgba(8,123,193,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(8,123,193,.06) 1px,transparent 1px); background-size:80px 80px; mask-image:linear-gradient(90deg,#000,transparent 48%); }
.hero-copy { animation:heroEnter .85s cubic-bezier(.2,.7,.2,1) both; }
.hero-copy h1 { text-shadow:0 1px 0 #fff; }
.eyebrow { display:flex; align-items:center; gap:10px; font-family:Consolas,"SFMono-Regular",monospace; }
.eyebrow:before { content:""; width:24px; height:1px; background:linear-gradient(90deg,var(--blue),var(--cyan)); box-shadow:7px -4px 0 -3px var(--cyan); }
.hero-copy .eyebrow,.sponsor-heading .eyebrow { justify-content:center; }
.hero-brand-panel { isolation:isolate; border-color:#bdd7e4; box-shadow:0 30px 70px rgba(14,66,96,.12),inset 0 0 0 8px rgba(255,255,255,.7); animation:panelEnter 1s .12s cubic-bezier(.2,.7,.2,1) both; }
.hero-brand-panel:before { opacity:.72; background-size:48px 48px; }
.hero-brand-panel:after { right:-8%; bottom:-72%; width:90%; border:1px solid rgba(8,123,193,.18); background:radial-gradient(circle,rgba(36,184,221,.1),rgba(8,123,193,.02) 55%,transparent 56%); }
.hero-panel-logo { z-index:4; filter:drop-shadow(0 16px 28px rgba(5,56,88,.12)); }
.hero-panel-meta { z-index:5; }
.hero-orbit { position:absolute; z-index:1; left:50%; top:50%; width:78%; aspect-ratio:1; translate:-50% -50%; border:1px solid rgba(8,123,193,.18); border-radius:50%; animation:orbitSpin 26s linear infinite; }
.hero-orbit:before,.hero-orbit:after,.hero-orbit i { content:""; position:absolute; border-radius:50%; border:1px solid rgba(8,123,193,.13); }
.hero-orbit:before { inset:12%; border-style:dashed; }
.hero-orbit:after { inset:27%; border-color:rgba(36,184,221,.22); }
.hero-orbit i:nth-child(1) { width:8px; height:8px; top:9%; left:25%; border:0; background:var(--blue); box-shadow:0 0 0 5px rgba(8,123,193,.09); }
.hero-orbit i:nth-child(2) { width:5px; height:5px; right:8%; top:53%; border:0; background:var(--cyan); }
.hero-orbit i:nth-child(3) { inset:38%; border-color:rgba(8,123,193,.22); }
.hero-scan { position:absolute; z-index:3; left:8%; right:8%; top:-2px; height:1px; opacity:.7; background:linear-gradient(90deg,transparent,var(--cyan),transparent); box-shadow:0 7px 18px rgba(36,184,221,.2); animation:scanPanel 6s ease-in-out infinite; }
.tech-corner { position:absolute; z-index:5; width:22px; height:22px; pointer-events:none; }
.corner-tl { top:14px; left:14px; border-top:2px solid var(--blue); border-left:2px solid var(--blue); }
.corner-tr { top:14px; right:14px; border-top:2px solid var(--blue); border-right:2px solid var(--blue); }
.corner-bl { bottom:14px; left:14px; border-bottom:2px solid var(--blue); border-left:2px solid var(--blue); }
.corner-br { right:14px; bottom:14px; border-right:2px solid var(--blue); border-bottom:2px solid var(--blue); }
.button { position:relative; overflow:hidden; }
.button:after { content:""; position:absolute; inset:0; translate:-115% 0; background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.32) 50%,transparent 65%); transition:translate .55s ease; }
.button:hover:after { translate:115% 0; }
.primary { box-shadow:0 12px 25px rgba(8,123,193,.16); }
.stats { position:relative; background:rgba(255,255,255,.92); box-shadow:0 20px 50px rgba(12,53,78,.055); }
.stats:before { content:"DATA / TEAM METRICS"; position:absolute; left:14px; top:-23px; color:#7a8d9a; font-family:Consolas,"SFMono-Regular",monospace; font-size:8px; font-weight:700; letter-spacing:.16em; }
.stats div { position:relative; overflow:hidden; }
.stats div:after { content:""; position:absolute; left:0; bottom:0; width:0; height:2px; background:linear-gradient(90deg,var(--blue),var(--cyan)); transition:width .45s ease; }
.stats div:hover:after { width:100%; }
.section { position:relative; overflow:hidden; }
.section:before { content:attr(data-index); position:absolute; right:max(3vw,calc((100vw - var(--content))/2 - 30px)); top:52px; color:rgba(8,123,193,.045); font-family:Consolas,"SFMono-Regular",monospace; font-size:clamp(92px,14vw,190px); font-weight:800; line-height:1; letter-spacing:-.08em; pointer-events:none; }
.section>* { position:relative; z-index:1; }
.about { background-color:#eef8fc; background-image:linear-gradient(rgba(8,123,193,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(8,123,193,.045) 1px,transparent 1px); background-size:64px 64px; }
.division-accordion { position:relative; box-shadow:0 12px 35px rgba(10,52,78,.035); }
.division-accordion:before { content:""; position:absolute; z-index:2; left:-1px; top:-1px; width:3px; height:0; background:linear-gradient(var(--cyan),var(--blue)); transition:height .4s ease; }
.division-accordion:hover:before,.division-accordion[open]:before { height:calc(100% + 2px); }
.division-summary-copy { overflow:hidden; }
.division-summary-copy:after { content:""; position:absolute; right:-50px; bottom:-80px; width:190px; height:190px; border:1px solid rgba(8,123,193,.09); border-radius:50%; box-shadow:0 0 0 28px rgba(8,123,193,.025),0 0 0 56px rgba(8,123,193,.018); }
.member-card,.sponsor-card { position:relative; overflow:hidden; }
.member-card:before,.sponsor-card:before { content:""; position:absolute; z-index:3; top:0; left:0; width:0; height:2px; background:linear-gradient(90deg,var(--blue),var(--cyan)); transition:width .35s ease; }
.member-card:hover:before,.sponsor-card:hover:before { width:100%; }
.member-photo:before { content:""; position:absolute; z-index:2; inset:0; pointer-events:none; opacity:.4; background:linear-gradient(90deg,transparent 49.7%,rgba(8,123,193,.1) 50%,transparent 50.3%),linear-gradient(transparent 49.7%,rgba(8,123,193,.1) 50%,transparent 50.3%); }
.achievements { background-image:linear-gradient(90deg,rgba(8,123,193,.035) 1px,transparent 1px); background-size:80px 100%; }
.achievement-list .achievement-row:hover { box-shadow:inset 3px 0 var(--blue); }
.shop-banner { position:relative; overflow:hidden; background:linear-gradient(115deg,#075f98,#087bc1 55%,#20a9cc); box-shadow:0 28px 65px rgba(8,83,128,.18); }
.shop-banner:before { content:""; position:absolute; inset:0; opacity:.2; background-image:linear-gradient(rgba(255,255,255,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.22) 1px,transparent 1px); background-size:52px 52px; transform:perspective(500px) rotateX(58deg) scale(1.4); transform-origin:center bottom; }
.shop-banner>* { position:relative; z-index:1; }
.contact-box { position:relative; }
.contact-box:before { content:"INQUIRY CHANNEL / SECURE"; position:absolute; top:-22px; right:0; color:#7c8e9a; font-family:Consolas,"SFMono-Regular",monospace; font-size:8px; font-weight:700; letter-spacing:.15em; }
.tech-reveal { opacity:0; translate:0 24px; transition:opacity .75s ease,translate .75s cubic-bezier(.2,.7,.2,1); }
.tech-reveal.is-visible { opacity:1; translate:0 0; }
@keyframes heroEnter { from { opacity:0; translate:-24px 0; } to { opacity:1; translate:0 0; } }
@keyframes panelEnter { from { opacity:0; translate:28px 0; } to { opacity:1; translate:0 0; } }
@keyframes orbitSpin { to { rotate:360deg; } }
@keyframes scanPanel { 0%,100% { top:2%; opacity:0; } 12%,88% { opacity:.7; } 50% { top:98%; } }
@keyframes statusPulse { 0%,100% { opacity:.5; scale:.8; } 50% { opacity:1; scale:1; } }
@media (max-width:900px) {
  .tech-status { justify-content:flex-start; overflow-x:auto; scrollbar-width:none; }
  .tech-status::-webkit-scrollbar { display:none; }
  .tech-status span { flex:0 0 auto; }
  .section:before { top:34px; right:2vw; }
}
@media (max-width:560px) {
  .tech-status { padding-inline:5vw; min-height:31px; }
  .tech-status span:nth-child(n+3) { display:none; }
  .hero:before { mask-image:linear-gradient(180deg,#000,transparent 55%); }
  .hero-orbit { width:74%; }
  .section:before { font-size:82px; opacity:.8; }
  .contact-box:before { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .tech-reveal { opacity:1; translate:0 0; }
}

/* 2026 editorial future direction */
.home { background:#f8fbfd; }
.home main { overflow:clip; }
.home .site-header { height:78px; padding-inline:max(3.2vw,calc((100vw - 1440px)/2)); border-bottom:0; }
.home .site-header .brand img { width:205px; }
.home nav { gap:27px; font-size:10px; }
.home nav a { padding:30px 0 27px; }
.home .tech-status { padding-inline:max(3.2vw,calc((100vw - 1440px)/2)); background:#09243a; border:0; color:#8fa8ba; }
.home .tech-status span:first-child { color:#dff8ff; }
.home .hero { min-height:calc(100svh - 112px); grid-template-columns:minmax(420px,.92fr) minmax(540px,1.08fr); align-items:center; gap:clamp(40px,5.5vw,105px); padding:clamp(55px,7vh,90px) max(3.2vw,calc((100vw - 1440px)/2)) clamp(110px,13vh,150px); background:linear-gradient(125deg,#fff 0%,#fff 48%,#eef7fb 48.1%,#f8fcfe 100%); }
.home .hero:before { opacity:.44; background-size:72px 72px; mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.25) 48%,transparent 76%); }
.home .hero:after { content:""; position:absolute; left:48%; top:0; bottom:0; width:1px; background:linear-gradient(transparent,rgba(8,123,193,.24) 20%,rgba(8,123,193,.08) 80%,transparent); }
.hero-wordmark { position:absolute; z-index:0; left:max(3.2vw,calc((100vw - 1440px)/2)); right:0; bottom:-.075em; overflow:hidden; color:transparent; -webkit-text-stroke:1px rgba(8,123,193,.12); font-family:Arial Black,"Helvetica Neue",sans-serif; font-size:clamp(92px,14.5vw,238px); font-weight:900; line-height:.72; letter-spacing:-.075em; white-space:nowrap; pointer-events:none; }
.home .hero-copy { z-index:4; text-align:left; padding:20px 0 34px; }
.home .hero-copy .eyebrow { justify-content:flex-start; }
.home .hero-copy h1 { max-width:760px; font-size:clamp(50px,5.25vw,84px); line-height:1.06; letter-spacing:-.06em; }
.home .hero-lead { max-width:590px; margin:30px 0 34px; font-size:15px; line-height:2.05; }
.home .hero-actions { justify-content:flex-start; }
.home .button { min-height:58px; padding-inline:30px; }
.hero-signals { display:flex; flex-wrap:wrap; gap:0; margin-top:54px; border-top:1px solid #cfdee6; border-bottom:1px solid #cfdee6; }
.hero-signals span { min-width:132px; padding:15px 22px 15px 0; color:#758997; font-family:Consolas,"SFMono-Regular",monospace; font-size:8px; font-weight:700; letter-spacing:.12em; }
.hero-signals span+span { padding-left:22px; border-left:1px solid #cfdee6; }
.hero-signals b { display:block; margin-bottom:5px; color:var(--navy); font-family:"Helvetica Neue",Arial,sans-serif; font-size:14px; letter-spacing:.04em; }
.home .hero-brand-panel { --rotate-x:0deg; --rotate-y:0deg; width:100%; aspect-ratio:1/1; max-height:min(72vh,760px); justify-self:end; padding:clamp(55px,6vw,98px); transform:perspective(1200px) rotateX(var(--rotate-x)) rotateY(var(--rotate-y)); transform-style:preserve-3d; transition:transform .18s ease-out,box-shadow .35s ease; border:0; background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(226,242,249,.94)); box-shadow:0 48px 100px rgba(10,54,81,.15),inset 0 0 0 1px rgba(8,123,193,.16),inset 0 0 0 12px rgba(255,255,255,.72); }
.home .hero-brand-panel:hover { box-shadow:0 60px 125px rgba(10,54,81,.2),inset 0 0 0 1px rgba(8,123,193,.2),inset 0 0 0 12px rgba(255,255,255,.76); }
.home .hero-panel-logo { width:min(88%,700px); transform:translateZ(36px); }
.home .hero-orbit { width:82%; transform:translateZ(8px); }
.home .hero-panel-meta { right:34px; top:31px; transform:translateZ(44px); }
.scroll-cue { position:absolute; z-index:5; left:max(3.2vw,calc((100vw - 1440px)/2)); bottom:36px; display:flex; align-items:center; gap:14px; color:#617786; font-family:Consolas,"SFMono-Regular",monospace; font-size:8px; font-weight:700; letter-spacing:.16em; }
.scroll-cue i { position:relative; width:52px; height:1px; overflow:hidden; background:#b8cbd5; }
.scroll-cue i:after { content:""; position:absolute; inset:0; translate:-100% 0; background:var(--blue); animation:scrollSignal 2.3s ease-in-out infinite; }
.home .stats { width:min(calc(100% - 6.4vw),1440px); margin-top:-58px; z-index:6; border:0; background:#0a2a42; color:#fff; box-shadow:0 34px 80px rgba(4,31,49,.2); }
.home .stats div { min-height:126px; justify-content:center; padding:28px 34px; border-right-color:rgba(255,255,255,.12); }
.home .stats strong { font-size:30px; }
.home .stats span:last-child { color:#8da6b8; }
.home .stats:before { top:-22px; left:0; color:#5f7d91; }
.home .section { overflow:clip; padding-top:clamp(110px,12vw,180px); padding-bottom:clamp(110px,12vw,180px); }
.home .section:before { top:clamp(64px,7vw,105px); right:max(3.2vw,calc((100vw - 1440px)/2)); color:rgba(8,123,193,.055); font-size:clamp(120px,16vw,240px); }
.home .about { min-height:780px; grid-template-columns:minmax(360px,.85fr) minmax(480px,1.15fr); align-items:start; gap:clamp(70px,11vw,180px); margin-top:0; padding-inline:max(6vw,calc((100vw - 1280px)/2)); background-color:#f0f8fb; background-size:80px 80px; }
.home .about .section-heading { position:sticky; top:150px; }
.home .about h2 { font-size:clamp(46px,5vw,72px); line-height:1.18; }
.home .about-copy { padding-top:95px; font-size:16px; }
.home .about-copy p { line-height:2.2; }
.home .members { padding-inline:max(3.2vw,calc((100vw - 1440px)/2)); background:#fff; }
.home .section-topline { align-items:flex-start; margin-bottom:86px; }
.home .section-topline h2 { font-size:clamp(52px,6.5vw,90px); line-height:1; }
.home .section-topline>p { margin-top:15px; }
.home .division-accordions { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; align-items:start; }
.home .division-accordion { min-width:0; border:0; box-shadow:inset 0 0 0 1px var(--line),0 18px 50px rgba(8,52,80,.055); }
.home .division-accordion[open] { grid-column:1/-1; }
.home .division-accordion summary { grid-template-columns:1fr; min-height:0; background:#fff; }
.home .division-accordion:not([open]) .division-summary-art { aspect-ratio:16/8.4; }
.home .division-accordion:not([open]) .division-summary-copy { min-height:155px; padding:31px 74px 30px 32px; }
.home .division-accordion:not([open]) .division-summary-copy h3 { font-size:clamp(27px,2.6vw,42px); }
.home .division-accordion[open] summary { grid-template-columns:minmax(420px,1.15fr) minmax(330px,.85fr); }
.home .division-accordion[open] .division-summary-art { min-height:340px; }
.home .division-accordion[open] .division-summary-copy { min-height:340px; padding:48px 86px 48px 48px; }
.home .division-accordion[open] .division-summary-copy h3 { font-size:clamp(42px,5vw,76px); }
.home .division-accordion[open] .division-members { animation:membersOpen .55s cubic-bezier(.2,.7,.2,1) both; }
.home .division-summary-art:after { content:"VIEW DIVISION"; position:absolute; right:18px; bottom:14px; padding:7px 9px; color:#dff8ff; background:rgba(4,24,39,.78); backdrop-filter:blur(8px); font-family:Consolas,"SFMono-Regular",monospace; font-size:8px; font-weight:700; letter-spacing:.14em; }
.home .division-accordion[open] .division-summary-art:after { content:"DIVISION OPEN"; }
.home .division-members { padding:48px; background:#f4f8fa; }
.home .member-card { box-shadow:0 18px 45px rgba(8,52,80,.055); }
.home .member-info { min-height:108px; padding:23px 24px 26px; }
.home .sponsors { background:#f1f7fa; }
.home .sponsor-heading { margin-bottom:78px; }
.home .sponsor-heading h2 { font-size:clamp(50px,6vw,82px); }
.home .sponsor-card { min-height:225px; background:rgba(255,255,255,.82); backdrop-filter:blur(10px); transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease; }
.home .sponsor-card:hover { transform:translateY(-6px); border-color:#add4e5; box-shadow:0 28px 60px rgba(8,52,80,.1); }
.home .achievements { grid-template-columns:minmax(300px,.68fr) minmax(560px,1.32fr); gap:clamp(70px,9vw,140px); align-items:start; padding-inline:max(4.5vw,calc((100vw - 1360px)/2)); background:#081f32; color:#fff; }
.home .achievements:before { color:rgba(105,210,240,.07); }
.home .achievements .section-topline { position:sticky; top:145px; display:block; margin:0; }
.home .achievements .section-topline>p { margin-top:28px; color:#8da6b8; }
.home .achievements .eyebrow { color:#65d3ee; }
.home .achievement-list { border-top-color:rgba(255,255,255,.15); }
.home .achievement-list .achievement-row { position:relative; grid-template-columns:82px 1fr; gap:10px 24px; min-height:128px; padding:28px 18px; border-bottom-color:rgba(255,255,255,.13); }
.home .achievement-list .achievement-row:hover { padding-left:28px; background:rgba(255,255,255,.035); }
.home .achievement-list .year { grid-row:1/3; color:#65d3ee; font-family:Consolas,"SFMono-Regular",monospace; font-size:11px; }
.home .achievement-list h3 { font-size:21px; }
.home .achievement-list p { color:#8da6b8; }
.home .achievement-list .arrow { position:absolute; right:16px; color:#65d3ee; }
.achievement-intro { max-width:430px; }
.achievement-intro>p { margin:0; color:#8da6b8; line-height:1.8; }
.text-link.light { margin-top:22px; color:#65d3ee; }
.home .shop-banner { width:min(calc(100% - 9vw),1360px); margin:110px auto; padding:85px clamp(38px,6vw,90px); }
.home .contact { grid-template-columns:minmax(350px,.8fr) minmax(540px,1.2fr); gap:clamp(70px,11vw,170px); padding-inline:max(5vw,calc((100vw - 1320px)/2)); background:#fff; }
.home .contact>div:first-child { position:sticky; top:145px; align-self:start; }
.home .contact h2 { font-size:clamp(48px,5.3vw,76px); line-height:1.13; }
.home .contact-box { padding-top:48px; }
.home footer { min-height:220px; }
@keyframes scrollSignal { 0% { translate:-100% 0; } 55%,100% { translate:100% 0; } }
@keyframes membersOpen { from { opacity:0; translate:0 16px; } to { opacity:1; translate:0 0; } }
@media (max-width:1100px) {
  .home .hero { grid-template-columns:minmax(360px,.9fr) minmax(440px,1.1fr); }
  .home .hero-signals span { min-width:105px; }
  .home .division-accordion[open] summary { grid-template-columns:1fr 1fr; }
}
@media (max-width:900px) {
  .home .site-header { padding-inline:5vw; }
  .home .hero { min-height:auto; grid-template-columns:1fr; padding:72px 5vw 130px; background:linear-gradient(180deg,#fff 0%,#fff 48%,#eef7fb 48.1%,#f8fcfe 100%); }
  .home .hero:after { display:none; }
  .home .hero-copy { max-width:720px; }
  .home .hero-brand-panel { width:min(100%,720px); max-height:none; justify-self:center; }
  .home .stats { width:90%; margin-top:-45px; }
  .home .about { grid-template-columns:1fr; min-height:0; gap:50px; padding-inline:7vw; }
  .home .about .section-heading,.home .achievements .section-topline,.home .contact>div:first-child { position:relative; top:auto; }
  .home .about-copy { padding-top:0; }
  .home .division-accordions { grid-template-columns:1fr; }
  .home .division-accordion[open] { grid-column:auto; }
  .home .division-accordion[open] summary { grid-template-columns:1fr; }
  .home .division-accordion[open] .division-summary-art { min-height:280px; }
  .home .division-accordion[open] .division-summary-copy { min-height:220px; }
  .home .achievements { grid-template-columns:1fr; gap:70px; padding-inline:7vw; }
  .home .contact { grid-template-columns:1fr; padding-inline:7vw; }
}
@media (max-width:560px) {
  .home .site-header { height:70px; }
  .home .site-header .brand img { width:168px; }
  .home .hero { padding:58px 0 105px; }
  .home .hero-copy { padding-inline:5vw; }
  .home .hero-copy h1 { font-size:clamp(42px,13vw,58px); }
  .home .hero-lead { font-size:14px; }
  .hero-signals { margin-top:40px; }
  .hero-signals span { min-width:0; flex:1 1 33%; padding:12px 10px 12px 0; }
  .hero-signals span+span { padding-left:10px; }
  .hero-signals b { font-size:11px; }
  .home .hero-brand-panel { width:100%; aspect-ratio:1/1; border-left:0; border-right:0; }
  .scroll-cue { left:5vw; bottom:28px; }
  .hero-wordmark { left:5vw; font-size:27vw; bottom:-.02em; }
  .home .stats { width:100%; margin-top:0; }
  .home .stats div { min-height:105px; padding:22px 5vw; }
  .home .section { padding-top:100px; padding-bottom:100px; }
  .home .section-topline h2,.home .sponsor-heading h2 { font-size:44px; }
  .home .division-accordions { gap:14px; }
  .home .division-accordion:not([open]) .division-summary-copy { min-height:135px; padding:26px 58px 25px 24px; }
  .home .division-accordion[open] .division-summary-art { min-height:200px; }
  .home .division-accordion[open] .division-summary-copy { min-height:180px; padding:30px 58px 30px 24px; }
  .home .division-accordion[open] .division-summary-copy h3 { font-size:35px; }
  .home .division-members { padding:18px; }
  .home .achievements,.home .contact,.home .about { padding-inline:5vw; }
  .home .achievement-list .achievement-row { grid-template-columns:58px 1fr; min-height:118px; padding-inline:8px; }
}

/* Sculptural identity: lightweight CSS 3D, with the original brand artwork. */
.home .hero { grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:4vw; background:radial-gradient(ellipse at 83% 40%,#e6f3f9,transparent 48%),#fff; }
.home .hero-copy h1 { font-size:clamp(40px,4.4vw,72px); line-height:1.3; letter-spacing:-.055em; }
.home .hero-brand-panel,.home .hero-brand-panel:hover { display:block; position:relative; overflow:visible; isolation:auto; padding:0; aspect-ratio:1.1; max-height:none; background:none; border:0; box-shadow:none; transform:none; animation:none; perspective:1400px; }
.home .hero-brand-panel:before { inset:auto 8% 5%; height:12%; border-radius:50%; background:radial-gradient(ellipse,rgba(14,58,84,.2),transparent 70%); filter:blur(15px); opacity:1; }
.home .hero-brand-panel:after { display:none; }
.brand-stage { position:absolute; inset:14% 8% 20%; transform-style:preserve-3d; transform:rotateX(calc(12deg + var(--rotate-x,0deg))) rotateY(calc(-17deg + var(--rotate-y,0deg))) rotateZ(-5deg); transition:transform .5s cubic-bezier(.2,.7,.2,1); }
.brand-slab { position:absolute; inset:0; border-radius:12px; transform-style:preserve-3d; }
.slab-back { transform:translate3d(28px,28px,-65px); background:linear-gradient(125deg,#073b58,#087fb4 60%,#39c6df); border:1px solid #55c8de; box-shadow:2px 4px 0 #085471,4px 8px 0 #084763,12px 28px 45px #0b3b5826; }
.slab-middle { transform:translate3d(12px,12px,-28px); background:linear-gradient(140deg,#ffffffbf,#d3e8f1b3); border:1px solid #fff; box-shadow:2px 3px 0 #b3d3e1; }
.slab-front { display:flex; align-items:center; justify-content:center; background:linear-gradient(130deg,#fff 5%,#f6fbfd 65%,#e5f1f6); border:1px solid #fff; box-shadow:1px 2px 0 #cedfe7,2px 4px 0 #b4ccd9,3px 6px 0 #9ebfce,0 24px 38px #173e581a; }
.slab-front:after { content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:linear-gradient(115deg,transparent 40%,#ffffffad 40.2%,#ffffff00 70%); }
.home .slab-front .hero-panel-logo { width:82%; transform:translateZ(26px); filter:drop-shadow(0 10px 5px #0c30401a); }
.slab-label,.slab-edition { position:absolute; left:7%; right:7%; color:#5b788b; font:9px/1.4 Consolas,monospace; letter-spacing:.16em; }
.slab-label { top:9%; }
.slab-edition { bottom:9%; display:flex; align-items:center; gap:14px; }
.slab-edition i { flex:1; height:1px; background:#d3e3eb; }
.stage-caption { position:absolute; bottom:3%; left:8%; right:3%; display:flex; justify-content:space-between; gap:12px; color:#5b788b; font:9px/1.4 Consolas,monospace; letter-spacing:.13em; }
.home .division-accordion { border:1px solid #d9e5ec; box-shadow:0 5px 0 #edf3f6,0 15px 30px #163c5108; transition:box-shadow .3s,translate .3s; }
.home .division-summary-copy { background:linear-gradient(120deg,#fff,#f7fbfd); }
.home .division-summary-copy b { border-radius:50%; border:1px solid #c9dce7; transition:background .25s,color .25s; }
.home .division-accordion[open] .division-summary-copy b { background:var(--navy); color:white; }
.home a:focus-visible,.home summary:focus-visible { outline:3px solid #087bc1; outline-offset:5px; }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  .home .division-accordion:not([open]):hover { translate:0 -5px; box-shadow:0 5px 0 #d6e6ee,0 25px 40px #163c5114; }
}
@media (max-width:900px) {
  .home .hero { grid-template-columns:1fr; }
  .home .hero-brand-panel { width:min(90%,650px); }
  .home .hero-copy h1 { font-size:clamp(38px,7vw,64px); }
}
@media (max-width:560px) {
  .home .hero { gap:15px; }
  .home .hero-brand-panel { width:92%; aspect-ratio:1.05; }
  .home .hero-copy h1 { font-size:clamp(30px,8.2vw,46px); }
  .brand-stage { inset:17% 7% 23%; transform:rotateX(10deg) rotateY(-12deg) rotateZ(-4deg); }
  .slab-label,.slab-edition { font-size:7px; letter-spacing:.07em; }
  .stage-caption { font-size:7px; letter-spacing:.04em; }
}
@media (prefers-reduced-motion:reduce) {
  .brand-stage { transition:none; }
  .tech-reveal { opacity:1; transform:none; }
}

/* New portraits use ordinary framing, not offsets from the previous cutouts. */
.portrait-tsubaki,.portrait-garo { background:#fff; }
.portrait-tsubaki:before,.portrait-garo:before,.portrait-tsubaki:after,.portrait-garo:after { display:none; }
.member-photo.portrait-tsubaki img { object-fit:cover; object-position:50% 20%; }
.member-photo.portrait-garo img { object-fit:cover; object-position:50% 7%; }
.profile-portrait.portrait-tsubaki img,.profile-portrait.portrait-garo img { object-fit:cover; object-position:50% 0%; }

/* Motion identity: front and reverse artwork remain readable during rotation. */
.home .hero-brand-panel { z-index:2; }
.brand-spin { --motion-duration:24s; position:absolute; inset:0; transform-style:preserve-3d; animation:identityTurn var(--motion-duration) linear infinite; }
.slab-front,.slab-reverse,.slab-front>*,.slab-reverse>* { backface-visibility:hidden; }
.slab-reverse { display:flex; align-items:center; justify-content:center; transform:translate3d(28px,28px,-70px) rotateY(180deg); background:linear-gradient(135deg,#fff,#edf6fa); border:1px solid #d2e5ee; }
.home .slab-reverse .hero-panel-logo { width:82%; transform:translateZ(1px); }
@keyframes identityTurn { from { transform:rotateY(0deg); } to { transform:rotateY(360deg); } }

/* Quiet animated backdrop; no video download or pointer interception. */
.home .hero { isolation:isolate; }
.ambient-brand { position:absolute; z-index:0; inset:0; overflow:hidden; pointer-events:none; perspective:1200px; display:grid; place-items:center; }
.ambient-brand img { --motion-duration:32s; width:min(1100px,110vw); max-width:none; opacity:.09; transform-origin:center; animation:ambientLogoTurn var(--motion-duration) linear infinite; }
@keyframes ambientLogoTurn { from { transform:translate(18%,-20%) rotateY(0deg) rotateZ(-12deg); } to { transform:translate(18%,-20%) rotateY(360deg) rotateZ(-12deg); } }
.motion-toggle { position:absolute; right:5vw; bottom:30px; z-index:5; padding:8px 12px; border:1px solid #cddfe8; border-radius:4px; color:#526e80; background:#ffffffd9; font-family:inherit; font-size:11px; line-height:1.4; cursor:pointer; }
.motion-toggle:focus-visible { outline:3px solid var(--blue); outline-offset:3px; }
.motion-paused .ambient-brand img,.motion-paused .brand-spin,.motion-paused .hero-lanes i,
.page-hidden .ambient-brand img,.page-hidden .brand-spin,.page-hidden .hero-lanes i { animation-play-state:paused; }
.motion-paused .tech-status i,.motion-paused .scroll-cue i:after { animation-play-state:paused; }
.home .members { background-image:radial-gradient(#087bc10c .8px,transparent .8px); background-size:24px 24px; }
.home .contact { background-image:radial-gradient(ellipse at 0% 100%,#eaf5fa,transparent 60%); }
.hero-lanes { position:absolute; z-index:0; inset:0; pointer-events:none; overflow:hidden; }
.hero-lanes i { --motion-duration:14s; position:absolute; width:27%; height:1px; background:linear-gradient(90deg,transparent,#087bc170,transparent); animation:laneDrift var(--motion-duration) linear infinite; }
.hero-lanes i:nth-child(1) { left:57%; top:13%; }
.hero-lanes i:nth-child(2) { left:66%; top:78%; animation-delay:-5s; }
.hero-lanes i:nth-child(3) { left:4%; top:83%; animation-delay:-9s; width:17%; }
@keyframes laneDrift { 0% { transform:translateX(-80%); opacity:0; } 20%,80% { opacity:.7; } 100% { transform:translateX(80%); opacity:0; } }
.home .division-summary-art:after { content:""; position:absolute; inset:-15% -45%; background:linear-gradient(115deg,transparent 42%,#ffffff26 50%,transparent 58%); transform:translateX(-90%); pointer-events:none; }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  .home .division-accordion summary:hover .division-summary-art:after,
  .home .division-accordion summary:focus-visible .division-summary-art:after { transform:translateX(90%); transition:transform 1s ease; }
}
@media (max-width:560px) { .motion-toggle { bottom:24px; font-size:9px; } }
@media (prefers-reduced-motion:reduce) {
  /* Paused by default. Only an explicit click on Play opts into continuous motion. */
  .home .brand-spin,.home .ambient-brand img,.home .hero-lanes i { animation-duration:var(--motion-duration)!important; animation-iteration-count:infinite!important; animation-play-state:paused; }
  .home[data-motion="running"]:not(.page-hidden) .brand-spin,
  .home[data-motion="running"]:not(.page-hidden) .ambient-brand img,
  .home[data-motion="running"]:not(.page-hidden) .hero-lanes i { animation-play-state:running; }
}

/* Editorial refinements: typography, timeline, navigation and inquiry. */
[hidden] { display:none!important; }
.sr-only { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.home .section { scroll-margin-top:78px; }
.home .section-topline h2,.home .sponsor-heading h2 { font-size:clamp(36px,4.4vw,64px); letter-spacing:-.04em; }
.home .about h2 { font-size:clamp(32px,3.3vw,48px); line-height:1.45; }
.home .contact h2 { font-size:clamp(34px,3.8vw,54px); line-height:1.4; }
.home .section .eyebrow { margin-bottom:22px; }
nav a[aria-current] { color:var(--blue); border-bottom-color:var(--blue); }
.menu-toggle { display:none; }
.home .achievements { display:grid; grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr); gap:clamp(40px,7vw,100px); }
.home .achievements .section-topline h2 { margin-bottom:30px; }
.home .timeline-list { position:relative; padding-left:24px; border-top:0; }
.home .timeline-list:before { content:""; position:absolute; left:3px; top:14px; bottom:14px; width:1px; background:linear-gradient(#6ad2eb,#2c536a); }
.home .timeline-list .achievement-row { display:grid; grid-template-columns:1fr; gap:9px; padding:0 34px 32px 18px; margin-bottom:30px; min-height:0; }
.home .timeline-list .achievement-row:last-child { margin-bottom:0; border-bottom:0; padding-bottom:0; }
.home .timeline-list .achievement-row:before { content:""; position:absolute; top:5px; left:-26px; width:9px; height:9px; border:2px solid #65d3ee; border-radius:50%; background:#081f32; box-shadow:0 0 0 5px #081f32; }
.home .timeline-list .achievement-row:hover { padding-left:18px; box-shadow:none; background:transparent; }
.home .timeline-list .achievement-row:hover:before { background:#65d3ee; }
.home .timeline-list .year { grid-row:auto; font-size:12px; letter-spacing:.14em; }
.home .timeline-list h3 { font-size:clamp(17px,1.7vw,22px); line-height:1.5; }
.home .timeline-list p { grid-column:1; margin:0; font-size:13px; line-height:1.8; }
.home .timeline-list .arrow { top:30px; right:4px; }
.home .contact { grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); gap:clamp(35px,6vw,90px); }
.home .contact-box { padding-top:0; min-width:0; }
.home .contact-box:before { display:none; }
.home .contact-box>p:first-child { margin-top:0; line-height:1.9; color:var(--muted); }
.inquiry-card { margin:28px 0 22px; padding:clamp(20px,3vw,38px); border:1px solid #cbdde7; border-top:3px solid var(--blue); border-radius:8px; background:#fff; box-shadow:0 20px 65px #173e580a; }
.form-steps { list-style:none; display:flex; padding:0; margin:0 0 24px; border-bottom:1px solid var(--line); }
.form-steps li { flex:1; padding:0 5px 17px; color:#6d7f8b; font-size:12px; text-align:center; }
.form-steps span { margin-right:7px; font:10px Consolas,monospace; }
.form-steps li[aria-current] { color:var(--blue); font-weight:700; border-bottom:2px solid var(--blue); }
.inquiry-fields { border:0; padding:0; margin:0; min-width:0; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:23px 18px; }
.form-field { display:block; font-size:13px; font-weight:700; }
.form-field.full { grid-column:1/-1; }
.form-field>span { display:inline-block; margin-left:5px; color:var(--blue); font-size:10px; }
.form-field>span.optional { color:#738490; font-weight:400; }
.form-field input,.form-field select,.form-field textarea { display:block; width:100%; min-width:0; margin-top:10px; padding:13px 14px; border:1px solid #becfd9; border-radius:4px; background:#fbfdfe; color:var(--navy); font-family:inherit; font-size:16px; line-height:1.6; }
.form-field textarea { resize:vertical; min-height:170px; max-height:600px; }
.form-field input:focus,.form-field select:focus,.form-field textarea:focus { outline:2px solid #087bc130; outline-offset:2px; border-color:var(--blue); background:#fff; }
.form-field small { display:block; margin-top:6px; color:var(--muted); font-size:11px; font-weight:400; }
.form-privacy { margin:24px 0 16px; padding:16px; background:#f1f7fa; color:#526a79; font-size:12px; line-height:1.9; }
.consent-row { display:flex; align-items:flex-start; gap:10px; font-size:12px; line-height:1.9; cursor:pointer; }
.consent-row input { width:18px; height:18px; margin:2px 0 0; flex-shrink:0; accent-color:var(--blue); }
.inquiry-card button { font-family:inherit; cursor:pointer; border-radius:4px; }
.inquiry-card button.primary { border:1px solid var(--blue); }
.inquiry-card button:disabled { opacity:.45; cursor:not-allowed; transform:none; }
.review-button { width:100%; margin-top:26px; gap:20px; }
.form-status { margin:0 0 20px; font-size:12px; line-height:1.8; color:#526e80; }
.form-status:empty { display:none; }
.form-status.is-error { padding:12px; background:#fff5f3; color:#a33326; border-left:2px solid #a33326; }
.form-trap { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.form-confirmation h3,.form-success h3 { margin:0 0 12px; font-size:23px; }
.form-confirmation>p,.form-success p { font-size:13px; line-height:1.9; color:var(--muted); }
.confirmation-list { margin:26px 0; }
.confirmation-list dt { color:var(--blue); font-size:11px; font-weight:700; margin:20px 0 8px; }
.confirmation-list dd { margin:0; padding-bottom:17px; border-bottom:1px solid var(--line); font-size:14px; line-height:1.8; white-space:pre-wrap; overflow-wrap:anywhere; }
.form-actions { display:flex; gap:12px; flex-wrap:wrap; }
.form-success { padding:12px 0 22px; }
.success-symbol { display:grid; place-items:center; width:48px; height:48px; margin-bottom:24px; border-radius:50%; color:var(--blue); background:#eaf6fb; font-size:26px; }
.form-success .receipt { padding:12px; border:1px solid var(--line); font-family:Consolas,monospace; }
.contact-email-option { font-size:12px; line-height:2; color:var(--muted); }
.contact-email-option a { display:block; color:var(--blue); font-weight:700; overflow-wrap:anywhere; }
.home .division-accordion[open] .division-summary-art:after { content:""; }
@media (max-width:900px) {
  .home .achievements,.home .contact { grid-template-columns:1fr; }
  .site-header,.home .site-header { flex-wrap:wrap; height:auto; min-height:70px; }
  .site-header .brand img { max-width:48vw; }
  .site-header nav { display:flex; width:100%; flex-wrap:wrap; gap:6px 20px; padding:5px 0 15px; }
  .site-header nav a,.home .site-header nav a { padding:10px 0; }
  .site-header.nav-ready .menu-toggle { display:flex; align-items:center; gap:10px; min-height:44px; padding:8px 14px; background:#fff; color:var(--navy); border:1px solid var(--line); border-radius:3px; font:11px Consolas,monospace; }
  .site-header.nav-ready nav { display:none; }
  .site-header.nav-ready nav.is-open { display:flex; }
  .site-header.nav-ready .menu-toggle[aria-expanded="true"] span { rotate:45deg; }
}
@media (max-width:560px) {
  .home .section { padding-block:85px; }
  .home .section-topline,.home .sponsor-heading { margin-bottom:38px; }
  .form-grid { grid-template-columns:1fr; }
  .home .inquiry-card .button { padding-inline:16px; min-height:50px; }
  .form-actions>* { flex:1 1 auto; }
  .home .timeline-list { padding-left:22px; }
}

/* Activities and media archive */
.archive-page { background:#f7fafc; }
.archive-page main { overflow:clip; }
.archive-page .site-header { position:sticky; }
.archive-page .site-header .brand img { width:205px; }
.archive-page .tech-status { background:#09243a; border:0; color:#8fa8ba; }
.archive-page .tech-status span:first-child { color:#dff8ff; }
.archive-hero { position:relative; padding:110px max(5vw,calc((100vw - 1280px)/2)) 95px; overflow:hidden; color:#fff; background:#081f32; }
.archive-hero:before { content:"ACTIVITY / MEDIA / EVENT"; position:absolute; right:-.03em; bottom:-.12em; color:transparent; -webkit-text-stroke:1px rgba(101,211,238,.12); font-family:Arial Black,"Helvetica Neue",sans-serif; font-size:clamp(70px,12vw,180px); font-weight:900; line-height:.8; letter-spacing:-.07em; white-space:nowrap; }
.archive-hero>* { position:relative; z-index:1; }
.archive-hero .eyebrow { color:#65d3ee; }
.archive-hero h1 { max-width:850px; font-size:clamp(48px,7vw,96px); line-height:1.02; }
.archive-hero>p:last-child { max-width:720px; margin:32px 0 0; color:#9bb1c0; font-size:15px; line-height:2; }
.archive-overview { display:grid; grid-template-columns:repeat(3,1fr); max-width:1280px; margin:-1px auto 0; border:1px solid var(--line); background:#fff; }
.archive-overview div { min-height:120px; padding:28px 34px; display:flex; flex-direction:column; justify-content:center; border-right:1px solid var(--line); }
.archive-overview div:last-child { border-right:0; }
.archive-overview strong { font-size:26px; }
.archive-overview span { margin-top:7px; color:var(--muted); font-family:Consolas,"SFMono-Regular",monospace; font-size:9px; font-weight:700; letter-spacing:.13em; }
.archive-content { width:min(90%,1280px); margin:0 auto; padding:105px 0 130px; }
.archive-note { max-width:830px; margin:0 0 86px; padding:27px 30px; color:#526c7d; line-height:1.9; border-left:3px solid var(--blue); background:#edf6fa; }
.year-group { display:grid; grid-template-columns:150px 1fr; gap:58px; padding:0 0 85px; scroll-margin-top:105px; }
.year-heading { position:sticky; top:118px; align-self:start; }
.year-heading span { display:block; color:var(--blue); font-family:Consolas,"SFMono-Regular",monospace; font-size:10px; font-weight:800; letter-spacing:.16em; }
.year-heading h2 { margin-top:7px; font-size:54px; }
.year-records { border-top:1px solid #bdd1dc; border-left:1px solid #c9dfe9; padding-left:24px; }
.activity-record { position:relative; display:grid; grid-template-columns:105px 1fr auto; gap:12px 28px; padding:31px 8px; border-bottom:1px solid var(--line); scroll-margin-top:105px; }
.activity-record:after { content:""; position:absolute; left:-29px; top:35px; width:8px; height:8px; border:2px solid var(--blue); background:#f7fafc; border-radius:50%; box-shadow:0 0 0 4px #f7fafc; }
.activity-record:before { content:""; position:absolute; left:0; top:0; bottom:0; width:0; background:var(--blue); transition:width .2s ease; }
.activity-record:target { margin-inline:-18px; padding-inline:26px; background:#eef8fc; box-shadow:0 14px 35px rgba(8,52,80,.08); }
.activity-record:target:before,.activity-record:hover:before { width:3px; }
.activity-date { grid-row:1/4; color:var(--blue); font-family:Consolas,"SFMono-Regular",monospace; font-size:11px; font-weight:800; letter-spacing:.07em; }
.activity-title { margin:0; font-size:20px; line-height:1.45; }
.activity-role { margin:4px 0 0; color:var(--muted); font-size:14px; line-height:1.8; }
.activity-links { grid-column:2/4; display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.source-link,.source-label { min-height:32px; padding:0 12px; display:inline-flex; align-items:center; color:var(--blue); border:1px solid #b9d5e2; background:#fff; font-family:Consolas,"SFMono-Regular",monospace; font-size:9px; font-weight:800; letter-spacing:.08em; }
.source-link:hover { color:#fff; border-color:var(--blue); background:var(--blue); }
.source-label { color:#718794; background:#f2f6f8; }
.archive-back { display:inline-flex; margin-top:14px; color:var(--blue); font-size:13px; font-weight:800; }
.archive-page footer { min-height:210px; }
@media (max-width:900px) {
  .archive-overview { width:90%; }
  .year-group { grid-template-columns:1fr; gap:24px; }
  .year-heading { position:relative; top:auto; }
  .year-heading h2 { font-size:46px; }
}
@media (max-width:620px) {
  .archive-hero { padding:78px 5vw 75px; }
  .archive-overview { width:100%; grid-template-columns:1fr; border-inline:0; }
  .archive-overview div { min-height:90px; border-right:0; border-bottom:1px solid var(--line); }
  .archive-content { width:90%; padding-block:80px 100px; }
  .archive-note { margin-bottom:62px; }
  .activity-record { grid-template-columns:65px 1fr; gap:10px 16px; padding-block:25px; }
  .activity-date { grid-row:1/4; }
  .activity-title { font-size:17px; }
  .activity-links { grid-column:2; }
  .activity-record:target { margin-inline:-10px; padding-inline:18px 10px; }
}