/* AngelsRO Ragnarok refresh: continuous honeycomb, bright game art and playful UI. */
:root {
  --hex-pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72.8' viewBox='0 0 72 72.8'%3E%3Cg fill='%23d9f2ff' fill-opacity='.23' stroke='%23266f9e' stroke-opacity='.23' stroke-width='1.2'%3E%3Cpath d='M18 0 36 10.4v20.8L18 41.6 0 31.2V10.4zM54 0l18 10.4v20.8L54 41.6 36 31.2V10.4zM36 31.2l18 10.4v20.8L36 72.8 18 62.4V41.6z'/%3E%3C/g%3E%3C/svg%3E");
}
body { background-image:var(--hex-pattern),radial-gradient(ellipse at 12% 34%,rgba(244,137,168,.11),transparent 34%),radial-gradient(ellipse at 88% 76%,rgba(69,181,207,.13),transparent 36%),linear-gradient(180deg,#f9fcff,#eef7ff 70%,#fff8ed); }
.hero {
  min-height: 760px; height: auto; padding: 142px 0 82px;
  background: radial-gradient(ellipse at 79% 26%,rgba(255,214,115,.24),transparent 32%),linear-gradient(135deg,#e8f7ff,#f6fbff 52%,#fff4e8);
  isolation:isolate;
}
.hero-media { display:none !important; }
.hero-overlay { background-image: var(--hex-pattern),radial-gradient(ellipse at 12% 70%,rgba(96,202,217,.16),transparent 38%),linear-gradient(120deg,rgba(250,253,255,.54),rgba(249,252,255,.08)); }
.hero-overlay::after { background:linear-gradient(180deg,transparent 60%,rgba(239,248,255,.84)); }
.hero::before { content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background-image:radial-gradient(circle at 18% 28%,rgba(255,255,255,.86) 0 1px,transparent 2px),radial-gradient(circle at 83% 25%,rgba(255,213,119,.75) 0 1.5px,transparent 3px),radial-gradient(circle at 68% 68%,rgba(255,255,255,.76) 0 1px,transparent 2px),radial-gradient(ellipse at 76% 36%,rgba(91,194,220,.18),transparent 32%),radial-gradient(ellipse at 16% 75%,rgba(239,132,166,.13),transparent 28%);background-size:280px 240px,360px 320px,220px 250px,100% 100%,100% 100%;animation:ro-sparkle-drift 24s ease-in-out infinite alternate; }
.hero-content { position:relative; z-index:2; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:clamp(28px,4vw,60px); width:min(1240px,calc(100% - 64px)); margin-inline:auto; }
.hero-copy { max-width:620px; }
.ro-kicker-icon { display:inline-grid; place-items:center; width:34px;height:34px; margin-right:8px; border-radius:11px; color:#fff; font-weight:900; background:linear-gradient(135deg,#f2a347,#ef6e68); box-shadow:0 5px 15px #ef987044; transform:rotate(-4deg); }
.hero-kicker { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.hero-title { font-size:clamp(2.55rem,4.6vw,4.5rem); line-height:1.14; overflow:visible; }
.hero-title .gold { line-height:1.18; padding-bottom:.08em; overflow:visible; }
.hero-illustration { position:relative;width:100%;max-width:520px;height:auto!important;min-height:0;align-self:center;display:block;margin:0 auto;padding:0;border:0;border-radius:50%;background:transparent;box-shadow:none;transform:translateY(0);transition:transform .35s ease; }
.hero-illustration:hover { transform:translateY(-5px);box-shadow:none; }
.hero-illustration img { display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border:5px solid rgba(255,255,255,.94);border-radius:50%;box-shadow:0 0 0 1px rgba(225,177,105,.75),0 28px 76px rgba(37,75,120,.24),0 0 52px rgba(245,179,83,.19); }
.hero-illustration figcaption { display:flex;justify-content:center;gap:12px;max-width:100%;width:max-content;margin:14px auto 0;padding:9px 15px;border:1px solid rgba(63,141,179,.15);border-radius:999px;background:rgba(255,255,255,.78);box-shadow:0 8px 24px rgba(37,75,120,.08);color:#3c607d;font-size:.78rem;font-weight:750; }
.hero-art-badge { color:#a75273;animation:poring-float 3.8s ease-in-out infinite; }
.hero-art-badge b { color:#ef87a6; }
.hero-note { display:flex; align-items:center; gap:8px; }
.online-pulse { box-shadow:0 0 0 5px rgba(68,182,137,.12); }
.launch-panel { border-radius:24px; border-color:#dcecf5; }
.btn-gold { background:linear-gradient(135deg,#f2a341,#f27c61 55%,#df6795); box-shadow:0 10px 24px rgba(226,130,88,.24); }
.btn-gold:hover { box-shadow:0 15px 32px rgba(226,130,88,.32); }
.reward-card,.feature-card,.spec-card,.form-card,.faq-list details,.mini-progress { transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease; }
.reward-card:hover,.feature-card:hover,.faq-list details:hover { transform:translateY(-4px); box-shadow:0 18px 38px rgba(33,75,115,.13); }
.reward-icon { color:#db7a69; background:linear-gradient(145deg,#fff2e8,#fff8eb); border-color:#f5d6bb; }
.feature-icon { color:#398eae; }
.brand-emblem { display:inline-grid; width:54px;height:54px;place-items:center; flex:none; overflow:hidden;border:2px solid rgba(255,220,145,.92);border-radius:50%;background:#061d50;box-shadow:0 0 0 4px rgba(56,166,206,.09),0 7px 18px rgba(33,75,115,.16);transition:transform .25s ease,box-shadow .25s ease; }
.brand-emblem img { width:100%;height:100%;object-fit:cover;border-radius:50%; }
.brand:hover .brand-emblem { transform:translateY(-2px) rotate(-5deg);box-shadow:0 0 0 5px rgba(241,143,174,.14),0 9px 22px rgba(33,75,115,.18); }
.credential-grid { display:grid;grid-template-columns:1fr 1fr;gap:0 14px; }
.credential-grid .field { min-width:0; }
.form-card { border-radius:24px; }
.field input,.field select { width:100%; color:#193650;border-color:rgba(37,88,132,.2);border-radius:10px;background:#fbfdff; }
.field select { min-height:48px;padding:0 12px; }
/* Connected hexagon motif: visible in each light section and the hero. */
.rewards,.features,.details,.prereg,.faq { background-image:var(--hex-pattern),radial-gradient(ellipse at 11% 20%,rgba(240,142,177,.10),transparent 31%),radial-gradient(ellipse at 86% 80%,rgba(69,181,207,.12),transparent 34%),linear-gradient(180deg,#f9fcff,#eff7fd 58%,#fffaf2); }
.rewards,.features,.details,.prereg,.faq { background-size:72px 72.8px,190% 190%,190% 190%,100% 100%;background-position:0 0,0% 15%,100% 85%,0 0;animation:ro-section-glow 38s ease-in-out infinite alternate; }
.rewards::before { opacity:.68; background-image:var(--hex-pattern),radial-gradient(ellipse at 70% 36%,rgba(246,175,89,.18),transparent 46%); }
.prereg::before { display:none !important; background:none !important; }
.section-head h2 .script,.prereg-copy h2 .script,.details-copy h2 .script,.faq-head h2 .script,.section-head h2 span.gold,.prereg-copy h2 span.gold,.details-copy h2 span.gold,.faq-head h2 span.gold { display:block; line-height:1.24; padding-bottom:.1em; overflow:visible; }
.faq { position:relative;isolation:isolate;overflow:hidden;background-color:#07142d;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='84' viewBox='0 0 96 84'%3E%3Cg fill='none' stroke='%2376bee5' stroke-opacity='.15' stroke-width='1'%3E%3Cpath d='M24 0 48 14v28L24 56 0 42V14zM72 0 96 14v28L72 56 48 42V14zM48 42l24 14v28L48 98 24 84V56z'/%3E%3C/g%3E%3C/svg%3E"),radial-gradient(ellipse at 8% 22%,rgba(90,83,191,.30),transparent 40%),radial-gradient(ellipse at 92% 78%,rgba(30,151,193,.22),transparent 42%),linear-gradient(135deg,#07142d,#102348 54%,#07172d);background-size:96px 84px,190% 190%,180% 180%,100% 100%;background-position:0 0,0% 20%,100% 80%,0 0;animation:ro-faq-aurora 42s ease-in-out infinite alternate; }
.faq::before { content:"";position:absolute;z-index:0;inset:2% auto 2% 0;width:36%;pointer-events:none;background:url("/assets/angelsro-poring-logo.jpg") left 48% center / min(310px,28vw) auto no-repeat;opacity:.13;mask-image:radial-gradient(ellipse at 38% 48%,#000 12%,transparent 72%); }
.faq::after { content:"";position:absolute;z-index:0;inset:0;pointer-events:none;background-image:radial-gradient(circle at 14% 24%,rgba(255,239,190,.8) 0 1px,transparent 2px),radial-gradient(circle at 84% 31%,rgba(150,226,255,.75) 0 1.2px,transparent 2.4px),radial-gradient(circle at 70% 82%,rgba(255,204,134,.65) 0 1px,transparent 2px);background-size:260px 230px,340px 300px,220px 270px;opacity:.48;animation:ro-faq-stars 32s linear infinite alternate; }
.faq-grid { position:relative;z-index:1; }
.faq-head h2 { color:#f6f7ff; font-family:var(--display);text-shadow:0 4px 26px rgba(98,154,240,.2); }
.faq-head h2 .gold { background:linear-gradient(115deg,#ffe6aa 5%,#ffd06e 48%,#a7e8ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent; }
.faq-head .eyebrow { color:#9edcf5; }
.faq-head .eyebrow::before { background:#ffcf72;box-shadow:0 0 14px rgba(255,207,114,.55); }
.faq-head > p:not(.eyebrow) { color:#bdcce1; }
.faq-list { display:grid;gap:12px;border:0; }
.faq-list details { position:relative;overflow:hidden;border:1px solid rgba(151,199,234,.2);border-radius:15px;background:linear-gradient(130deg,rgba(18,42,79,.91),rgba(12,31,62,.88));box-shadow:0 12px 30px rgba(2,9,24,.18),inset 0 1px rgba(255,255,255,.045);transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,background .24s ease; }
.faq-list details:hover { transform:translateY(-2px);border-color:rgba(255,210,125,.45);box-shadow:0 16px 34px rgba(2,9,24,.28),0 0 24px rgba(91,181,222,.08); }
.faq-list details[open] { border-color:rgba(255,210,125,.62);background:linear-gradient(130deg,rgba(25,52,91,.98),rgba(13,36,70,.96));box-shadow:0 18px 38px rgba(2,9,24,.28),0 0 26px rgba(88,178,219,.11); }
.faq-list summary { padding:19px 48px 19px 48px;color:#f1f5ff;font-size:.86rem;line-height:1.55; }
.faq-list summary::before { content:"✧";position:absolute;left:20px;top:50%;color:#88d9f2;font-size:1.1rem;line-height:1;transform:translateY(-50%);text-shadow:0 0 12px rgba(136,217,242,.5); }
.faq-list summary:hover,.faq-list details[open] summary { color:#ffe1a0; }
.faq-list summary::after { right:20px;color:#ffd076;font-size:1.35rem;text-shadow:0 0 12px rgba(255,208,118,.35); }
.faq-list details p { padding:0 48px 21px;color:#c3d0e3;font-size:.8rem;line-height:1.8; }
.faq-list details p a { color:#a9e5ff; }
@keyframes ro-faq-aurora { from {background-position:0 0,0% 20%,100% 80%,0 0;} to {background-position:0 0,100% 84%,0% 16%,0 0;} }
@keyframes ro-faq-stars { from {background-position:0 0,0 0,0 0;} to {background-position:70px 50px,-95px 80px,45px -60px;} }
@keyframes ro-sparkle-drift { from {background-position:0 0,0 0,0 0,0 0,0 0;} to {background-position:90px 55px,-75px 65px,48px -60px,0 0,0 0;} }
@keyframes ro-section-glow { from {background-position:0 0,0% 15%,100% 85%,0 0;} to {background-position:0 0,100% 85%,0% 15%,0 0;} }
@keyframes poring-float { 0%,100% {transform:translateY(0);} 50% {transform:translateY(-3px);} }
/* Carry the FAQ's moonlit Ragnarok palette through the rest of the page. */
:root { --hex-pattern:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72.8' viewBox='0 0 72 72.8'%3E%3Cg fill='none' stroke='%237bcdf2' stroke-opacity='.20' stroke-width='1.15'%3E%3Cpath d='M18 0 36 10.4v20.8L18 41.6 0 31.2V10.4zM54 0l18 10.4v20.8L54 41.6 36 31.2V10.4zM36 31.2l18 10.4v20.8L36 72.8 18 62.4V41.6z'/%3E%3C/g%3E%3C/svg%3E");--ink:#07142b;--ink-2:#0b1c3a;--navy:#0b1d3b;--navy-2:#10264a;--gold:#f2ca78;--gold-bright:#ffe5a6;--gold-deep:#bf8f45;--ice:#b5eaff;--sky:#61c8eb;--cream:#f2f5ff;--text:#e8efff;--muted:#bdcce1;--muted-2:#96a9c5;--line:rgba(160,200,232,.18);--line-gold:rgba(242,202,120,.28);--card:rgba(14,35,70,.9);--card-solid:#10264a;--shadow:0 25px 60px rgba(0,0,0,.28); }
body { background-color:#07142b;background-image:var(--hex-pattern),radial-gradient(ellipse at 10% 28%,rgba(75,91,175,.15),transparent 36%),radial-gradient(ellipse at 88% 72%,rgba(36,145,181,.12),transparent 40%),linear-gradient(180deg,#07142b,#091a35 55%,#07142b);color:#e8efff; }
.site-header { background:rgba(5,16,38,.86);border-bottom-color:rgba(150,196,228,.14);box-shadow:0 8px 30px rgba(0,0,0,.18); }
.site-header.is-scrolled { background:rgba(5,16,38,.96);border-bottom-color:rgba(242,202,120,.17); }
.brand-text strong { color:#f4f5ff; }
.brand-text small { color:#9bdcf4; }
.nav-links a { color:#c4d3e8; }
.nav-links a:hover,.nav-links .nav-panel { color:#ffe0a0; }
.nav-links a::after { background:#7dd6f1; }
.nav-toggle span { background:#f0f4ff; }
.btn-gold { color:#132542;background:linear-gradient(120deg,#ffe29a,#f0bf68 54%,#8bdff2);box-shadow:0 10px 28px rgba(226,181,93,.2),0 0 18px rgba(103,203,233,.08); }
.btn-gold:hover { color:#10213d;box-shadow:0 14px 32px rgba(226,181,93,.3),0 0 25px rgba(103,203,233,.13); }
.btn-ghost { color:#b9eaff;border-color:rgba(143,204,233,.34);background:rgba(10,29,58,.76); }
.btn-ghost:hover { color:#ffe5a6;border-color:rgba(242,202,120,.5);background:rgba(18,43,80,.92); }
.hero { background:radial-gradient(ellipse at 76% 24%,rgba(72,123,208,.28),transparent 34%),radial-gradient(ellipse at 24% 72%,rgba(215,153,83,.12),transparent 38%),linear-gradient(135deg,#081831,#102649 54%,#08172f); }
.hero-overlay { background-image:var(--hex-pattern),radial-gradient(ellipse at 12% 70%,rgba(96,202,217,.12),transparent 38%),linear-gradient(120deg,rgba(7,20,43,.46),rgba(8,24,49,.1)); }
.hero-overlay::after { background:linear-gradient(180deg,rgba(7,20,43,.06),transparent 52%,rgba(7,20,43,.78)); }
.hero-title { color:#f3f6ff;text-shadow:0 5px 32px rgba(72,136,219,.2); }
.hero-title .gold,.gold { background:linear-gradient(112deg,#ffe6a8 0%,#f1c56e 45%,#9fe4ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent; }
.hero-kicker,.hero-note { color:#a7e5fb; }
.hero-lead { color:#d1deef; }
.hero-lead strong { color:#ffe1a0; }
.hero-scroll { color:#a7b9d1; }
.countdown .cd-unit { border-color:rgba(165,209,238,.19);background:rgba(10,30,62,.72);box-shadow:0 10px 28px rgba(0,0,0,.2),inset 0 1px rgba(255,255,255,.04); }
.countdown .cd-unit strong { color:#ffe09a; }
.countdown .cd-unit span { color:#a9bed7; }
.launch-wrap { background:#08172f; }
.launch-panel { border-color:rgba(242,202,120,.22);background:linear-gradient(125deg,rgba(17,40,76,.98),rgba(9,26,54,.98));box-shadow:0 20px 55px rgba(0,0,0,.26),inset 0 1px rgba(255,255,255,.045); }
.launch-head span,.launch-meta>span { color:#adbed6; }
.launch-head strong,.launch-meta strong { color:#f3f5ff; }
.launch-meta small { color:#9db0ca; }
.launch-divider { background:rgba(177,206,233,.15); }
.progress-track { background:rgba(4,15,34,.8); }
.progress-track>span { background:linear-gradient(90deg,#4ebfe5,#76d9ee,#f2c66e);box-shadow:0 0 16px rgba(78,191,229,.28); }
.launch-progress>p,.launch-progress>p b { color:#c2d1e5; }
.section-head h2,.prereg-copy h2,.details-copy h2,.faq-head h2 { color:#f2f5ff; }
.section-head .eyebrow,.eyebrow { color:#9fe2f7; }
.eyebrow::before,.section-head.center .eyebrow::after { background:#e9be6d;box-shadow:0 0 12px rgba(233,190,109,.35); }
.section-lead,.details-copy>p:not(.eyebrow),.prereg-copy>p:not(.eyebrow),.faq-head>p:not(.eyebrow) { color:#b9c9df; }
.rewards,.features,.details,.prereg { background-color:#08172f;background-image:var(--hex-pattern),radial-gradient(ellipse at 11% 20%,rgba(94,83,177,.22),transparent 34%),radial-gradient(ellipse at 86% 80%,rgba(43,161,192,.15),transparent 36%),linear-gradient(180deg,#08172f,#0b1e3c 58%,#07142b);border-color:rgba(163,201,229,.12); }
.rewards::before { opacity:.44;background-image:var(--hex-pattern),radial-gradient(ellipse at 70% 36%,rgba(246,175,89,.1),transparent 46%); }
.details::before,.details::after { border-color:rgba(124,199,232,.15); }
.reward-card,.feature-card,.spec-card,.form-card,.mini-progress,.date-card,.queue-card { border-color:rgba(156,194,225,.18);background:linear-gradient(145deg,rgba(18,42,79,.94),rgba(10,27,56,.96));box-shadow:0 15px 38px rgba(0,0,0,.2),inset 0 1px rgba(255,255,255,.035); }
.reward-card:hover,.feature-card:hover { border-color:rgba(242,202,120,.42);box-shadow:0 21px 44px rgba(0,0,0,.28),0 0 26px rgba(71,183,223,.08); }
.reward-card::before { background:linear-gradient(90deg,transparent,#f2ca78,#7bd2ee,transparent); }
.reward-card::after { background:radial-gradient(circle,rgba(84,185,222,.16),transparent 68%); }
.reward-index,.feature-index { color:rgba(180,211,239,.2); }
.reward-icon,.feature-icon { color:#8bdcf4;border-color:rgba(126,207,236,.22);background:linear-gradient(145deg,rgba(34,72,117,.65),rgba(19,45,83,.78)); }
.reward-type,.reward-tag,.reward-note { color:#f0cb7d; }
.reward-card h3,.feature-card h3 { color:#f3f5ff; }
.reward-sub,.reward-desc,.feature-card p { color:#b6c7dc; }
.feature-card { border-color:rgba(156,194,225,.18); }
.feature-card:hover { background:linear-gradient(145deg,rgba(24,53,95,.98),rgba(13,34,66,.98)); }
.date-card>span,.spec-list dd em { color:#f0cb7d; }
.date-card strong,.spec-head>span:first-child,.spec-list dt { color:#eef4ff; }
.date-card small,.spec-list dd,.spec-note { color:#afc1d9; }
.spec-head,.spec-list>div { border-color:rgba(162,199,227,.16); }
.live-dot { color:#7ce0b2; }
.prereg { border-color:rgba(242,202,120,.13); }
.perk-list li { color:#c8d5e6; }
.perk-list li::before { border-color:rgba(242,202,120,.42); }
.mini-progress-top span,.mini-progress small { color:#b0c1d7; }
.mini-progress-top strong { color:#9bdcf4; }
.form-card { border-color:rgba(242,202,120,.24);background:linear-gradient(150deg,rgba(16,38,75,.98),rgba(8,25,53,.98)); }
.form-card::before,.form-card::after { border-color:rgba(126,207,236,.32); }
.form-kicker { color:#9bdcf4; }
.form-head h3 { color:#f4f6ff; }
.seat-badge { color:#ffe09a;background:rgba(242,202,120,.1);border-color:rgba(242,202,120,.24); }
.field label { color:#d8e4f3; }
.field label em { color:#9bafc9; }
.field input,.field select { color:#eff5ff;border-color:rgba(157,199,230,.23);background:rgba(4,17,39,.78);color-scheme:dark; }
.field input::placeholder { color:#788eac; }
.field input:hover,.field select:hover { border-color:rgba(126,207,236,.46); }
.field input:focus,.field select:focus { border-color:#79d5ef;box-shadow:0 0 0 4px rgba(75,183,221,.14); }
.consent { color:#bdcce0; }
.consent a { color:#9ee3fa; }
.form-foot,.success-note { color:#9fb2cb; }
.form-success { color:#e7effd; }
.form-success h3 { color:#ffe09a; }
.queue-card>span,.queue-card small { color:#aec0d7; }
.queue-card strong { color:#a4e2f5; }
.site-footer { color:#dce8f7;border-color:rgba(155,195,225,.16);background:linear-gradient(180deg,#08172f,#050d1e); }
.footer-brand .brand-text strong,.footer-col h3,.privacy-note strong { color:#f1f4ff; }
.footer-brand>p,.footer-col a,.footer-bottom p,.privacy-note { color:#adbed4; }
.footer-col a:hover { color:#ffe1a0; }
.footer-bottom,.privacy-note { border-color:rgba(160,198,227,.15); }
.privacy-note { border-radius:12px;background:rgba(15,35,68,.72); }
@media (max-width:760px) {
  .nav-links { border-color:rgba(149,194,225,.2);background:rgba(6,19,43,.98);box-shadow:0 18px 48px rgba(0,0,0,.42); }
  .nav-links a { color:#d6e4f5; }
  .nav-links a:hover,.nav-links .nav-panel { color:#ffe1a0; }
}
@media (max-width:1040px) {
 .hero-content { grid-template-columns:minmax(0,1fr);max-width:760px;width:min(100% - 48px,760px);gap:38px; }
 .hero-copy { max-width:720px;margin-inline:auto;text-align:center; }
 .hero-kicker,.hero-note,.hero-actions { justify-content:center; }
 .hero-title { font-size:clamp(2.5rem,6vw,4.1rem); }
 .hero-illustration { max-width:440px; }
 .hero { padding-top:125px; }
}
@media (max-width:600px) {
 .hero-content { width:min(100% - 32px,520px);gap:28px; }
 .hero { min-height:0;padding:116px 0 56px; }
 .hero-title { font-size:clamp(2.45rem,12vw,3.5rem); }
 .hero-illustration { max-width:min(100%,460px);padding:6px;border-radius:20px; }
 .hero-illustration img { border-radius:14px; }
 .hero-illustration figcaption { font-size:.72rem; }
 .credential-grid { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) { .hero-illustration,.reward-card,.feature-card,.faq-list details { transition:none; } .hero::before,.hero-art-badge,.rewards,.features,.details,.prereg,.faq,.faq::after { animation:none !important; } }