:root{
  --bg:#050505;--panel:#0c0b09;--panel2:#12100c;--ink:#f7f2e7;--muted:#b8ab91;
  --gold:#d6a73b;--gold2:#f0cf78;--line:rgba(214,167,59,.28);--shadow:0 28px 90px rgba(0,0,0,.55);
  --serif: Georgia,'Times New Roman',serif;--sans: Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:
 radial-gradient(circle at 18% 0%,rgba(214,167,59,.10),transparent 26rem),
 radial-gradient(circle at 80% 20%,rgba(214,167,59,.05),transparent 28rem),
 linear-gradient(180deg,#050505,#090806 48%,#050505);color:var(--ink);font-family:var(--sans)}
a{color:inherit;text-decoration:none}.wrap{width:min(1180px,92vw);margin:auto}.topbar{position:sticky;top:0;z-index:30;background:rgba(5,5,5,.82);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav{height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font-family:var(--serif);letter-spacing:.18em;font-size:.92rem;color:var(--gold2)}.brand strong{display:block;font-size:1.04rem;letter-spacing:.11em;color:#fff}.navlinks{display:flex;gap:22px;font-size:.86rem;color:#d7c7a7}.navlinks a:hover{color:#fff}
.hero{padding:92px 0 54px}.eyebrow{font-size:.74rem;text-transform:uppercase;letter-spacing:.26em;color:var(--gold2)}h1,h2,h3{font-family:var(--serif);font-weight:500;margin:0}.hero h1{font-size:clamp(2.8rem,7vw,6.5rem);line-height:.94;max-width:980px;margin:18px 0}.hero p{max-width:790px;color:#d4c9b5;font-size:clamp(1rem,2vw,1.2rem);line-height:1.8}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.btn{border:1px solid var(--line);padding:13px 18px;border-radius:999px;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;background:rgba(255,255,255,.02)}.btn.primary{background:linear-gradient(135deg,#c7962d,#f1d07d);color:#171007;border:0;font-weight:800}.btn:hover{transform:translateY(-1px)}
.statbar{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:18px;overflow:hidden;background:rgba(12,11,9,.75);box-shadow:var(--shadow)}.stat{padding:20px;border-right:1px solid var(--line)}.stat:last-child{border:0}.stat b{display:block;color:var(--gold2);font-family:var(--serif);font-size:1.3rem}.stat span{font-size:.78rem;color:var(--muted)}
.section{padding:72px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:28px}.section-head h2{font-size:clamp(2rem,4vw,3.6rem)}.section-head p{max-width:560px;color:var(--muted);line-height:1.7}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.card{position:relative;border:1px solid var(--line);border-radius:24px;overflow:hidden;background:linear-gradient(160deg,rgba(18,16,12,.98),rgba(6,6,6,.98));min-height:530px;box-shadow:var(--shadow);transition:.35s}.card:hover{transform:translateY(-5px);border-color:rgba(240,207,120,.58)}.card-media{height:310px;position:relative;overflow:hidden;background:#050505}.card-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.05);transform:scale(1.08)}.card-media.mask-top:before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,#080705 0 17%,transparent 39%,rgba(5,5,5,.14) 100%)}.card-media.mask-center:after{content:"QEC · CONTROLLED RUNTIME";position:absolute;z-index:3;left:12%;right:12%;top:34%;padding:13px;text-align:center;background:rgba(5,5,5,.96);border:1px solid rgba(214,167,59,.45);color:var(--gold2);font-family:var(--serif);letter-spacing:.12em}.card-body{padding:24px 26px 28px}.kicker{color:var(--gold2);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase}.card h3{font-size:2rem;margin:9px 0 10px}.card p{color:#c8bda9;line-height:1.7;margin:0 0 20px}.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{padding:7px 10px;border-radius:999px;border:1px solid var(--line);color:#d8c6a1;font-size:.72rem}.arrow{position:absolute;right:24px;bottom:24px;color:var(--gold2);font-size:1.4rem}
.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.principle{border:1px solid var(--line);border-radius:20px;padding:24px;background:rgba(255,255,255,.015)}.principle b{font-family:var(--serif);color:var(--gold2);font-size:1.25rem}.principle p{color:var(--muted);line-height:1.7}
.footer{padding:40px 0 60px;border-top:1px solid var(--line);color:#8e826d;font-size:.8rem}.footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
/* Detail */
.detail-hero{padding:70px 0 34px;display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}.detail-hero h1{font-size:clamp(2.6rem,5.8vw,5.6rem);line-height:.95;margin:14px 0 18px}.detail-hero p{color:#d0c3ad;line-height:1.8;font-size:1.08rem}.visual-frame{height:600px;border:1px solid var(--line);border-radius:28px;overflow:hidden;position:relative;background:#070707;box-shadow:var(--shadow)}.visual-frame img{width:100%;height:100%;object-fit:cover;transform:scale(1.08)}.visual-frame.obscure-top:before{content:"";position:absolute;z-index:2;inset:0;background:linear-gradient(180deg,#050505 0 15%,transparent 36%,rgba(5,5,5,.05) 100%)}.visual-frame.obscure-center:after{content:"QEC · ENTERPRISE RUNTIME";position:absolute;z-index:3;left:14%;right:14%;top:32%;padding:18px;background:#070604;border:1px solid rgba(214,167,59,.55);text-align:center;font-family:var(--serif);letter-spacing:.16em;color:var(--gold2)}
.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.block{border:1px solid var(--line);background:rgba(12,11,9,.82);border-radius:20px;padding:22px}.block h3{font-size:1.35rem;margin-bottom:10px}.block p,.block li{color:var(--muted);line-height:1.7}.block ul{padding-left:18px;margin:0}.flow{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.step{border:1px solid var(--line);border-radius:16px;padding:18px;min-height:140px;background:rgba(255,255,255,.012)}.step b{color:var(--gold2);font-family:var(--serif)}.step span{display:block;color:var(--muted);font-size:.82rem;line-height:1.5;margin-top:8px}.callout{border:1px solid rgba(240,207,120,.45);background:linear-gradient(135deg,rgba(214,167,59,.11),rgba(255,255,255,.015));border-radius:24px;padding:30px}.callout h2{font-size:2rem}.callout p{color:#d2c4aa;line-height:1.7}
.reveal{opacity:0;transform:translateY(18px);transition:.7s ease}.reveal.on{opacity:1;transform:none}
@media(max-width:860px){.navlinks{display:none}.statbar,.principles,.detail-grid,.flow{grid-template-columns:1fr 1fr}.grid,.detail-hero{grid-template-columns:1fr}.visual-frame{height:500px}.detail-hero{padding-top:46px}}@media(max-width:560px){.statbar,.principles,.detail-grid,.flow{grid-template-columns:1fr}.hero{padding-top:64px}.card{min-height:0}.card-media{height:260px}.visual-frame{height:420px}.section{padding:54px 0}}


/* V6 - premium frame */
body::before{content:"";position:fixed;inset:8px;z-index:9998;pointer-events:none;border:1px solid rgba(243,213,131,.72);box-shadow:0 0 0 3px rgba(5,5,5,.95),0 0 0 4px rgba(171,124,38,.45)}
body::after{content:"";position:fixed;inset:13px;z-index:9997;pointer-events:none;background:linear-gradient(135deg,rgba(243,213,131,.72),transparent 17px) left top/40px 40px no-repeat,linear-gradient(225deg,rgba(243,213,131,.72),transparent 17px) right top/40px 40px no-repeat,linear-gradient(45deg,rgba(243,213,131,.72),transparent 17px) left bottom/40px 40px no-repeat,linear-gradient(315deg,rgba(243,213,131,.72),transparent 17px) right bottom/40px 40px no-repeat;opacity:.46}
@media(max-width:560px){body::before{inset:4px}body::after{inset:8px}}


/* ===== V7 universal premium frame ===== */
html{background:#020202!important;color-scheme:dark}body{background-color:#030303!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
html::before{content:"";position:fixed;inset:0;z-index:10000;pointer-events:none;border:6px solid #8d641f;box-shadow:inset 0 0 0 1px #f2d386,inset 0 0 0 4px #3d2a0d}
html::after{content:"";position:fixed;inset:9px;z-index:9999;pointer-events:none;border:2px solid rgba(239,202,112,.82);box-shadow:inset 0 0 0 2px rgba(64,41,8,.92),inset 0 0 0 3px rgba(213,168,79,.34)}
body::after{content:"";position:fixed;inset:14px;z-index:9998;pointer-events:none;background:linear-gradient(135deg,rgba(243,217,143,.92),transparent 19px) left top/64px 64px no-repeat,linear-gradient(225deg,rgba(243,217,143,.92),transparent 19px) right top/64px 64px no-repeat,linear-gradient(45deg,rgba(243,217,143,.92),transparent 19px) left bottom/64px 64px no-repeat,linear-gradient(315deg,rgba(243,217,143,.92),transparent 19px) right bottom/64px 64px no-repeat;opacity:.62}
@media(max-width:600px){html::before{border-width:3px}html::after{inset:5px;border-width:1px}body::after{inset:8px;opacity:.42}}


/* V8 shared Versailles frame */
html{background:#020202!important;color-scheme:dark}
body{background-color:#030303!important;min-height:100vh}
html::before{content:"";position:fixed;inset:0;z-index:10000;pointer-events:none;background:url('../../assets/images/decor/versailles-frame.svg') center/100% 100% no-repeat;opacity:.94}
html::after{content:"";position:fixed;inset:18px;z-index:9999;pointer-events:none;border:1px solid rgba(244,218,151,.72);box-shadow:inset 0 0 0 2px rgba(60,38,8,.92),inset 0 0 0 3px rgba(213,168,79,.35)}
@media(max-width:600px){html::after{inset:9px}html::before{opacity:.76}}


/* V9 responsive hardening */
html{-webkit-text-size-adjust:100%;overflow-x:hidden}body{overflow-x:hidden}.wrap,.grid>*{min-width:0}img,video,svg{max-width:100%;height:auto}.btn,button,a{touch-action:manipulation}.btn,button{min-height:44px}@media(max-width:760px){.wrap{width:calc(100% - 22px)!important}.hero h1,.detail-hero h1{font-size:clamp(2.2rem,10vw,3.5rem)!important}.visual-frame{height:auto!important;min-height:0}.visual-frame img{object-fit:contain}.statbar,.principles,.detail-grid,.flow{grid-template-columns:1fr!important}}@media(max-width:420px){.wrap{width:calc(100% - 16px)!important}html::before{opacity:.66}}
