
:root{
  --bg:#031116; --bg2:#06242c; --ink:#eefbfb; --muted:#b8cbd0;
  --line:rgba(255,255,255,.14); --glass:rgba(4,18,22,.62); --glass2:rgba(8,35,42,.82);
  --gold:#f6c14f; --orange:#ff9f43; --teal:#2ed3c6; --cyan:#45d8ff; --green:#a8ee65; --blue:#48a6ff; --violet:#9b76ff;
  --shadow:0 30px 90px rgba(0,0,0,.50); --max:1220px; --radius:30px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0; font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif; color:var(--ink); line-height:1.65; background:
  radial-gradient(circle at 10% 10%,rgba(46,211,198,.17),transparent 28%),
  radial-gradient(circle at 85% 15%,rgba(246,193,79,.12),transparent 24%),
  linear-gradient(180deg,#041014 0%,#071f26 48%,#031116 100%); overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;z-index:-3;background:url("assets/media/hero-poster.png") center/cover no-repeat;opacity:.10;filter:blur(14px) saturate(1.08);transform:scale(1.06)}
body:after{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(circle at var(--mouse-x,50%) var(--mouse-y,35%),rgba(46,211,198,.22),transparent 22%),
  linear-gradient(90deg,rgba(3,17,22,.92) 0%,rgba(3,17,22,.52) 54%,rgba(3,17,22,.86) 100%)}
img{max-width:100%;display:block} a{color:inherit;text-decoration:none} p{margin:0 0 1rem} h1,h2,h3,h4{margin:0 0 1rem;line-height:1.06}
.container{width:min(calc(100% - 2rem),var(--max));margin:auto}.section{padding:5.2rem 0}.section-sm{padding:3rem 0}
.kicker{font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;font-weight:950;color:var(--gold)}
.title-xl{font-size:clamp(3rem,6.2vw,5.8rem);letter-spacing:-.065em}.title-lg{font-size:clamp(2.15rem,4.2vw,3.75rem);letter-spacing:-.045em}.title-md{font-size:clamp(1.45rem,2.25vw,2.15rem);letter-spacing:-.03em}
.lead{font-size:clamp(1.05rem,1.35vw,1.22rem);color:#dcecef;max-width:67ch}.muted{color:var(--muted)}
.progress{position:fixed;top:0;left:0;height:4px;width:0;z-index:3000;background:linear-gradient(90deg,var(--teal),var(--gold),var(--orange));box-shadow:0 0 30px rgba(46,211,198,.75)}
.site-header{position:sticky;top:0;z-index:2000;background:linear-gradient(90deg,rgba(2,14,18,.85),rgba(5,25,31,.76));border-bottom:1px solid rgba(255,255,255,.13);backdrop-filter:blur(20px)}
.nav{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:1rem}.brand{display:flex;align-items:center;gap:.85rem;font-weight:950;letter-spacing:-.02em}.brand-mark{width:82px;height:44px;display:grid;place-items:center;overflow:visible}.brand img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(0,0,0,.35))}
.nav-links{display:flex;align-items:center;gap:.42rem;flex-wrap:wrap}.nav-links a,.lang-toggle{border:1px solid transparent;background:transparent;color:#d4e6e9;padding:.72rem .92rem;border-radius:999px;font-weight:900;cursor:pointer;transition:.22s}.nav-links a:hover,.nav-links a.active,.lang-toggle:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.10);color:#fff}.lang-toggle{color:var(--gold)}.nav-toggle{display:none;border:1px solid var(--line);background:rgba(255,255,255,.07);color:#fff;border-radius:999px;padding:.75rem 1rem;font-weight:950}
.hero{position:relative;min-height:calc(100vh - 78px);display:grid;align-items:center;isolation:isolate;overflow:hidden}.hero:before{content:"";position:absolute;inset:0;z-index:-2;background:url("assets/media/hero-poster.png") center/cover no-repeat;filter:saturate(1.08) contrast(1.04);transform:scale(1.02)}.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:
  linear-gradient(90deg,rgba(2,13,17,.94) 0%,rgba(2,13,17,.76) 45%,rgba(2,13,17,.24) 100%),
  linear-gradient(180deg,rgba(2,13,17,.2),rgba(2,13,17,.88)),
  radial-gradient(circle at 25% 40%,rgba(46,211,198,.22),transparent 34%)}
.hero-grid{display:grid;grid-template-columns:1fr .92fr;gap:clamp(2rem,4vw,4.5rem);align-items:center;padding:clamp(3.5rem,6vw,6.6rem) 0}.hero-copy{max-width:650px}.hero-box{margin-top:1.3rem;padding:1.2rem 1.35rem;border:1px solid rgba(255,255,255,.16);border-radius:26px;background:linear-gradient(135deg,rgba(4,20,25,.72),rgba(6,30,36,.42));backdrop-filter:blur(14px);box-shadow:var(--shadow)}
.hero-ctas{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:1.2rem}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.96rem 1.2rem;border-radius:999px;border:1px solid transparent;font-weight:950;transition:.28s;position:relative;overflow:hidden}.btn.primary{background:linear-gradient(135deg,var(--teal),var(--gold));color:#061a1e;box-shadow:0 20px 42px rgba(46,211,198,.26)}.btn.secondary{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.13)}.btn:hover{transform:translateY(-3px)}
.author{display:inline-flex;margin-top:1rem;padding:.72rem 1rem;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);font-weight:800}.hero-show{display:grid;gap:1rem;justify-items:end}.hero-logo,.hero-poster{border:1px solid rgba(255,255,255,.16);border-radius:32px;background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.035));backdrop-filter:blur(14px);box-shadow:var(--shadow);padding:1rem}.hero-logo{width:min(100%,560px)}.hero-logo img{margin:auto;filter:drop-shadow(0 28px 44px rgba(0,0,0,.46))}.hero-poster{width:min(100%,430px);justify-self:center}.stage{background:linear-gradient(180deg,#fbf8f2,#eee7dc);border-radius:22px;padding:.78rem;display:grid;place-items:center}.stage img,.hero-poster img{width:100%;height:auto;object-fit:contain;border-radius:16px}
.panel,.stat,.feature-card,.gallery-card,.tool-card,.quote-card,.nav-card,.video-wrap,.faq-card,.timeline-item,.detail-card,.tab-panel{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.14);border-radius:var(--radius);background:linear-gradient(180deg,var(--glass),var(--glass2));box-shadow:var(--shadow)}
.glow-card{transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}.glow-card:after{content:"";position:absolute;inset:-45%;pointer-events:none;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(46,211,198,.32),transparent 18%);opacity:0;transition:opacity .25s}.glow-card:hover{transform:translateY(-8px);border-color:rgba(46,211,198,.52);box-shadow:0 38px 90px rgba(0,0,0,.56),0 0 0 1px rgba(46,211,198,.08)}.glow-card:hover:after{opacity:1}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem}.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.split{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;align-items:start}.stack{display:grid;gap:1.2rem}.section-head{display:flex;justify-content:space-between;align-items:end;gap:1.4rem;margin-bottom:1.6rem}.section-head p{max-width:70ch}
.stat-wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.stat{padding:1.25rem}.stat strong{display:block;color:var(--gold);font-size:2rem;line-height:1}.stat span{display:block;color:var(--muted);margin-top:.45rem}.feature-card,.gallery-card,.tool-card,.quote-card,.nav-card,.detail-card,.tab-panel{padding:1rem}.feature-thumb{margin-bottom:1rem}.feature-thumb .stage,.gallery-card .stage,.tool-card .stage{min-height:280px}.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem}.meta{display:flex;justify-content:space-between;gap:1rem;margin-top:.9rem}.open{font-weight:950;color:var(--teal);white-space:nowrap}.pills{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.8rem}.pill{display:inline-flex;padding:.44rem .75rem;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);font-size:.86rem;font-weight:900}
.tabs{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0 1.2rem}.tab-btn{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#fff;padding:.75rem 1rem;border-radius:999px;font-weight:900;cursor:pointer}.tab-btn.active{background:linear-gradient(135deg,var(--teal),var(--gold));color:#061a1e}.tab-panel{display:none}.tab-panel.active{display:block}.marquee{overflow:hidden;border-block:1px solid rgba(255,255,255,.11);background:rgba(255,255,255,.04)}.marquee-track{display:flex;gap:2rem;width:max-content;padding:1rem 0;animation:marquee 28s linear infinite}.marquee span{font-weight:950;color:var(--gold);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}@keyframes marquee{to{transform:translateX(-50%)}}
.video-grid{display:grid;grid-template-columns:minmax(280px,390px) 1fr;gap:1.6rem;align-items:start}.video-wrap{padding:1rem}.video-frame{max-width:380px;margin:auto}.video-player{display:block;width:100%;max-height:76vh;background:#000;border-radius:22px;box-shadow:0 22px 70px rgba(0,0,0,.55)}.caption{padding-top:1rem;color:var(--muted)}.tool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem}
.timeline{display:grid;gap:1rem}.timeline-item{padding:1.15rem}.timeline-item strong{display:block;color:var(--gold);margin-bottom:.35rem}pre.code{margin:0;padding:1rem 1.1rem;white-space:pre-wrap;overflow:auto;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.12);border-radius:20px;color:#e2fbf6}
.faq-list{display:grid;gap:.8rem}details.faq-item{padding:1rem;border:1px solid rgba(255,255,255,.12);border-radius:20px;background:rgba(255,255,255,.06)}details summary{cursor:pointer;font-weight:950;list-style:none}details summary::-webkit-details-marker{display:none}details summary:after{content:"+";float:right;color:var(--gold)}details[open] summary:after{content:"–"}details p{margin:.75rem 0 0;color:var(--muted)}
.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:.85rem;border-bottom:1px solid rgba(255,255,255,.12);text-align:left;vertical-align:top}th{color:var(--gold)}td{color:#dcecee}
.footer{padding:2.4rem 0 3.4rem;border-top:1px solid rgba(255,255,255,.12);margin-top:3rem}.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:1.4rem}.footer p,.footer small{color:var(--muted)}.footer-links{display:grid;gap:.45rem}.footer-links a{color:#e3f1f3}.top-btn{position:fixed;right:1rem;bottom:1rem;z-index:2200;width:54px;height:54px;border-radius:50%;border:0;background:linear-gradient(135deg,var(--teal),var(--gold));color:#061a1e;font-weight:950;cursor:pointer;box-shadow:0 18px 40px rgba(0,0,0,.42);opacity:0;transform:translateY(12px);transition:.28s}.top-btn.show{opacity:1;transform:translateY(0)}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .72s ease,transform .72s ease}.reveal.on{opacity:1;transform:none}.lightbox{position:fixed;inset:0;z-index:3001;display:none;place-items:center;padding:2rem;background:rgba(2,10,12,.9);backdrop-filter:blur(18px)}.lightbox.open{display:grid;animation:fadeIn .24s}.lightbox-inner{position:relative;max-width:min(94vw,1400px);max-height:90vh}.lightbox-inner img{max-width:100%;max-height:84vh;border-radius:24px;background:#fbf8f2;padding:.8rem;box-shadow:0 30px 90px rgba(0,0,0,.68);animation:zoomIn .28s}.lightbox-close,.lightbox-prev,.lightbox-next{position:absolute;border:0;cursor:pointer;font-weight:950;background:linear-gradient(135deg,var(--gold),var(--orange));color:#111;box-shadow:0 12px 30px rgba(0,0,0,.35)}.lightbox-close{top:-14px;right:-14px;width:46px;height:46px;border-radius:50%;font-size:1.2rem}.lightbox-prev,.lightbox-next{top:50%;transform:translateY(-50%);width:48px;height:62px;border-radius:999px}.lightbox-prev{left:-64px}.lightbox-next{right:-64px}.lightbox-caption{text-align:center;color:#d8ecef;margin-top:.8rem;font-weight:800}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes zoomIn{from{opacity:.35;transform:scale(.94)}to{opacity:1;transform:scale(1)}}
@media(max-width:1080px){.hero-grid,.split,.video-grid,.tool-grid,.gallery-grid{grid-template-columns:1fr}.hero-show{justify-items:start}.grid-3,.stat-wrap{grid-template-columns:1fr 1fr}.nav-toggle{display:inline-flex}.nav-links{display:none;position:absolute;top:78px;left:1rem;right:1rem;flex-direction:column;align-items:stretch;padding:1rem;border-radius:24px;background:rgba(3,14,18,.97);border:1px solid rgba(255,255,255,.13);box-shadow:var(--shadow)}.nav-links.open{display:flex}.lightbox-prev{left:6px}.lightbox-next{right:6px}}
@media(max-width:680px){.container{width:min(calc(100% - 1rem),var(--max))}.hero{min-height:auto}.hero-grid{padding:3rem 0}.title-xl{font-size:2.75rem}.grid-2,.grid-3,.grid-4,.stat-wrap{grid-template-columns:1fr}.section{padding:4rem 0}.section-head{display:block}.feature-thumb .stage,.gallery-card .stage,.tool-card .stage{min-height:auto}.brand span{display:none}.brand-mark{width:72px}}


/* === v5 premium interaction and SEO-content layer === */
.gradient-text,
.title-xl,
.title-lg {
  background: linear-gradient(110deg, #ffffff 0%, #b9fff4 18%, #f6c14f 38%, #ff9f43 55%, #48cfe8 74%, #ffffff 100%);
  background-size: 240% 240%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: gradientShift 7.5s ease-in-out infinite;
  text-shadow: 0 0 34px rgba(46,211,198,.10);
}
@keyframes gradientShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.kicker-gradient {
  background: linear-gradient(90deg,var(--gold),var(--teal),var(--orange));
  background-size: 180% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: gradientShift 6s ease-in-out infinite;
}
.interactive-shell {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 34px;
  background:
    radial-gradient(circle at var(--mx,50%) var(--my,50%), rgba(46,211,198,.18), transparent 22%),
    linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow: var(--shadow);
}
.longform {
  font-size: 1.02rem;
  color: #dbecee;
}
.longform p {
  color: #dbecee;
}
.longform strong {
  color: #ffffff;
}
.keyword-row {
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  margin-top:1rem;
}
.keyword-chip {
  border:1px solid rgba(255,255,255,.13);
  background:rgba(255,255,255,.07);
  padding:.5rem .78rem;
  border-radius:999px;
  color:#e7f6f8;
  font-weight:850;
  font-size:.9rem;
}
.mission-map {
  display:grid;
  grid-template-columns: .9fr 1.1fr;
  gap:1.3rem;
  align-items:stretch;
}
.mission-list {
  display:grid;
  gap:.65rem;
}
.mission-btn {
  text-align:left;
  width:100%;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(255,255,255,.065);
  color:#fff;
  border-radius:22px;
  padding:1rem 1.05rem;
  cursor:pointer;
  font-weight:950;
  transition:.25s ease;
}
.mission-btn small {
  display:block;
  color:var(--muted);
  margin-top:.15rem;
  font-weight:700;
}
.mission-btn.active,
.mission-btn:hover {
  background:linear-gradient(135deg, rgba(46,211,198,.23), rgba(246,193,79,.18));
  border-color:rgba(46,211,198,.48);
  transform:translateX(5px);
}
.mission-output {
  min-height: 100%;
  padding:1.25rem;
}
.mission-output h3 {
  color:#fff;
}
.mission-output .mission-icon {
  font-size:2rem;
  margin-bottom:.6rem;
}
.process-rail {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
}
.process-step {
  position:relative;
  padding:1.2rem;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.13);
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
}
.process-step::before {
  content: attr(data-step);
  display:inline-grid;
  place-items:center;
  width:36px;
  height:36px;
  border-radius:50%;
  margin-bottom:.85rem;
  background:linear-gradient(135deg,var(--teal),var(--gold));
  color:#061a1e;
  font-weight:950;
}
.seo-toc {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.8rem;
}
.seo-toc a {
  padding:.85rem 1rem;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  font-weight:900;
  color:#eaf9fa;
  transition:.25s;
}
.seo-toc a:hover {
  transform:translateY(-4px);
  border-color:rgba(46,211,198,.45);
  background:rgba(46,211,198,.12);
}
.finale-card {
  padding:1.45rem;
  border-radius:32px;
  border:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(circle at 20% 20%,rgba(246,193,79,.12),transparent 28%),
    radial-gradient(circle at 80% 0%,rgba(46,211,198,.16),transparent 24%),
    linear-gradient(180deg,var(--glass),var(--glass2));
  box-shadow:var(--shadow);
}
.finale-card p {
  color:#dbecee;
}
.score-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
}
.score-card {
  padding:1.05rem;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
}
.score-card strong {
  display:block;
  color:var(--gold);
  font-size:1.45rem;
  line-height:1.1;
}
.score-card span {
  display:block;
  color:var(--muted);
  margin-top:.4rem;
}
.reveal-line {
  display:inline-block;
  position:relative;
}
.reveal-line::after {
  content:"";
  position:absolute;
  left:0;
  bottom:-.14em;
  width:100%;
  height:.12em;
  background:linear-gradient(90deg,var(--teal),var(--gold));
  transform:scaleX(0);
  transform-origin:left;
  animation: underlineGrow 1.4s ease forwards;
}
@keyframes underlineGrow { to { transform: scaleX(1); } }
.card-tilt {
  transform-style:preserve-3d;
  perspective: 1200px;
}
.card-tilt:hover .stage,
.card-tilt:hover .feature-thumb {
  transform:translateZ(12px) scale(1.012);
}
.card-tilt .stage,
.card-tilt .feature-thumb {
  transition:.28s ease;
}
@media(max-width:1080px){
  .mission-map,.process-rail,.seo-toc,.score-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .mission-map,.process-rail,.seo-toc,.score-grid{grid-template-columns:1fr}
}


/* === final surgical fixes: design freeze, header/logo, responsive, title clipping === */
.site-header .nav{min-height:66px;align-items:center}
.site-header .brand{align-items:center}
.site-header .brand-mark{width:78px;height:42px;flex:0 0 auto;display:grid;place-items:center}
.site-header .brand img{width:100%;height:100%;object-fit:contain;max-width:100%;max-height:100%}
.title-xl,.title-lg{line-height:1.18;padding:.06em 0 .17em;overflow:visible}
.btn{box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 16px 32px rgba(0,0,0,.32),0 5px 0 rgba(0,0,0,.20)}
a[data-lightbox].tool-card, a[data-lightbox].hero-logo, a[data-lightbox].hero-poster{display:block;color:inherit;text-decoration:none;cursor:pointer}
a[data-lightbox] .tool-card{padding:0;background:transparent;border:0;box-shadow:none;overflow:visible}
@media(max-width:1080px){.nav-links{top:66px}.site-header .nav{min-height:66px}.site-header .brand-mark{width:80px;height:42px}}
@media(max-width:680px){.brand span:not(.brand-mark){display:none}.site-header .brand-mark{width:82px;height:44px}.title-xl{font-size:2.65rem;line-height:1.2}.title-lg{line-height:1.2}}


/* === Award final-touch layer: preserves the frozen v5 layout === */
.site-header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--teal),var(--gold),var(--violet),transparent);background-size:220% 100%;animation:headerFlow 8s linear infinite;opacity:.75;pointer-events:none}
@keyframes headerFlow{to{background-position:220% 0}}
.site-header .brand-mark{width:86px;height:54px}
.site-header .brand img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 9px 18px rgba(0,0,0,.45)) drop-shadow(0 0 12px rgba(46,211,198,.12))}
.nav-links .nav-play{color:#08151a;background:linear-gradient(135deg,var(--gold),var(--orange));border-color:rgba(255,255,255,.35);box-shadow:0 0 0 1px rgba(246,193,79,.2),0 10px 26px rgba(255,159,67,.22);position:relative;overflow:hidden}
.nav-links .nav-play::after{content:"";position:absolute;inset:-60% -40%;background:linear-gradient(115deg,transparent 34%,rgba(255,255,255,.65) 48%,transparent 62%);transform:translateX(-65%);animation:playSweep 4.8s ease-in-out infinite}
@keyframes playSweep{0%,62%{transform:translateX(-65%)}82%,100%{transform:translateX(65%)}}
.btn.play-cta{color:white;background:linear-gradient(135deg,#7157ff 0%,#15d2d0 52%,#f6c14f 100%);background-size:180% 180%;border-color:rgba(255,255,255,.42);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 8px 0 rgba(23,12,72,.55),0 20px 48px rgba(113,87,255,.38),0 0 42px rgba(46,211,198,.22);animation:playGradient 6s ease infinite}
.btn.play-cta:hover{transform:translateY(-5px) scale(1.025);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 5px 0 rgba(23,12,72,.55),0 28px 62px rgba(113,87,255,.48),0 0 54px rgba(46,211,198,.32)}
.btn.play-cta.xl{font-size:1.08rem;padding:1.08rem 1.45rem}
@keyframes playGradient{50%{background-position:100% 50%}}
.play-section{position:relative;isolation:isolate}
.play-section::before{content:"";position:absolute;width:420px;height:420px;right:6%;top:8%;border-radius:50%;background:radial-gradient(circle,rgba(113,87,255,.22),transparent 68%);filter:blur(18px);z-index:-1;animation:orbDrift 9s ease-in-out infinite alternate}
@keyframes orbDrift{to{transform:translate(-8%,14%) scale(1.12)}}
.game-showcase{min-height:560px;padding:clamp(1.2rem,3vw,2.2rem);display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(1.2rem,3vw,2.4rem);align-items:center;overflow:hidden;background:linear-gradient(110deg,rgba(4,18,22,.94),rgba(6,30,36,.72)),url("game/assets/bg_map.png") center/cover no-repeat;border-color:rgba(113,87,255,.35)}
.game-showcase::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 15%,rgba(255,255,255,.06) 48%,transparent 75%);transform:translateX(-100%);animation:showcaseSheen 10s ease-in-out infinite;pointer-events:none}
@keyframes showcaseSheen{0%,72%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.game-showcase-copy{position:relative;z-index:2;max-width:570px}
.status-pill{display:inline-flex;align-items:center;gap:.55rem;padding:.48rem .78rem;border-radius:999px;background:rgba(6,22,28,.72);border:1px solid rgba(255,255,255,.16);font-weight:900;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase}
.status-pill i{width:9px;height:9px;border-radius:50%;background:#6fff8a;box-shadow:0 0 18px #6fff8a;animation:pulseDot 1.7s ease-in-out infinite}
@keyframes pulseDot{50%{transform:scale(.72);opacity:.55}}
.game-showcase-logo{width:min(100%,430px);height:auto;margin:1.1rem 0;filter:drop-shadow(0 25px 42px rgba(0,0,0,.58))}
.game-actions{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:1.2rem}
.game-window{position:relative;display:block;border-radius:28px;padding:.7rem;background:linear-gradient(135deg,rgba(255,255,255,.22),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.25);box-shadow:0 34px 90px rgba(0,0,0,.58);transform:perspective(1200px) rotateY(-4deg) rotateX(2deg);transition:.35s ease;overflow:hidden;cursor:pointer}
.game-window:hover{transform:perspective(1200px) rotateY(0) rotateX(0) translateY(-7px);border-color:rgba(46,211,198,.55);box-shadow:0 44px 100px rgba(0,0,0,.62),0 0 52px rgba(46,211,198,.18)}
.game-window img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:21px}
.game-window-overlay{position:absolute;inset:.7rem;display:grid;place-items:center;align-content:center;gap:.7rem;border-radius:21px;background:linear-gradient(180deg,rgba(2,12,16,.08),rgba(2,12,16,.76));opacity:.88;transition:.3s}
.game-window:hover .game-window-overlay{opacity:1;background:linear-gradient(180deg,rgba(2,12,16,.02),rgba(2,12,16,.58))}
.play-disc{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--orange));color:#071319;font-size:1.5rem;padding-left:.2rem;box-shadow:0 0 0 10px rgba(255,255,255,.08),0 18px 42px rgba(0,0,0,.42),0 0 42px rgba(246,193,79,.32);transition:.28s}
.game-window:hover .play-disc{transform:scale(1.12)}
.editorial-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-bottom:1rem}
.editorial-card{padding:1.15rem;border-radius:24px;border:1px solid rgba(255,255,255,.1);background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.025));min-height:100%;position:relative}
.editorial-card p{margin:0;color:#dbecee}
.editorial-index{display:inline-flex;margin-bottom:.75rem;color:var(--gold);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;font-weight:950}
.learning-deck .section-head.compact{margin-bottom:1.2rem}
.flip-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.flip-card{height:310px;perspective:1200px;cursor:pointer;outline:none}
.flip-card-inner{position:relative;width:100%;height:100%;transition:transform .7s cubic-bezier(.2,.75,.2,1);transform-style:preserve-3d}
.flip-card.is-flipped .flip-card-inner{transform:rotateY(180deg)}
.flip-face{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:1.2rem;border-radius:26px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(160deg,rgba(8,35,42,.95),rgba(4,18,22,.92));box-shadow:var(--shadow);backface-visibility:hidden;overflow:hidden}
.flip-face::before{content:"";position:absolute;inset:-45%;background:radial-gradient(circle at 25% 20%,rgba(46,211,198,.22),transparent 26%);pointer-events:none}
.flip-back{transform:rotateY(180deg);background:linear-gradient(145deg,rgba(66,41,135,.95),rgba(5,28,35,.96))}
.flip-icon{font-size:2.5rem;margin-bottom:.7rem;filter:drop-shadow(0 12px 20px rgba(0,0,0,.4))}
.flip-face h3{font-size:1.45rem;margin-bottom:.5rem}
.flip-face p{color:#dcebee;margin:0}
.flip-hint{margin-top:auto;color:var(--gold);font-weight:900;font-size:.82rem;text-transform:uppercase;letter-spacing:.12em}
.flip-card:focus-visible .flip-face{outline:3px solid var(--gold);outline-offset:3px}
.sitemap-clickable tbody tr[data-row-href],table tr[data-row-href]{cursor:pointer;transition:background .24s,transform .24s,box-shadow .24s}
table tr[data-row-href]:hover,table tr[data-row-href]:focus-visible{background:linear-gradient(90deg,rgba(46,211,198,.12),rgba(113,87,255,.10));box-shadow:inset 3px 0 0 var(--teal);transform:translateX(3px);outline:none}
.section{content-visibility:auto;contain-intrinsic-size:800px}
:focus-visible{outline:3px solid var(--gold);outline-offset:4px}
@media(max-width:1080px){.site-header .brand-mark{width:82px;height:52px}.game-showcase{grid-template-columns:1fr}.editorial-grid{grid-template-columns:1fr}.flip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.site-header .brand-mark{width:84px;height:54px}.game-showcase{min-height:auto;padding:1rem}.game-showcase-logo{max-width:320px}.game-window{transform:none}.flip-grid{grid-template-columns:1fr}.flip-card{height:280px}.nav-links .nav-play{text-align:center}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.game-window{transform:none}.card-tilt{transform:none!important}}


/* ========================================================================== */
/* Release final: targeted fixes on the frozen v5 design                      */
/* ========================================================================== */
.site-header .nav{min-height:64px;align-items:center}
.site-header .brand{gap:.62rem;min-width:max-content;font-size:.98rem;line-height:1}
.site-header .brand-mark{width:52px;height:44px;flex:0 0 52px;display:grid;place-items:center;overflow:visible}
.site-header .brand-mark img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;filter:drop-shadow(0 7px 14px rgba(0,0,0,.46))}
.nav-links{gap:.28rem}
.nav-links a,.lang-toggle{padding:.61rem .78rem}

/* Keep the full hero composition, but establish visual hierarchy correctly. */
.hero{min-height:calc(100vh - 64px)}
.hero-grid{align-items:start;padding-top:clamp(2.2rem,4.5vw,4rem);padding-bottom:clamp(3rem,6vw,5rem)}
.hero-copy{padding-top:clamp(3rem,8vh,6.2rem)}
.hero-show{align-content:start;justify-items:end;gap:.9rem}
.hero-logo{width:min(100%,410px);padding:.72rem;border-radius:28px}
.hero-logo img{display:block;width:auto;height:auto;max-width:100%;max-height:350px;object-fit:contain;margin:auto}
.hero-poster{width:min(100%,285px);padding:.72rem}
.hero-poster .stage{padding:.58rem}
.hero-ctas .btn{min-height:52px}

/* Dedicated game CTA is the only play emphasis in the portfolio navigation. */
.game-actions .play-cta{background:linear-gradient(135deg,#ff9f43 0%,#f6c14f 42%,#2ed3c6 100%);color:#061a1e;border-color:rgba(255,255,255,.48);box-shadow:inset 0 1px 0 rgba(255,255,255,.64),0 7px 0 rgba(78,48,8,.48),0 22px 52px rgba(246,193,79,.34),0 0 48px rgba(46,211,198,.22)}
.game-actions .play-cta:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 4px 0 rgba(78,48,8,.48),0 30px 66px rgba(246,193,79,.44),0 0 62px rgba(46,211,198,.3)}

/* Long pages remain editorial and breathable instead of becoming text walls. */
.section-block{padding:0}
.section-block .detail-card h3,.asset-context .detail-card h3{font-size:1.28rem;margin-bottom:.6rem}
.production-timeline{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.production-timeline .timeline-item{min-height:100%;padding:1.15rem}
.production-timeline .timeline-item p{color:var(--muted);margin-bottom:0}

/* Sitemap: no horizontal scrollbar. On small screens rows become cards. */
.sitemap-table-wrap{overflow:visible!important;max-width:100%}
.sitemap-table{table-layout:fixed;width:100%}
.sitemap-table th:first-child,.sitemap-table td:first-child{width:30%}
.sitemap-table th,.sitemap-table td{white-space:normal;overflow-wrap:anywhere;word-break:normal}
.sitemap-table tr[data-row-href]{cursor:pointer;transition:background .22s ease,transform .22s ease}
.sitemap-table tr[data-row-href]:hover{background:rgba(46,211,198,.075)}

/* Better responsive behavior without altering the established visual system. */
@media(max-width:1180px){
  .site-header .brand-mark{width:48px;height:40px;flex-basis:48px}
  .nav-links a,.lang-toggle{padding:.58rem .67rem;font-size:.91rem}
  .hero-logo{width:min(100%,370px)}
  .hero-logo img{max-height:315px}
  .hero-poster{width:min(100%,255px)}
  .production-timeline{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1080px){
  .nav-links{top:64px}
  .hero-grid{align-items:start}
  .hero-copy{padding-top:1rem}
  .hero-show{justify-items:center;width:100%}
  .hero-logo{width:min(100%,390px)}
  .hero-poster{width:min(100%,300px)}
}
@media(max-width:680px){
  .site-header .nav{min-height:60px}
  .site-header .brand{gap:.48rem}
  .site-header .brand-mark{width:54px;height:44px;flex-basis:54px}
  .site-header .brand span:not(.brand-mark){display:none}
  .nav-links{top:60px}
  .hero-grid{padding-top:1.35rem}
  .hero-copy{padding-top:.5rem}
  .hero-logo{width:min(92vw,330px);padding:.55rem}
  .hero-logo img{max-height:280px}
  .hero-poster{width:min(78vw,270px)}
  .production-timeline{grid-template-columns:1fr}
  .sitemap-table,.sitemap-table tbody,.sitemap-table tr,.sitemap-table td{display:block;width:100%!important}
  .sitemap-table thead,.sitemap-table tr:first-child{display:none}
  .sitemap-table tr{margin-bottom:.85rem;padding:.9rem;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(255,255,255,.045)}
  .sitemap-table td{border:0;padding:.25rem 0}
  .sitemap-table td:first-child{font-size:1.05rem}
}
@media(prefers-reduced-motion:reduce){
  .site-header::after,.title-xl,.title-lg,.marquee-track,.play-section::before{animation:none!important}
  .card-tilt,.glow-card,.game-window{transform:none!important}
}
