.qe-page { --qe-ink:#0e1518; --qe-soft:#617077; --qe-line:rgba(14,21,24,.13); --qe-green:#118260; --qe-green-soft:#dff3ea; --qe-coral:#c7694f; --qe-paper:#f4f4ef; --qe-card:#fff; background:var(--qe-paper); color:var(--qe-ink); }
.qe-container { width:min(1240px,calc(100% - 48px)); margin-inline:auto; }
.qe-hero { position:relative; overflow:hidden; padding:clamp(110px,12vw,175px) 0 clamp(75px,9vw,130px); border-bottom:1px solid var(--qe-line); background:radial-gradient(circle at 78% 34%,rgba(17,130,96,.12),transparent 30%),linear-gradient(180deg,#f7f7f2,#eeeeE8); }
.qe-hero-grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr); gap:clamp(45px,8vw,105px); align-items:center; }
.qe-kicker { margin:0 0 16px; color:var(--qe-green); font-family:"DM Mono",monospace; font-size:.72rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase; }
.qe-hero h1 { max-width:820px; margin:0; font-family:"Instrument Sans",sans-serif; font-size:clamp(3.5rem,7.5vw,7.3rem); font-weight:650; line-height:.9; letter-spacing:-.065em; }
.qe-hero h1 em { color:var(--qe-green); font-family:"Newsreader",serif; font-weight:500; }
.qe-lead { max-width:760px; margin:30px 0 0; color:#354147; font-size:clamp(1.08rem,1.7vw,1.35rem); line-height:1.7; }
.qe-note { max-width:700px; margin:17px 0 0; color:var(--qe-soft); font-size:.88rem; line-height:1.7; }
.qe-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.qe-button { display:inline-flex; align-items:center; gap:9px; padding:12px 17px; border:1px solid var(--qe-line); border-radius:999px; color:var(--qe-ink); background:rgba(255,255,255,.45); font-size:.82rem; font-weight:650; text-decoration:none; transition:.2s ease; }
.qe-button:hover { color:var(--qe-ink); transform:translateY(-2px); background:#fff; }
.qe-button-primary { color:#fff; border-color:var(--qe-green); background:var(--qe-green); }
.qe-button-primary:hover { color:#fff; background:#0c6e51; }
.qe-device-stage { position:relative; min-height:450px; display:flex; align-items:center; justify-content:center; }
.qe-device-stage img { position:relative; z-index:2; width:min(100%,720px); filter:drop-shadow(0 34px 35px rgba(17,35,29,.22)); }
.qe-device-glow { position:absolute; width:90%; aspect-ratio:1.7; border-radius:50%; background:radial-gradient(ellipse,rgba(15,152,108,.2),rgba(255,255,255,0) 70%); filter:blur(18px); }
.qe-device-tag { position:absolute; z-index:3; right:0; bottom:3%; width:min(300px,62%); padding:16px 18px; border:1px solid rgba(14,21,24,.11); border-radius:15px; background:rgba(250,250,246,.88); backdrop-filter:blur(10px); box-shadow:0 16px 35px rgba(17,32,26,.11); }
.qe-device-tag span,.qe-device-tag strong { display:block; }
.qe-device-tag span { margin-bottom:4px; color:var(--qe-green); font-family:"DM Mono",monospace; font-size:.63rem; text-transform:uppercase; }
.qe-device-tag strong { font-size:.9rem; line-height:1.35; }
.qe-section { padding:clamp(85px,10vw,145px) 0; }
.qe-section-contrast { background:#121a1e; color:#f4f5f1; }
.qe-thesis { max-width:920px; }
.qe-thesis h2 { margin:0; font-size:clamp(2.5rem,5.6vw,5.4rem); font-weight:620; line-height:.97; letter-spacing:-.055em; }
.qe-thesis > p:last-child { max-width:820px; margin:24px 0 0; color:var(--qe-soft); font-size:1rem; line-height:1.8; }
.qe-section-contrast .qe-thesis > p:last-child { color:rgba(255,255,255,.62); }
.qe-metrics { display:grid; grid-template-columns:repeat(4,1fr); margin-top:60px; border-block:1px solid var(--qe-line); }
.qe-metrics article { min-height:145px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:7px; text-align:center; border-right:1px solid var(--qe-line); }
.qe-metrics article:last-child { border-right:0; }
.qe-metrics strong { color:var(--qe-green); font-size:clamp(2rem,3.5vw,3.2rem); line-height:1; }
.qe-metrics span { color:var(--qe-soft); font-size:.76rem; }
.qe-timeline-card { margin-top:55px; padding:30px; border:1px solid var(--qe-line); background:rgba(255,255,255,.42); }
.qe-timeline-head { display:flex; flex-direction:column; gap:5px; margin-bottom:22px; }
.qe-timeline-head strong { font-size:1.15rem; }
.qe-timeline-head span { color:var(--qe-soft); font-size:.8rem; }
.qe-months { display:grid; grid-template-columns:repeat(8,1fr); color:#8b9699; font-family:"DM Mono",monospace; font-size:.62rem; text-align:center; }
.qe-track { position:relative; height:38px; margin:5px 0; background:repeating-linear-gradient(90deg,transparent 0,transparent calc(12.5% - 1px),rgba(14,21,24,.07) calc(12.5% - 1px),rgba(14,21,24,.07) 12.5%); }
.qe-bar { position:absolute; top:4px; height:30px; display:flex; align-items:center; padding:0 10px; border-radius:3px; color:#fff; font-style:normal; font-size:.65rem; font-weight:650; white-space:nowrap; overflow:hidden; }
.qe-bar-standalone { left:0;width:85%;background:#557b8b; }.qe-bar-saas { left:25%;width:75%;background:#278c69; }.qe-bar-oled { left:31%;width:29%;background:#6c59a1; }.qe-bar-ambient { left:65%;width:31%;background:#544390; }.qe-bar-lcd { left:85%;width:15%;background:#cc6a4c; }
.qe-story-layout { display:grid; grid-template-columns:230px minmax(0,1fr); gap:clamp(45px,7vw,100px); align-items:start; }
.qe-index { position:sticky; top:105px; display:grid; }
.qe-index .qe-kicker { color:#66d0aa; }
.qe-index a { display:grid; grid-template-columns:30px 1fr; gap:8px; padding:10px 0; border-top:1px solid rgba(255,255,255,.07); color:rgba(255,255,255,.52); font-size:.76rem; text-decoration:none; }
.qe-index a span { color:#66d0aa; font-family:"DM Mono",monospace; font-size:.64rem; }
.qe-index a:hover { color:#fff; }
.qe-story { min-width:0; max-width:900px; }
.qe-chapter { padding:0 0 clamp(95px,10vw,150px); scroll-margin-top:100px; }
.qe-chapter-heading { display:grid; grid-template-columns:160px minmax(0,1fr); gap:25px; align-items:start; padding-top:14px; border-top:1px solid rgba(255,255,255,.11); }
.qe-chapter-heading > span { padding-top:10px; color:#66d0aa; font-family:"DM Mono",monospace; font-size:.66rem; letter-spacing:.07em; text-transform:uppercase; }
.qe-chapter-heading h2 { margin:0 0 28px; color:#fff; font-size:clamp(2.25rem,5vw,4.8rem); font-weight:600; line-height:.98; letter-spacing:-.055em; }
.qe-chapter > p { max-width:760px; margin:0 0 18px; color:rgba(255,255,255,.63); line-height:1.84; }
.qe-chapter .qe-intro { color:rgba(255,255,255,.87); font-size:1.2rem; line-height:1.65; }
.qe-callout,.qe-pattern { margin:35px 0; padding:25px 27px; border:1px solid rgba(102,208,170,.2); background:rgba(102,208,170,.055); }
.qe-callout span,.qe-pattern small { display:block; margin-bottom:7px; color:#66d0aa; font-family:"DM Mono",monospace; font-size:.65rem; letter-spacing:.09em; text-transform:uppercase; }
.qe-callout strong,.qe-pattern strong { display:block; color:#fff; font-size:clamp(1.25rem,2.4vw,1.75rem); line-height:1.38; }
.qe-pattern p { margin:9px 0 0; color:rgba(255,255,255,.55); font-size:.86rem; line-height:1.7; }
.qe-pattern-warm { border-color:rgba(224,130,99,.23); background:rgba(199,105,79,.07); }.qe-pattern-warm small { color:#ef9b7e; }
.qe-flow-diagram { display:grid; grid-template-columns:1fr 34px 1.35fr 34px 1fr; gap:10px; align-items:center; margin:38px 0; padding:22px; background:#f2f3ef; color:#152025; }
.qe-flow-diagram > div,.qe-flow-stack > div { padding:16px; border:1px solid rgba(14,21,24,.12); background:#fff; }
.qe-flow-diagram small,.qe-flow-diagram strong { display:block; }.qe-flow-diagram small { margin-bottom:7px; color:#68767b; font-size:.6rem; text-transform:uppercase; }.qe-flow-diagram strong { font-size:.78rem; }.qe-flow-diagram > b { color:#758286; text-align:center; }.qe-flow-stack { display:grid; gap:8px; }.qe-flow-diagram .is-core { border-left:3px solid #2e9f75; }
.qe-ledger { display:flex; flex-direction:column; gap:7px; margin-top:32px; padding-left:20px; border-left:3px solid #d17c5f; }.qe-ledger strong { color:#fff; font-size:1.2rem; }.qe-ledger span { color:#fff; }.qe-ledger p { margin:0;color:rgba(255,255,255,.52);font-size:.82rem; }
.qe-tenant-diagram { margin:38px 0; padding:25px; background:#f2f3ef; color:#142026; }.qe-tenant-pill { width:max-content; max-width:100%; margin:0 auto 22px; padding:9px 20px; border-radius:999px; background:#dff3ea; color:#16795a; font-family:"DM Mono",monospace; font-size:.65rem; }.qe-tenant-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; }.qe-tenant-grid span { padding:18px 10px; border:1px solid rgba(14,21,24,.11); background:#fff; font-size:.72rem; font-weight:650; text-align:center; }.qe-tenant-core { max-width:520px; margin:22px auto 0; padding:17px; border-left:3px solid #50788a; background:#fff; }.qe-tenant-core strong,.qe-tenant-core small { display:block; }.qe-tenant-core small { margin-top:5px;color:#748087; }
.qe-proof-grid { margin:40px 0; }.qe-proof-grid img { display:block; width:100%; border:1px solid rgba(255,255,255,.1); }.qe-proof-grid figcaption,.qe-device-proof figcaption { margin-top:10px; color:rgba(255,255,255,.43); font-size:.74rem; line-height:1.55; font-style:italic; }
.qe-service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:35px 0; }.qe-service-grid > div { min-height:165px; padding:20px; border:1px solid rgba(255,255,255,.09); }.qe-service-grid span { display:block; margin-bottom:20px; color:#66d0aa; font-family:"DM Mono",monospace; font-size:.65rem; }.qe-service-grid strong { display:block; color:#fff;font-size:.9rem; }.qe-service-grid p { margin:7px 0 0;color:rgba(255,255,255,.48);font-size:.75rem;line-height:1.55; }
.qe-refresh { display:grid; grid-template-columns:1fr 34px 1fr; gap:10px; align-items:center; margin:38px 0; padding:20px; background:#f2f3ef; color:#142026; }.qe-refresh > div { padding:22px; background:#152128; color:#fff; }.qe-refresh > b { color:#6f7b80;text-align:center; }.qe-refresh strong { font-size:.76rem;text-transform:uppercase; }.qe-refresh p { margin:14px 0 0;color:rgba(255,255,255,.48);font-size:.72rem;line-height:1.55; }.qe-scan { display:grid;gap:6px;margin-top:20px; }.qe-scan i { height:14px;background:#2b3b43; }.qe-scan i.hot { background:#55d7a7; }.qe-scan-damage i.hot { outline:2px solid #73e7bb;outline-offset:3px; }
.qe-device-proof { margin-top:38px; }.qe-device-proof img { display:block;width:min(100%,760px);margin:0 auto;filter:drop-shadow(0 24px 25px rgba(0,0,0,.3)); }
.qe-invariants { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-top:55px; }.qe-invariants article { min-height:225px; padding:26px; border:1px solid var(--qe-line); background:rgba(255,255,255,.45); }.qe-invariants article:last-child { grid-column:1/-1; min-height:0; }.qe-invariants span { display:block;margin-bottom:28px;color:var(--qe-green);font-family:"DM Mono",monospace;font-size:.67rem; }.qe-invariants h3 { margin:0 0 10px;font-size:1.25rem; }.qe-invariants p { margin:0;color:var(--qe-soft);font-size:.86rem;line-height:1.65; }
.qe-section-final { border-top:1px solid var(--qe-line); background:#e9eae4; }.qe-ending { max-width:980px; }.qe-ending h2 { max-width:900px;margin:0;font-size:clamp(2.7rem,6vw,5.8rem);font-weight:620;line-height:.95;letter-spacing:-.06em; }.qe-ending > p { max-width:780px;margin:24px 0 0;color:var(--qe-soft);line-height:1.8; }.qe-ending blockquote { max-width:900px;margin:42px 0;padding-left:24px;border-left:3px solid var(--qe-green);font-family:"Newsreader",serif;font-size:clamp(1.7rem,3.8vw,3.3rem);font-weight:560;line-height:1.25;letter-spacing:-.025em; }.qe-source { display:grid;gap:5px;margin-top:40px;padding:22px;border:1px solid var(--qe-line);background:rgba(255,255,255,.35); }.qe-source strong { font-family:"DM Mono",monospace;font-size:.67rem;text-transform:uppercase; }.qe-source span { color:var(--qe-soft);font-size:.76rem;line-height:1.55; }
@media(max-width:1000px){
    .qe-hero-grid{grid-template-columns:1fr}
    .qe-device-stage{min-height:380px}
    .qe-story-layout{grid-template-columns:1fr}
    .qe-index{position:static;grid-template-columns:repeat(2,1fr);column-gap:18px}
    .qe-index .qe-kicker{grid-column:1/-1}
}
@media(max-width:720px){
    .qe-page{overflow-x:clip}
    .qe-container{width:min(100% - 30px,100%)}
    .qe-hero{padding:92px 0 72px}
    .qe-hero-grid{gap:38px}
    .qe-hero h1{font-size:clamp(2.75rem,13vw,4rem);line-height:.94;letter-spacing:-.055em}
    .qe-lead{margin-top:24px;font-size:1rem;line-height:1.65}
    .qe-note{font-size:.82rem;line-height:1.65}
    .qe-actions{gap:8px}
    .qe-button{justify-content:center}
    .qe-device-stage{
        min-height:0;
        display:grid;
        grid-template-columns:minmax(0,1fr);
        align-items:start;
        justify-items:stretch;
        overflow:visible
    }
    .qe-device-stage img{width:100%;max-width:none}
    .qe-device-glow{top:4%;left:5%;width:90%}
    .qe-device-tag{
        position:relative;
        inset:auto;
        justify-self:end;
        width:calc(100% - 18px);
        max-width:none;
        margin-top:-26px;
        box-sizing:border-box
    }
    .qe-section{padding:76px 0}
    .qe-thesis h2{font-size:clamp(2.3rem,10.5vw,3.6rem);line-height:1;letter-spacing:-.05em}
    .qe-thesis>p:last-child{font-size:.96rem;line-height:1.72}
    .qe-metrics{grid-template-columns:repeat(2,1fr);margin-top:48px}
    .qe-metrics article:nth-child(2){border-right:0}
    .qe-metrics article:nth-child(-n+2){border-bottom:1px solid var(--qe-line)}
    .qe-timeline-card{margin-top:46px;padding:20px 12px;overflow:hidden}
    .qe-months{font-size:.54rem}
    .qe-bar{font-size:.5rem;padding-inline:6px}
    .qe-story-layout{gap:58px}
    .qe-chapter{padding-bottom:82px}
    .qe-chapter-heading{grid-template-columns:1fr;gap:4px}
    .qe-chapter-heading h2{margin-top:4px;font-size:clamp(2.15rem,10.5vw,3.5rem);line-height:1}
    .qe-chapter>p{line-height:1.72}
    .qe-index{grid-template-columns:1fr}
    .qe-callout,.qe-pattern{margin:30px 0;padding:21px 20px}
    .qe-flow-diagram,.qe-refresh{grid-template-columns:1fr;margin-inline:0;padding:14px}
    .qe-flow-diagram>b,.qe-refresh>b{transform:rotate(90deg)}
    .qe-tenant-diagram{margin-inline:0;padding:16px}
    .qe-tenant-grid,.qe-service-grid,.qe-invariants{grid-template-columns:1fr}
    .qe-invariants article:last-child{grid-column:auto}
    .qe-service-grid>div,.qe-invariants article{min-height:0}
    .qe-ending blockquote{padding-left:17px}
}
@media(max-width:450px){
    .qe-hero{padding-top:84px}
    .qe-hero h1{font-size:clamp(2.55rem,12.7vw,3.55rem)}
    .qe-actions{display:grid;grid-template-columns:1fr}
    .qe-button{width:100%}
    .qe-device-tag{width:calc(100% - 12px);margin-top:-20px;padding:14px 15px}
    .qe-metrics{grid-template-columns:1fr}
    .qe-metrics article{min-height:112px;border-right:0;border-bottom:1px solid var(--qe-line)}
    .qe-metrics article:last-child{border-bottom:0}
    .qe-timeline-card{margin-inline:-2px}
    .qe-bar{font-size:.47rem}
    .qe-tenant-grid{grid-template-columns:1fr}
    .qe-source{padding:18px 16px}
}