:root{--cream:#e9e2d6;--paper:#f4f0e8;--ink:#171714;--muted:#66655e;--line:#c9c0b3;--night:#111313;--night2:#1b211f;--cyan:#a7d9d7;--orange:#bd764d;--max:1380px}
*{box-sizing:border-box}html{background:var(--cream);color:var(--ink);scroll-behavior:smooth}body{margin:0;background:var(--cream);font-family:'DM Sans','Noto Sans SC',sans-serif;overflow-x:hidden}a{color:inherit}.byoc-wrap{width:min(var(--max),calc(100% - 80px));margin:auto}.byoc-nav{position:absolute;z-index:30;top:0;left:0;width:100%;display:flex;align-items:center;gap:26px;padding:19px max(24px,calc((100% - var(--max))/2));background:#e9e2d6;border-bottom:1px solid #d6ccbb;box-shadow:0 14px 30px -26px #0b1110c4;color:var(--ink)}
/* The bar is opaque and hairline-ruled so the dark home art starts cleanly below it
   instead of bleeding up through a translucent gradient. Links centre in the free
   space and the lang pill sits right — no dead zone in the middle of the row. */
.byoc-nav .byoc-wordmark{margin-right:0}
.byoc-nav .byoc-navlinks{margin:0 auto}.byoc-wordmark{margin-right:auto;text-decoration:none;display:flex;flex-direction:column;line-height:.9}.byoc-wordmark strong{font:800 18px/1 'Manrope',sans-serif;letter-spacing:.1em}.byoc-wordmark small{font:600 8px/1 'DM Sans',sans-serif;letter-spacing:.16em;color:#6c6b62;margin-top:6px}.byoc-navlinks{display:flex;gap:23px;align-items:center}.byoc-navlinks a{font-size:11px;text-decoration:none;white-space:nowrap}.byoc-navlinks a:hover,.byoc-navlinks a.active{text-decoration:underline;text-underline-offset:5px}.byoc-join{background:var(--ink);color:var(--paper);border-radius:99px;padding:11px 16px;font-size:10px;text-decoration:none;white-space:nowrap}.byoc-lang{border:1px solid #222;background:transparent;border-radius:99px;padding:9px 11px;font-size:10px;cursor:pointer}.byoc-hero{min-height:100svh;display:grid;grid-template-columns:1.03fr .97fr;background:var(--cream)}.byoc-hero-copy{display:flex;flex-direction:column;justify-content:center;padding:160px max(40px,calc((100vw - var(--max))/2)) 100px}.byoc-kicker{font:700 10px/1 'DM Sans',sans-serif;letter-spacing:.15em;color:#757166;text-transform:uppercase}.byoc-hero h1{max-width:720px;font:700 clamp(4.2rem,8.5vw,9.6rem)/.84 'Manrope','Noto Sans SC',sans-serif;letter-spacing:-.065em;margin:24px 0 28px}.byoc-hero h1 em,.byoc-section h2 em,.byoc-pagehero h1 em{font-style:normal;color:#777568}.byoc-lede{max-width:510px;color:var(--muted);font-size:17px;line-height:1.7}.byoc-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}.byoc-button{display:inline-flex;align-items:center;justify-content:center;background:var(--ink);color:var(--paper);border-radius:99px;padding:13px 18px;font-size:10px;text-decoration:none}.byoc-button.ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}.byoc-hero-art{min-height:100svh;position:relative;overflow:hidden;background:#151918}.byoc-hero-art video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;mix-blend-mode:screen}.byoc-hero-art:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#101414aa,transparent 52%),radial-gradient(circle at 55% 42%,#d1f0df33,transparent 35%)}.hero-signal{position:absolute;z-index:3;left:35px;right:35px;bottom:28px;color:#f3f0e5;font:700 9px/1.5 monospace;letter-spacing:.12em;display:flex;justify-content:space-between;border-top:1px solid #e6e1d355;padding-top:12px}.hero-signal b{color:var(--cyan);font-weight:700}.stat-band{padding:22px 0;background:var(--paper);border-bottom:1px solid var(--line)}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line)}.stat{padding:22px 18px;border-right:1px solid var(--line);min-height:106px}.stat:last-child{border:0}.stat b{display:block;font:700 28px/1 'Manrope',sans-serif}.stat span{display:block;color:var(--muted);font-size:11px;line-height:1.45;margin-top:10px}.byoc-section{padding:clamp(90px,12vw,190px) 0;background:var(--paper)}.byoc-section.dark{background:var(--night);color:#f2efe7}.byoc-section.cyan{background:var(--cyan)}.byoc-two{display:grid;grid-template-columns:1fr 1fr;gap:10vw;align-items:start}.byoc-section h2{font:700 clamp(3.2rem,6.5vw,7rem)/.88 'Manrope','Noto Sans SC',sans-serif;letter-spacing:-.09em;margin:17px 0 0}.byoc-copy p{max-width:570px;color:var(--muted);font-size:16px;line-height:1.85}.dark .byoc-copy p{color:#b8b7ae}.byoc-lead{font-size:23px!important;line-height:1.45!important;color:var(--ink)!important}.dark .byoc-lead{color:#fff!important}.scene-reel{background:#151918;color:#ede9df;padding:0 0 100px}.scene-heading{padding:78px 0 32px;display:flex;align-items:end;justify-content:space-between;gap:30px}.scene-heading h2{font:700 clamp(3rem,6vw,6rem)/.9 'Manrope';letter-spacing:-.09em;margin:0}.scene-heading p{max-width:300px;color:#a9aaa0;font-size:12px;line-height:1.6}.scene-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.scene-card{height:430px;position:relative;overflow:hidden;background:#252a27}.scene-card:first-child{grid-column:span 2}.scene-card video{width:100%;height:100%;object-fit:cover;opacity:.68;transition:transform .8s,opacity .4s}.scene-card:hover video{transform:scale(1.07);opacity:.95}.scene-card:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 45%,#0f1210dd)}.scene-card label{position:absolute;z-index:2;left:18px;bottom:18px;font:700 10px/1.4 monospace;letter-spacing:.13em;color:#f5f0e5}.scene-card label span{display:block;color:var(--cyan);font-size:8px;margin-bottom:8px}.principles{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #575b56;margin-top:56px}.principle{padding:24px 16px;border-right:1px solid #575b56;min-height:180px}.principle:last-child{border:0}.principle small{color:var(--cyan);font:700 9px monospace}.principle h3{font-size:21px;margin:48px 0 12px}.principle p{font-size:12px;line-height:1.7;color:#aeb1a9}.process{display:grid;grid-template-columns:1fr 1fr;gap:10vw}.process-list{border-top:1px solid var(--line)}.process-item{display:grid;grid-template-columns:55px 1fr;gap:15px;border-bottom:1px solid var(--line);padding:21px 0}.process-item>span{font:700 10px monospace;color:var(--orange)}.process-item h3{font-size:19px;margin:0 0 7px}.process-item p{color:var(--muted);font-size:13px;line-height:1.6;margin:0}.lens-band{background:var(--paper);padding:0 0 110px}.lens-band .byoc-wrap>header{display:flex;justify-content:space-between;align-items:end;padding:25px 0;border-bottom:1px solid var(--line)}.lens-band header h2{font-size:11px;letter-spacing:.13em;margin:0}.lens-band header span{color:var(--muted);font-size:11px}.lens-list{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line)}.lens-item{padding:28px 20px;min-height:210px;border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;text-decoration:none}.lens-item:last-child{border:0}.lens-item:hover{background:#ddd4c6}.lens-item>span{font:700 10px monospace;color:#888276}.lens-item strong{font:700 clamp(3rem,5vw,5.5rem)/.85 'Manrope';letter-spacing:-.09em}.lens-item small{color:var(--muted);font-size:13px}.lens-item em{font-style:normal;font-size:11px}.field-section{background:#e5ddd0;padding:100px 0}.field-card{background:#171918;color:#f3eee2;display:grid;grid-template-columns:1fr 1fr;min-height:370px}.field-card-copy{padding:55px}.field-card h2{font:700 clamp(3rem,5vw,5.5rem)/.88 'Manrope';letter-spacing:-.055em;margin:18px 0}.field-card p{color:#b6b6ac;line-height:1.7;max-width:450px}.field-card-side{padding:35px;background:linear-gradient(140deg,#2c4540,#121615);display:flex;align-items:end}.empty-events{border:1px solid #75857c;color:#c2c8bd;padding:17px;width:100%;font-size:12px;line-height:1.6}.end-cta{padding:120px 0;background:var(--night);color:#f3eee5;text-align:center}.end-cta h2{font:700 clamp(3.6rem,7vw,7.6rem)/.84 'Manrope';letter-spacing:-.06em;margin:0 auto 25px;max-width:800px}.end-cta p{color:#b7b8ae;max-width:470px;margin:0 auto;line-height:1.7}.end-cta .byoc-actions{justify-content:center}.byoc-footer{background:#111313;color:#e5e1d7;padding:42px 0 30px}.footer-top{display:flex;justify-content:space-between;gap:30px;border-bottom:1px solid #414541;padding-bottom:45px}.footer-brand strong{display:block;font:700 18px 'Manrope';letter-spacing:.1em}.footer-brand p{color:#aaa99f;font-size:12px;max-width:260px;line-height:1.6}.footer-links{display:grid;grid-template-columns:repeat(3,130px);gap:20px}.footer-links h4{color:#8ed2d0;font-size:9px;letter-spacing:.12em;margin:0 0 15px}.footer-links a{display:block;color:#ccc9be;text-decoration:none;font-size:11px;margin:9px 0}.footer-bottom{display:flex;justify-content:space-between;color:#898b84;font:9px monospace;padding-top:22px}.byoc-pagehero{min-height:68svh;padding:170px max(40px,calc((100vw - var(--max))/2)) 95px;background:linear-gradient(135deg,#e9e2d6,#b8d2d1);display:flex;align-items:end;justify-content:space-between;gap:60px}.byoc-pagehero h1{font:700 clamp(4rem,8vw,8rem)/.84 'Manrope';letter-spacing:-.055em;margin:18px 0 0}.byoc-pagehero .byoc-lede{margin-bottom:5px}.byoc-content{padding:90px 0;background:var(--paper)}.byoc-block{border-top:1px solid var(--line);padding:82px 0}.byoc-block:first-child{border-top:0}.byoc-block h2{font:700 clamp(3rem,6vw,6rem)/.88 'Manrope';letter-spacing:-.05em;margin:0 0 25px}.byoc-block>p{max-width:730px;color:var(--muted);line-height:1.85;font-size:16px}.byoc-records{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:35px}.byoc-record{padding:24px;border:1px solid var(--line);min-height:170px;background:#f8f4ed}.byoc-record small{font:700 9px monospace;color:var(--orange)}.byoc-record h3{font-size:20px;margin:46px 0 10px}.byoc-record p{font-size:12px;line-height:1.65;color:var(--muted);margin:0}.byoc-form{max-width:900px;padding:100px 0}.byoc-form h1{font:700 clamp(3.7rem,7vw,7rem)/.85 'Manrope';letter-spacing:-.1em;margin:15px 0 25px}.byoc-form>p{color:var(--muted);max-width:700px;line-height:1.8}.byoc-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:45px}.byoc-fields label{display:grid;gap:7px;font-size:12px}.byoc-fields .full{grid-column:1/-1}.byoc-fields input,.byoc-fields textarea,.byoc-fields select{font:inherit;border:1px solid #b9b0a3;background:#faf7f0;color:var(--ink);padding:14px;border-radius:2px}.byoc-fields textarea{min-height:150px}.byoc-fields input:focus,.byoc-fields textarea:focus,.byoc-fields select:focus{outline:2px solid var(--cyan);border-color:#4c8280}.byoc-status{color:var(--muted);font-size:12px}.byoc-note-feed{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.byoc-note{background:#f8f4ed;border:1px solid var(--line);padding:28px;min-height:210px}.byoc-note-meta{display:flex;justify-content:space-between;font:9px monospace;color:#8c887e;margin-bottom:40px}.byoc-note h3{font-size:25px;margin:0 0 10px}.byoc-note p{color:var(--muted);line-height:1.75;font-size:13px}
@media(max-width:1050px){.byoc-navlinks{gap:15px}.byoc-wrap{width:calc(100% - 56px)}.byoc-hero{grid-template-columns:1fr}.byoc-hero-copy{padding:145px 28px 75px}.byoc-hero-art{min-height:500px}.byoc-two,.process{grid-template-columns:1fr;gap:40px}.scene-grid{grid-template-columns:repeat(2,1fr)}.scene-card:first-child{grid-column:span 2}.principles{grid-template-columns:repeat(2,1fr)}.principle:nth-child(2){border-right:0}.principle:nth-child(-n+2){border-bottom:1px solid #575b56}.field-card{grid-template-columns:1fr}.field-card-side{min-height:300px}.byoc-pagehero{min-height:600px}}
@media(max-width:700px){.byoc-wrap{width:calc(100% - 40px)}.byoc-nav{padding:13px 20px;flex-wrap:wrap;gap:12px;background:#e9e2d6}.byoc-wordmark strong{font-size:15px}.byoc-navlinks{order:3;flex:1 0 100%;overflow:auto;gap:20px;padding:4px 0}.byoc-navlinks a{font-size:10px}.byoc-join{font-size:9px;padding:10px 12px}.byoc-lang{padding:8px 9px}.byoc-hero-copy{padding:132px 20px 65px}.byoc-hero h1{font-size:clamp(3.5rem,14vw,5.5rem)}.byoc-lede{font-size:16px}.byoc-hero-art{min-height:350px}.hero-signal{left:20px;right:20px;bottom:18px;display:block}.hero-signal span,.hero-signal b{display:inline-block;margin-right:12px}.stat-grid{grid-template-columns:1fr 1fr}.stat{border-bottom:1px solid var(--line)}.stat:nth-child(2){border-right:0}.stat:nth-child(3){border-bottom:0}.stat:nth-child(4){border-right:0;border-bottom:0}.stat b{font-size:24px}.byoc-section{padding:76px 0}.byoc-two{display:block}.byoc-two>div+div{margin-top:35px}.byoc-section h2{font-size:clamp(3rem,12vw,5rem)}.scene-heading{display:block;padding:60px 0 25px}.scene-heading p{margin-top:25px}.scene-grid{display:flex;overflow:auto;gap:7px}.scene-card,.scene-card:first-child{min-width:78vw;height:360px}.scene-card:first-child{grid-column:auto}.principles{grid-template-columns:1fr 1fr}.principle{min-height:170px;padding:18px 12px}.principle h3{font-size:18px;margin-top:40px}.process{display:block}.lens-band{padding-bottom:65px}.lens-band .byoc-wrap>header{display:block}.lens-band header span{display:block;margin-top:10px}.lens-list{display:flex;overflow:auto}.lens-item{min-width:76vw;min-height:190px}.field-section{padding:65px 0}.field-card-copy{padding:35px 22px}.field-card h2{font-size:3rem}.end-cta{padding:85px 20px}.end-cta h2{font-size:clamp(3.5rem,14vw,5.5rem)}.footer-top{display:block;padding-bottom:30px}.footer-links{grid-template-columns:repeat(3,1fr);margin-top:35px;gap:10px}.footer-bottom{display:block;line-height:1.8}.byoc-pagehero{min-height:570px;display:block;padding:135px 20px 70px}.byoc-pagehero h1{font-size:clamp(3.7rem,14vw,5.7rem)}.byoc-pagehero .byoc-lede{margin-top:40px}.byoc-content{padding:60px 0}.byoc-block{padding:60px 0}.byoc-block h2{font-size:clamp(3rem,12vw,5rem)}.byoc-records,.byoc-note-feed{grid-template-columns:1fr}.byoc-form{padding:75px 0}.byoc-form h1{font-size:clamp(3.5rem,14vw,5.7rem)}.byoc-fields{grid-template-columns:1fr}.byoc-fields .full{grid-column:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.scene-card video{transition:none}}

/* Round 4 global theme + thinking field. Light is the default; dark is explicit. */
:root[data-theme="dark"]{--cream:#151817;--paper:#1d2220;--ink:#eee9df;--muted:#b8b7ae;--line:#414944;--night:#101312;--night2:#1c2220;--cyan:#b4d8d1;--orange:#e0a071}
:root[data-theme="dark"] body,:root[data-theme="dark"] .byoc-hero{background:var(--cream);color:var(--ink)}
:root[data-theme="dark"] .byoc-nav{background:#1b201e;color:var(--ink);border-color:#4b514c}
:root[data-theme="dark"] .byoc-section,:root[data-theme="dark"] .stat-band,:root[data-theme="dark"] .lens-band,:root[data-theme="dark"] .byoc-content{background:var(--paper);color:var(--ink)}
:root[data-theme="dark"] .byoc-record,:root[data-theme="dark"] .byoc-note{background:#252b28;border-color:#4b544e;color:var(--ink)}
:root[data-theme="dark"] .byoc-record p,:root[data-theme="dark"] .byoc-note p{color:#c0c2ba}
:root[data-theme="dark"] .byoc-pagehero{background:#202522;color:var(--ink)}
:root[data-theme="dark"] .scene-reel,:root[data-theme="dark"] .byoc-footer{background:#101312}
.byoc-theme{border:1px solid #222;background:transparent;color:inherit;border-radius:99px;padding:9px 11px;font-size:13px;line-height:1;cursor:pointer;min-width:34px}
:root[data-theme="dark"] .byoc-theme{border-color:#bbb5aa}
/* All animated fields share a restrained neutral charcoal, not cyan/green gradients. */
.byoc-hero-art,.scene-reel,.byoc-media-band,.field-card-side{background:#242827}
.byoc-media-band .thinking-pulse{position:absolute;inset:0}
.thinking-pulse{background:#242827;display:flex;align-items:center;justify-content:center;gap:9px;overflow:hidden}
.thinking-pulse:before{content:'';position:absolute;width:64%;height:1px;background:linear-gradient(90deg,transparent,#d8d0c2,transparent);animation:thought-scan 3.2s ease-in-out infinite}
.thinking-pulse i{display:block;width:3px;height:clamp(28px,12vw,78px);background:#d8d0c2;opacity:.3;transform-origin:center;animation:thought-wave 1.8s ease-in-out infinite}
.thinking-pulse i:nth-child(2){animation-delay:.14s}.thinking-pulse i:nth-child(3){animation-delay:.28s}.thinking-pulse i:nth-child(4){animation-delay:.42s}.thinking-pulse i:nth-child(5){animation-delay:.56s}
.thinking-pulse span{position:absolute;left:22px;bottom:18px;color:#d8d0c2;font:700 9px monospace;letter-spacing:.16em}
@keyframes thought-wave{0%,100%{height:24px;opacity:.25}50%{height:96px;opacity:.9}}
@keyframes thought-scan{0%,100%{transform:translateX(-30%);opacity:.2}50%{transform:translateX(30%);opacity:.8}}
@media(max-width:700px){.thinking-pulse span{font-size:8px}}
/* Dynamic media fills for live/empty content zones */
.field-card-side{position:relative;overflow:hidden;isolation:isolate}.field-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.48;mix-blend-mode:screen}.field-card-side:after{content:'FIELD NODE / OPEN';position:absolute;inset:18px;border:1px solid #a7d9d766;color:#c8eee8;font:700 8px monospace;letter-spacing:.14em;padding:12px;pointer-events:none}.empty-events{position:relative;z-index:2;background:#101513b8;backdrop-filter:blur(3px);color:#f0eee4}.byoc-media-band{height:230px;position:relative;overflow:hidden;background:#171a18;margin-bottom:48px}.byoc-media-band video{width:100%;height:100%;object-fit:cover;opacity:.75}.byoc-media-band:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#11151399,transparent 60%)}.byoc-media-band span{position:absolute;z-index:2;left:22px;bottom:18px;color:#d9f0e9;font:700 9px monospace;letter-spacing:.14em}.byoc-media-band+ .byoc-kicker{margin-top:0}@media(max-width:700px){.byoc-media-band{height:170px;margin-bottom:34px}.field-card-side{min-height:270px}.field-media{opacity:.58}}
/* Final precedence: animated media remains neutral charcoal on every page. */
.byoc-hero-art,.scene-reel,.byoc-media-band,.field-card-side{background:#242827!important}
:root[data-theme="dark"] .byoc-media-band,:root[data-theme="dark"] .field-card-side{background:#242827!important}

/* Persistent page-top control */
.back-to-top{position:fixed;right:24px;bottom:24px;z-index:90;width:48px;height:48px;border:1px solid currentColor;border-radius:999px;background:#f3eee4e8;color:var(--ink);font:700 11px/1 'DM Sans','Noto Sans SC',sans-serif;letter-spacing:.08em;cursor:pointer;box-shadow:0 8px 24px #1112;backdrop-filter:blur(8px);transition:transform .2s ease,background .2s ease,color .2s ease}.back-to-top:hover,.back-to-top:focus-visible{transform:translateY(-3px);background:var(--ink);color:var(--cream);outline:2px solid var(--ink);outline-offset:3px}.back-to-top span{font-size:8px}.back-to-top:active{transform:translateY(0)}
@media(max-width:700px){.back-to-top{right:16px;bottom:16px;width:46px;height:46px}}
@media(prefers-reduced-motion:reduce){.back-to-top{transition:none}}

/* Adaptive narrow-screen layout: stack primary content before it becomes cramped. */
@media (max-width:900px){
  .byoc-hero{display:block;min-height:auto}
  .byoc-hero-copy{min-height:clamp(440px,72svh,680px);padding:clamp(104px,17svh,145px) clamp(24px,5vw,60px) clamp(44px,8svh,80px);justify-content:flex-start}
  .byoc-hero h1{font-size:clamp(3.3rem,10vw,7rem);margin-top:20px}
  .byoc-hero-art{min-height:clamp(280px,48svh,480px)}
  .byoc-pagehero{min-height:clamp(430px,76svh,570px);display:block;padding:clamp(112px,15svh,160px) clamp(24px,5vw,60px) clamp(50px,8svh,90px)}
  .byoc-pagehero h1{font-size:clamp(3.2rem,10vw,7rem)}
  .byoc-pagehero .byoc-lede{margin-top:clamp(28px,6svh,48px);max-width:680px}
  .scene-grid{display:flex;overflow-x:auto;gap:8px;padding-bottom:4px}
  .scene-card,.scene-card:first-child{min-width:min(78vw,560px);height:clamp(280px,48svh,430px);grid-column:auto}
  .byoc-media-band{height:clamp(160px,28svh,230px)}
  .footer-top{display:block}
  .footer-links{margin-top:32px}
}
@media (min-width:701px) and (max-width:900px){
  .byoc-nav{padding-left:28px;padding-right:28px;gap:18px}
  .byoc-navlinks{gap:18px}
  .stat-grid{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(2){border-right:0}
  .stat:nth-child(3){border-bottom:0}
  .stat:nth-child(4){border-right:0;border-bottom:0}
  .byoc-records{grid-template-columns:repeat(2,minmax(0,1fr))}
  .principles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lens-list{display:flex;overflow-x:auto;gap:10px}
  .lens-item{min-width:44vw}
}
@media (max-width:430px) and (max-height:680px){
  .byoc-nav{padding-top:10px;padding-bottom:10px;gap:8px}
  .byoc-hero-copy{min-height:clamp(400px,68svh,500px);padding-top:96px;padding-bottom:36px}
  .byoc-hero h1{font-size:clamp(3rem,12vw,4.5rem);margin-bottom:20px}
  .byoc-lede{font-size:15px;line-height:1.55}
  .byoc-hero-art{min-height:clamp(230px,42svh,300px)}
  .byoc-pagehero{min-height:clamp(400px,72svh,500px);padding-top:104px;padding-bottom:44px}
  .byoc-pagehero h1{font-size:clamp(3rem,12vw,4.8rem)}
  .byoc-pagehero .byoc-lede{margin-top:26px;font-size:15px;line-height:1.55}
}

/* Authored editorial scenes keep media fields legible when no live event is confirmed. */
.field-story{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px}
.field-story .live-event-slot{grid-column:1/-1;min-height:58px;display:flex;align-items:center}
.concept-card{background:#eef1e9;border:1px solid #c9d0c6;padding:22px;min-height:208px;display:flex;flex-direction:column;justify-content:space-between}
.concept-card h3{font-size:clamp(19px,2.1vw,29px);line-height:1.03;letter-spacing:-.045em;margin:24px 0 12px;color:#202522}
.concept-card p{font-size:12px;line-height:1.7;color:#56625b;margin:0}
.concept-card small{font:700 9px/1.4 monospace;letter-spacing:.08em;color:#77847b;margin-top:20px}
.concept-meta{display:flex;justify-content:space-between;gap:12px;font:700 9px monospace;letter-spacing:.1em;color:#c2643d}
.concept-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:28px}
.concept-grid .concept-card{min-height:245px}
@media (max-width:900px){.concept-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.field-story{gap:10px}}
@media (max-width:700px){.field-story,.concept-grid{grid-template-columns:1fr}.concept-card,.concept-grid .concept-card{min-height:0;padding:18px}.concept-card h3{margin:20px 0 10px}.concept-card small{margin-top:16px}}

/* Low-height windows: reveal the next content block instead of leaving a dead gap. */
@media (max-width:900px) and (max-height:700px){
  .byoc-content{padding:34px 0}
  .byoc-block{padding:42px 0}
  .byoc-block h2{margin-bottom:18px}
  .field-section{padding:58px 0}
  .end-cta{padding:76px 0}
}

/* Extra breathing room for hero copy on narrow screens. Keep media full-bleed. */
@media (max-width:900px){
  .byoc-hero-copy{padding-left:clamp(32px,6.25vw,56px);padding-right:clamp(32px,6.25vw,56px)}
  .byoc-hero-copy .byoc-lede{max-width:34rem}
  .byoc-pagehero{padding-left:clamp(32px,6.25vw,56px);padding-right:clamp(32px,6.25vw,56px)}
}

@media (max-width:900px){
  .byoc-pagehero h1{letter-spacing:-.035em;word-spacing:0;overflow-wrap:normal}
}

@media (max-width:900px){
  .byoc-block h2,.field-card h2,.end-cta h2{letter-spacing:-.045em}
}

/* Home hero: let narrow screens reveal the next section sooner. */
@media (max-width:900px){
  .byoc-hero-copy{min-height:0;padding-top:clamp(92px,12svh,110px);padding-bottom:20px}
  .byoc-hero-art{min-height:clamp(220px,30svh,280px)}
}

@media (max-width:900px){
  .byoc-hero-copy{padding-top:clamp(84px,10svh,100px);padding-bottom:16px}
  .byoc-hero h1{font-size:clamp(2.9rem,10vw,7rem);margin-top:16px;margin-bottom:18px}
  .byoc-hero-art{min-height:clamp(200px,26svh,250px)}
}

@media (min-width:901px) and (max-width:2000px){
  .byoc-hero{min-height:clamp(700px,82svh,820px)}
  .byoc-hero-art{min-height:clamp(700px,82svh,820px)}
  .byoc-hero-copy{padding-top:clamp(100px,12svh,140px);padding-bottom:60px}
  .byoc-hero h1{font-size:clamp(4.6rem,7vw,7.6rem);margin-top:16px;margin-bottom:20px}
}

/* Home first fold: hero plus the four-point stat rail always fills one viewport. */
.byoc-hero{height:calc(100svh - var(--home-stat-h,161px));min-height:0;overflow:hidden}
.byoc-hero-copy,.byoc-hero-art{height:100%;min-height:0}
.stat-band{height:var(--home-stat-h,161px);min-height:0;padding:0;overflow:hidden}
.stat-grid{height:100%;min-height:0}
.stat{min-height:0;overflow:hidden}
@media (min-width:901px){
  .byoc-hero-copy{padding-top:clamp(80px,10svh,120px);padding-bottom:clamp(34px,5svh,60px)}
  .byoc-hero-art{min-height:0}
  .stat{padding-top:clamp(18px,2.5vw,32px);padding-bottom:clamp(18px,2.5vw,32px)}
}
@media (max-width:900px){
  :root{--home-stat-h:clamp(124px,19svh,170px)}
  .byoc-hero{display:grid;grid-template-rows:minmax(0,1.7fr) minmax(0,1fr);height:calc(100svh - var(--home-stat-h));min-height:0}
  .byoc-hero-copy{height:auto;min-height:0;padding:clamp(64px,10svh,92px) clamp(32px,6.25vw,56px) 10px;overflow:hidden}
  .byoc-hero h1{font-size:clamp(2.35rem,9vw,6.5rem);margin-top:12px;margin-bottom:12px}
  .byoc-hero .byoc-lede{font-size:clamp(13px,1.9vw,16px);line-height:1.45;margin-top:0;margin-bottom:0}
  .byoc-actions{margin-top:12px}
  .byoc-hero-art{height:auto;min-height:0}
  .stat-grid{grid-template-columns:repeat(4,minmax(0,1fr));height:100%;width:calc(100% - 40px)}
  .stat{padding:clamp(10px,2.2vw,18px) clamp(5px,1.4vw,14px);border-right:1px solid var(--line);border-bottom:0}
  .stat:last-child{border-right:0}
  .stat:nth-child(2),.stat:nth-child(3),.stat:nth-child(4){border-right:1px solid var(--line);border-bottom:0}
  .stat:last-child{border-right:0}
  .stat b{font-size:clamp(18px,4.5vw,32px)}
  .stat span{display:block;font-size:clamp(8px,1.65vw,12px);line-height:1.25}
}

@media (max-width:900px) and (max-height:700px){
  .byoc-hero{grid-template-rows:minmax(0,1.9fr) minmax(0,.9fr)}
}

/* Inner-page first fold: show the complete page hero before the next section. */
.byoc-pagehero{height:100svh;min-height:0;box-sizing:border-box}
@media (min-width:901px){
  .byoc-pagehero{padding-top:clamp(120px,14svh,180px);padding-bottom:clamp(42px,8svh,96px)}
}
@media (max-width:900px){
  .byoc-pagehero{height:100svh;min-height:0;display:flex;flex-direction:column;justify-content:flex-end;gap:0;padding-top:clamp(100px,14svh,145px);padding-bottom:clamp(34px,7svh,70px);overflow:hidden}
  .byoc-pagehero h1{font-size:clamp(2.9rem,10vw,7rem)}
  .byoc-pagehero .byoc-lede{margin-top:clamp(24px,4svh,40px);margin-bottom:0}
}

/* Keep inner hero content centered inside its one-screen frame. */
.byoc-pagehero{align-items:center}
@media (max-width:900px){
  .byoc-pagehero{justify-content:center}
}

@media (min-width:901px){
  .byoc-pagehero{align-items:flex-start;padding-top:clamp(140px,18svh,190px);padding-bottom:clamp(42px,8svh,96px)}
  .byoc-pagehero>.byoc-lede{margin-top:clamp(170px,24svh,250px);margin-bottom:0}
}

/* Keep language changes inside a stable frame instead of moving the page. */
.byoc-nav{height:73px}
.byoc-wordmark{width:120px;flex:0 0 120px}
.byoc-navlinks{width:236px;flex:0 0 236px;justify-content:space-between;gap:0}
.byoc-lang{width:44px;height:34px;flex:0 0 44px;padding:0}

@media (min-width:901px){
  .byoc-hero-copy{justify-content:flex-start;padding-top:clamp(108px,13svh,126px)}
  .byoc-hero h1{font-size:clamp(4rem,5.2vw,6.6rem);letter-spacing:-.045em;min-height:clamp(160px,18vw,190px)}
  .byoc-hero .byoc-lede{min-height:58px}
  .byoc-actions{min-height:41px}
}

@media (max-width:900px){
  .byoc-nav{height:90px;flex-wrap:wrap;padding-left:clamp(20px,3.65vw,28px);padding-right:clamp(20px,3.65vw,28px);gap:10px 18px}
  .byoc-navlinks{width:100%;flex-basis:100%;height:20px;min-height:20px;align-items:center}
  .byoc-hero h1{min-height:84px}
  .byoc-hero .byoc-lede{min-height:58px}
  .byoc-actions{min-height:41px}
}

/* English uses the same two-line title geometry as Chinese. */
.lang-en .byoc-hero h1{font-size:clamp(3.6rem,4.25vw,5.2rem);line-height:1.15;letter-spacing:-.035em}
@media (max-width:900px){
  .byoc-hero-copy{padding-top:clamp(102px,12svh,118px)}
  .lang-en .byoc-hero h1{font-size:clamp(1.95rem,7.8vw,5.3rem);line-height:.84;letter-spacing:-.035em}
  .byoc-actions .byoc-button{height:41px;padding:0 18px}
}
@media (min-width:901px){.byoc-actions .byoc-button{height:41px;padding:0 18px}}

/* Each inner route opens on its first real content surface, not a generic title wall. */
main[data-fold="origin"] > .byoc-pagehero,
main[data-fold="notes"] > .byoc-pagehero,
main[data-fold="governance"] > .byoc-pagehero{display:none}
/* Single-fold opening applies only to folds whose first surface fits one viewport.
   notes/governance carry lists that grow without bound (81 short posts, policy blocks),
   so clipping them cut the list off and let the clipped overflow extend the scrollable
   area on WebKit (blank scrolling past the end). Let those two flow instead. */
main[data-fold="origin"] > .byoc-pagehero + .byoc-content{height:100svh;min-height:100svh;overflow:hidden;display:flex;align-items:center;padding:clamp(70px,10svh,120px) 0 clamp(28px,5svh,60px)}
main[data-fold="notes"] > .byoc-pagehero + .byoc-content,
main[data-fold="governance"] > .byoc-pagehero + .byoc-content{height:auto;min-height:0;overflow:visible;display:block;padding:clamp(96px,11svh,132px) 0 clamp(48px,7svh,84px)}
main[data-fold] > .byoc-pagehero + .byoc-content > .byoc-wrap{width:min(var(--max),calc(100% - 80px));margin:0 auto}
main[data-fold="origin"] > .byoc-pagehero + .byoc-content .byoc-block{width:100%;padding:0;border-top:0}
main[data-fold="origin"] > .byoc-pagehero + .byoc-content .byoc-block h2{margin-bottom:20px}
main[data-fold="origin"] > .byoc-pagehero + .byoc-content .byoc-block>p{margin-top:0}
main[data-fold="origin"] > .byoc-pagehero + .byoc-content{align-items:flex-start;padding-top:clamp(108px,11svh,154px)}
main[data-fold="notes"] > .byoc-pagehero + .byoc-content,
main[data-fold="governance"] > .byoc-pagehero + .byoc-content{align-items:flex-start}

@media (max-width:900px){
  main[data-fold] > .byoc-pagehero + .byoc-content{padding:72px 0 24px}
  main[data-fold="notes"] > .byoc-pagehero + .byoc-content,
  main[data-fold="governance"] > .byoc-pagehero + .byoc-content{padding-top:clamp(104px,13svh,148px)}
  main[data-fold] > .byoc-pagehero + .byoc-content > .byoc-wrap{width:calc(100% - 64px)}
  main[data-fold="origin"] > .byoc-pagehero + .byoc-content{align-items:flex-start;padding-top:clamp(102px,12svh,128px)}
  main[data-fold="origin"] > .byoc-pagehero + .byoc-content .byoc-block h2{font-size:clamp(2rem,8.8vw,4.5rem);line-height:.92;margin-bottom:14px}
  main[data-fold="origin"] > .byoc-pagehero + .byoc-content .byoc-block>p{font-size:clamp(11px,3.05vw,16px);line-height:1.45;margin-bottom:0}
  main[data-fold="origin"] > .byoc-pagehero + .byoc-content .byoc-records{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:18px}
  main[data-fold="origin"] > .byoc-pagehero + .byoc-content .byoc-record{padding:clamp(9px,2.6vw,20px);min-height:clamp(132px,22svh,188px);overflow:hidden}
  main[data-fold="origin"] > .byoc-pagehero + .byoc-content .byoc-record h3{font-size:clamp(12px,3.4vw,19px);line-height:1.1;margin:clamp(18px,4.5vw,40px) 0 7px}
  main[data-fold="origin"] > .byoc-pagehero + .byoc-content .byoc-record p{font-size:clamp(8px,2.25vw,12px);line-height:1.35;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
  main[data-fold="origin"] > .byoc-pagehero + .byoc-content .byoc-record small{font-size:clamp(7px,1.9vw,9px)}
}
@media (max-width:900px){
  main[data-fold="origin"] > .byoc-pagehero + .byoc-content .byoc-block h2{height:clamp(63px,16.2vw,124px);font-size:clamp(1.7rem,7.2vw,4.5rem)}
  .lang-en main[data-fold="origin"] > .byoc-pagehero + .byoc-content .byoc-block h2{font-size:clamp(1.7rem,7.2vw,4.5rem)}
}
@media (min-width:901px){
  main[data-fold="origin"] > .byoc-pagehero + .byoc-content .byoc-record{height:193px;min-height:193px}
}