:root {
  --orange: #ff5a16;
  --orange-soft: #ff8a54;
  --green: #22a85a;
  --session-01-primary: #E9683C;
  --session-01-accent: var(--orange);
  --session-02-primary: #14783d;
  --session-02-soft: #dff5e7;
  --ink: #11110f;
  --muted: #67665f;
  --paper: #f7f7f2;
  --line: #d8d8d0;
  --white: #fff;
  --nav-hover-bg: #F9ECD7;
  --nav-h: 68px;
  --pad: clamp(20px, 5.2vw, 84px);
  --radius: 28px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth;scroll-padding-top:92px} body{margin:0;background:#fff;color:var(--ink);font-family:'Noto Sans JP',sans-serif;overflow-x:hidden} a{color:inherit;text-decoration:none} button,a{ -webkit-tap-highlight-color:transparent} ::selection{background:var(--orange);color:#fff}
.page-noise{position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}
.ribbon{position:fixed;top:14px;left:50%;transform:translateX(-50%);width:min(calc(100% - 28px),1400px);height:var(--nav-h);display:grid;grid-template-columns:auto 1fr auto;align-items:center;padding:0 10px 0 22px;background:rgba(255,255,255,.86);backdrop-filter:blur(18px);border:1px solid rgba(15,15,12,.12);border-radius:999px;z-index:1000;box-shadow:0 12px 40px rgba(30,26,19,.08)}
.brand{display:flex;gap:10px;align-items:center;font:700 14px/1 'DM Sans',sans-serif;letter-spacing:.08em}.brand-logo{display:block;height:40px;width:auto}
.ribbon-links{justify-self:center;display:flex;gap:2px}
.ribbon-links a{position:relative;isolation:isolate;overflow:visible;padding:11px 14px;font-size:15px;font-weight:600;color:#5f5e58;border-radius:999px;transition:color .25s}
.ribbon-links a::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:999px;background:var(--nav-hover-bg);opacity:0;transform:scale(.7);transition:transform .45s cubic-bezier(0.34,1.56,0.64,1),opacity .2s ease}
.ribbon-links a.active::after{content:"";position:absolute;bottom:5px;left:50%;width:4px;height:4px;background:var(--orange);border-radius:50%;transform:translateX(-50%)}
.ribbon-links a:hover,.ribbon-links a:focus-visible,.ribbon-links a.active{color:#111}
.ribbon-links a:hover::before,.ribbon-links a:focus-visible::before,.ribbon-links a.active::before{opacity:1;transform:scale(1)}
.nav-cta{position:relative;isolation:isolate;overflow:visible;display:flex;align-items:center;gap:12px;padding:14px 19px;border-radius:999px;background:var(--orange);color:white;font-size:15px;font-weight:700}
.nav-cta::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:999px;background:var(--orange-soft);opacity:0;transform:scale(.7);transition:transform .45s cubic-bezier(0.34,1.56,0.64,1),opacity .2s ease}
.nav-cta::after{content:"";position:absolute;bottom:7px;left:50%;width:4px;height:4px;background:#fff;border-radius:50%;opacity:0;transform:translate(-50%,3px) scale(.3);transition:transform .45s cubic-bezier(0.34,1.56,0.64,1) .05s,opacity .2s ease .05s}
.nav-cta:hover::before,.nav-cta:focus-visible::before{opacity:1;transform:scale(1)}
.nav-cta:hover::after,.nav-cta:focus-visible::after{opacity:1;transform:translate(-50%,0) scale(1)}
.nav-cta span,.button span{font-family:'DM Sans';font-size:16px}
.nav-burst-particle{position:absolute;left:0;top:0;width:6px;height:6px;border-radius:50%;pointer-events:none;z-index:2;opacity:0;transform:translate(var(--sx),var(--sy)) scale(0);animation:nav-burst-in .55s cubic-bezier(0.34,1.56,0.64,1) var(--delay,0ms) forwards}
.nav-burst-particle--nav{background:var(--nav-hover-bg)}
.nav-burst-particle--cta{background:var(--orange-soft)}
@keyframes nav-burst-in{0%{transform:translate(var(--sx),var(--sy)) scale(0);opacity:0}30%{opacity:1}60%{transform:translate(var(--cx),var(--cy)) scale(1.2);opacity:1}100%{transform:translate(var(--cx),var(--cy)) scale(0);opacity:0}}
.section{position:relative}
.flow-story{position:relative;background:#fcfcf9;isolation:isolate}
.flow-background{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:clip}
.flow-canvas{position:sticky;top:0;height:100vh;overflow:hidden;opacity:1;will-change:transform,opacity}
.ambient-flow{position:absolute;inset:-8vh -5vw -8vh auto;width:112vw;height:116vh;overflow:visible}
.flow-field{transform-origin:68% 48%;will-change:transform}
.ambient-line{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;will-change:d}
.orange-line{stroke:rgba(235,112,30,.78);stroke-width:1.8}.green-line{stroke:rgba(16,86,79,.82);stroke-width:1.7}.pale-green{stroke:rgba(16,86,79,.18);stroke-width:1.25}.pale-orange{stroke:rgba(235,112,30,.20);stroke-width:1.25}
.flow-nodes .node{vector-effect:non-scaling-stroke;transform-box:fill-box;transform-origin:center}.node-orange{fill:#eb701e}.node-green{fill:#10564f}.node-ring{fill:#fcfcf9;stroke:#eb701e;stroke-width:1.5}
.flow-wash{position:absolute;inset:0;background:linear-gradient(90deg,rgba(252,252,249,.995) 0%,rgba(252,252,249,.97) 29%,rgba(252,252,249,.72) 47%,rgba(252,252,249,.18) 69%,rgba(252,252,249,0) 88%);transition:opacity .3s}
.flow-story>.section{position:relative;z-index:3}
.hero{min-height:100svh;padding:calc(var(--nav-h) + 88px) var(--pad) 58px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;background:transparent;isolation:isolate}.hero::after{content:"";position:absolute;inset:auto -6vw -30vh 35%;height:70vh;background:radial-gradient(circle at center,rgba(255,90,22,.12),transparent 65%);pointer-events:none;z-index:0}.hero-orbit{position:absolute;border:1px solid rgba(17,17,15,.09);border-radius:50%;pointer-events:none;z-index:0}.orbit-a{width:42vw;height:42vw;right:-17vw;top:14vh;opacity:.38}.orbit-b{width:24vw;height:24vw;right:8vw;top:37vh;border-color:rgba(34,168,90,.20);opacity:.36}
.hero-topline{display:flex;justify-content:space-between;position:relative;z-index:3}.hero-topline p{margin:0;font:600 clamp(24px,2.3vw,34px)/1.15 'DM Sans',sans-serif;letter-spacing:-.01em}.hero-topline p:last-child{color:var(--green);padding-right:20%}.topline-break-desktop{display:none}
.hero-copy{position:relative;z-index:3;max-width:min(970px,72vw);margin-top:22px}.eyebrow,.section-kicker{font:600 12px/1 'DM Sans',sans-serif;letter-spacing:.18em;text-transform:uppercase;margin:0 0 24px;color:var(--orange)}.hero-title{margin:0;font-size:clamp(54px,7.5vw,116px);line-height:.94;letter-spacing:-.065em;font-weight:800;max-width:970px;text-shadow:0 1px 0 rgba(255,255,255,.5)}.line-mask{display:block;overflow:hidden;padding-bottom:.07em;transform:translateZ(0)}.line-mask>span{display:block}.accent-line{color:var(--orange)}.hero-lead{margin:34px 0 0;max-width:720px;font-size:clamp(14px,1.15vw,18px);line-height:2;color:#34332f;font-weight:500}.hero-actions{display:flex;align-items:center;gap:28px;margin-top:34px}.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:54px;padding:0 24px;border-radius:999px;font-size:13px;font-weight:700;transition:transform .25s,background .25s,color .25s}.button:hover{transform:translateY(-2px)}.button.primary{background:var(--ink);color:white}.button.primary:hover{background:var(--orange)}.button.text-link{padding:0;border-radius:0;border-bottom:1px solid #aaa;min-height:40px}
.hero-meta{position:relative;z-index:3;display:flex;gap:70px;margin-top:8vh}.hero-meta>div{display:flex;flex-direction:column;gap:7px}.hero-meta span,.fact-label{font:600 12px/1 'DM Sans';letter-spacing:.14em;color:#77766f}.hero-meta strong{font:600 14px/1.4 'DM Sans';letter-spacing:.02em}.hero-meta span{font-size:14px}.scroll-cue{position:absolute;right:var(--pad);bottom:54px;z-index:3;font:500 12px/1 'DM Sans';letter-spacing:.16em;display:flex;align-items:center;gap:10px;transform:rotate(90deg);transform-origin:right center}.scroll-cue span{width:42px;height:1px;background:#222}
.section-number{position:absolute;left:var(--pad);top:90px;font:600 12px/1 'DM Sans';letter-spacing:.08em;color:#8e8d87}.event{padding:150px var(--pad);min-height:100vh;background:transparent}.event>.section-kicker{margin-left:16%}.event-grid{display:grid;grid-template-columns:.85fr 1.4fr;gap:8vw;align-items:start;margin-top:60px}.event-intro{padding-top:20px}.display-title{font:600 clamp(58px,7.8vw,130px)/.88 'DM Sans',sans-serif;letter-spacing:-.075em;margin:0}.display-title .orange{color:var(--orange)}.event-intro>p{max-width:440px;margin-top:46px;color:var(--muted);line-height:2}.event-facts{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ink)}.fact{min-height:190px;padding:24px 0;border-bottom:1px solid var(--line)}.fact:nth-child(odd){padding-right:38px;border-right:1px solid var(--line)}.fact:nth-child(even){padding-left:38px}.fact.large{min-height:330px}.fact p{margin:26px 0 0}.fact.large strong{font:600 clamp(64px,7vw,104px)/.8 'DM Sans';letter-spacing:-.07em}.fact.large em{font:600 12px/1 'DM Sans';font-style:normal;margin-left:10px}.fact .venue-name{font-size:clamp(24px,2.4vw,38px);line-height:1.65;font-weight:700;letter-spacing:-.035em}.fact.small p{font-size:13px;line-height:1.8;color:#5f5e58}
.practice{min-height:130vh;background:transparent;color:white;overflow:hidden;padding:0 var(--pad);isolation:isolate}.practice::before{content:"";position:absolute;inset:0;background:#151510;z-index:-1}.practice-sticky{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:safe center;z-index:3;max-width:860px}.section-kicker.invert{color:#ffb08d}.practice-title{font-size:clamp(52px,6.4vw,98px);line-height:1.05;letter-spacing:-.06em;margin:0}.practice-title span{color:var(--orange)}.practice-copy{max-width:720px;margin:36px 0 0;color:#c8c7bf;line-height:2;font-size:15px}.practice-visual{position:absolute;right:-10vw;top:12vh;width:min(58vw,800px);aspect-ratio:1;border-radius:50%}.sun-core{position:absolute;inset:27%;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff 0,#ffccac 10%,var(--orange) 35%,#b92c00 70%);box-shadow:0 0 100px rgba(255,90,22,.35)}.ring{position:absolute;border:1px solid rgba(255,255,255,.22);border-radius:50%;inset:11%}.r2{inset:2%;border-color:rgba(255,90,22,.45)}.r3{inset:-8%;border-style:dashed;border-color:rgba(34,168,90,.5)}.signal-tag{position:absolute;padding:8px 11px;border:1px solid rgba(255,255,255,.3);border-radius:999px;font:600 9px/1 'DM Sans';letter-spacing:.14em;background:rgba(20,20,15,.65);backdrop-filter:blur(10px)}.tag-a{left:5%;top:26%}.tag-b{right:2%;top:48%;color:#ffb08d}.tag-c{left:20%;bottom:11%;color:#77d399}.giant-bg{position:absolute;left:-2vw;bottom:-12vh;margin:0;font:600 18vw/.68 'DM Sans';letter-spacing:-.08em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.07);white-space:nowrap}
.sessions{padding:150px var(--pad) 180px;background:#fafaf6}.section-head{display:grid;grid-template-columns:1fr auto;gap:60px;align-items:end;margin-left:16%}.section-title{font-size:clamp(44px,5.8vw,86px);line-height:1.08;letter-spacing:-.055em;margin:0;font-weight:800}.section-sidecopy{max-width:390px;line-height:1.9;color:var(--muted);font-size:13px;margin:0 0 8px}.session-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,72px);margin:90px 0 0 16%}.session{position:relative;padding-top:22px;border-top:4px solid var(--ink)}.session-01{border-color:var(--session-01-accent)}.session-02{margin-top:80px;border-color:var(--session-02-primary)}.session-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:44px}.session-index{font:500 12px/1 'DM Sans';letter-spacing:.14em}.session-index strong{font-size:34px;letter-spacing:-.06em;margin-left:8px}.meaning-badge{padding:8px 10px;border-radius:999px;background:#ffe4d6;color:#c2410c;font-size:12px;font-weight:700}.outline-badge{padding:8px 10px;border-radius:999px;border:1px solid transparent;background:var(--session-02-soft);color:var(--session-02-primary);font:600 12px/1 'DM Sans';letter-spacing:.1em}.session h3{margin:0;font-size:clamp(25px,2.2vw,36px);line-height:1.55;letter-spacing:-.035em}.session h3 span{font-size:.7em;font-weight:600;color:#6e6d66}.session-desc{min-height:168px;margin:28px 0 0;font-size:13px;line-height:2;color:#55544e}.green-emphasis{color:var(--session-01-accent);font-weight:800}.green-emphasis-02{color:var(--green);font-weight:800}.topic-block{min-height:148px;margin-top:34px;padding:24px 26px;background:#FFF4E1;color:var(--ink)}.topic-block.soft{background:#e8f5ec;color:var(--ink);border:1px solid #bfe6cd}.topic-block>span{font:600 12px/1 'DM Sans';letter-spacing:.1em;color:#b23807}.topic-block.soft>span{color:var(--session-02-primary)}.topic-block p{margin:20px 0 0;font-size:18px;line-height:1.65;font-weight:800}.session-meta{margin:0}.session-meta div{display:grid;grid-template-columns:120px 1fr;min-height:104px;padding:22px 0;border-bottom:1px solid var(--line)}.session-meta dt{font-size:12px;color:#83827b}.session-meta dd{margin:0;font-size:14px;font-weight:700;line-height:1.5}.session-meta small{display:block;margin-top:8px;font-size:12px;font-weight:500;color:#66655f}
.bridge{padding:180px var(--pad) 120px;overflow:hidden}.bridge-small{text-align:center;font:600 12px/1 'DM Sans';letter-spacing:.16em;color:var(--green)}.bridge-title{text-align:center;font-size:clamp(48px,7vw,110px);line-height:1.03;letter-spacing:-.065em;margin:42px auto 0;max-width:1200px}.bridge-title span{color:var(--orange)}.bridge-ribbon{display:flex;gap:40px;width:max-content;margin-top:110px;font:600 clamp(60px,8vw,120px)/1 'DM Sans';letter-spacing:-.06em;color:#f0f0eb;white-space:nowrap;transform:translateX(-8vw)}
.employee{padding:150px var(--pad) 170px;background:#f5f5f0}.employee-intro{margin-left:16%;display:grid;grid-template-columns:1.2fr .8fr;gap:50px;align-items:end}.employee-intro>.section-kicker{grid-column:1/-1;margin:0}.employee-intro>.section-title{max-width:800px}.employee-intro>p:last-child{max-width:450px;margin:0 0 6px;color:var(--muted);line-height:2;font-size:13px}.flow-stage{margin:120px 0 0 8%;display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:30px;align-items:center;min-height:620px}.flow-column{display:flex;flex-direction:column;gap:18px}.flow-label{font:600 12px/1 'DM Sans';letter-spacing:.14em;color:#8a8982;margin-bottom:12px}.source-node,.result-node{padding:24px 24px;background:white;border:1px solid #deded6;position:relative}.source-node span{position:absolute;right:18px;top:18px;font:600 12px/1 'DM Sans';color:#aaa}.source-node strong{display:block;font-size:16px}.source-node small{display:block;margin-top:9px;font:500 12px/1 'DM Sans';color:#8a8982}.flow-center{position:relative;aspect-ratio:1}.flow-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.flow-path{fill:none;stroke:#d2d1ca;stroke-width:2;stroke-linecap:round}.p4{stroke:var(--orange);stroke-width:4}.ew-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:62%;aspect-ratio:1;border-radius:50%;background:var(--orange);color:white;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:0 30px 80px rgba(255,90,22,.28)}.ew-core span{font:600 12px/1 'DM Sans';letter-spacing:.08em}.ew-core strong{font:700 clamp(20px,2vw,31px)/1.1 'DM Sans';letter-spacing:-.04em;margin-top:8px}.ew-core small{font:600 12px/1 'DM Sans';letter-spacing:.12em;margin-top:16px;opacity:.75}.result-node{display:flex;align-items:center;gap:14px}.check{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#e9e9e3;font:700 12px/1 'DM Sans'}.result-node.highlight{border-color:var(--green);background:#f1fbf5}.result-node.highlight .check{background:var(--green);color:white}.employee-proof{margin:90px 0 0 8%;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #c8c7bf}.employee-proof>div{padding:30px 26px 10px 0;border-right:1px solid #c8c7bf}.employee-proof>div+div{padding-left:26px}.employee-proof>div:last-child{border-right:0}.proof-num{display:block;font:600 12px/1 'DM Sans';letter-spacing:.12em;color:var(--orange);margin-bottom:25px}.proof-green .proof-num{color:var(--green)}.employee-proof strong{display:block;font-size:18px}.employee-proof p{font-size:12px;color:#75746e;margin-top:10px}
.booth{min-height:95vh;padding:150px var(--pad);display:grid;grid-template-columns:1.1fr 1fr;gap:8vw;align-items:center;overflow:hidden}.booth-visual{position:relative;min-height:620px}.booth-frame{position:absolute;inset:6% 3% 5% 7%;border:1px solid #cac9c2;transform:rotate(-4deg)}.booth-frame::after{content:"";position:absolute;inset:11%;border:1px solid var(--orange);transform:rotate(8deg)}.booth-disc{position:absolute;border-radius:50%;background:var(--orange);filter:blur(.2px)}.d1{width:54%;aspect-ratio:1;left:4%;top:18%}.d2{width:23%;aspect-ratio:1;right:8%;bottom:13%;background:var(--green)}.booth-visual>span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font:700 clamp(80px,11vw,160px)/1 'DM Sans';letter-spacing:-.08em;color:white;mix-blend-mode:difference}.booth-copy{max-width:600px}.booth-copy>p:not(.section-kicker){line-height:1.9;color:var(--muted);margin-top:32px}.booth-info{margin-top:50px;padding-top:36px;border-top:1px solid var(--ink);display:flex;align-items:center;gap:40px;flex-wrap:wrap}.booth-number{display:flex;align-items:baseline;gap:18px;padding:20px 30px;border:1px solid var(--ink)}.booth-number span{font:600 11px/1 'DM Sans';letter-spacing:.14em;color:var(--green)}.booth-number strong{font:800 clamp(38px,4vw,60px)/1 'DM Sans';letter-spacing:-.03em;color:var(--orange)}.booth-status{display:flex;align-items:center;gap:12px;max-width:260px}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--green);flex:none;animation:booth-pulse 2s ease-in-out infinite}.booth-status p{font-size:12px;color:#888;line-height:1.7;margin:0}@keyframes booth-pulse{0%,100%{opacity:1}50%{opacity:.3}}
.final-cta{min-height:94vh;padding:100px var(--pad);background:var(--orange);color:white;display:grid;place-items:center;overflow:hidden}.final-inner{position:relative;z-index:2;text-align:center;max-width:1080px}.final-inner h2{margin:26px 0 0;font-size:clamp(58px,8vw,124px);line-height:.98;letter-spacing:-.07em}.final-inner>p:not(.section-kicker):not(.final-note){font-size:14px;line-height:2;margin:30px auto 0;max-width:650px}.final-actions{display:flex;justify-content:center;gap:12px;margin-top:36px}.button.light{background:white;color:var(--orange)}.button.ghost{border:1px solid rgba(255,255,255,.6);color:white}.final-note{margin-top:80px!important;font:600 12px/1 'DM Sans'!important;letter-spacing:.13em;opacity:.75}.cta-marquee{position:absolute;top:16%;left:0;display:flex;gap:50px;width:max-content;font:700 12vw/1 'DM Sans';letter-spacing:-.07em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.23);opacity:.8}
footer{padding:44px var(--pad) 28px;background:#141410;color:#aaa;font:500 12px/1.6 'DM Sans','Noto Sans JP',sans-serif;letter-spacing:.04em}
.footer-top{display:flex;flex-wrap:wrap;align-items:center;gap:14px 32px;padding-bottom:26px}
.footer-brand{font-size:14px;font-weight:700;color:white;letter-spacing:.08em}
.footer-about{margin-top:0;padding-top:26px;border-top:1px solid rgba(255,255,255,.14);max-width:640px}
.footer-about p{margin:0;line-height:1.9;color:#c4c3bc;font-size:13px}
.footer-about a{display:inline-flex;align-items:center;gap:8px;margin-top:16px;color:var(--orange);font-weight:700;font-size:13px;transition:color .2s}
.footer-about a:hover{color:var(--orange-soft)}
.footer-copy{margin:34px 0 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);color:#8b8a83;font-size:12px}
@media(max-width:1000px){.ribbon{grid-template-columns:auto 1fr auto}.ribbon-links{overflow:auto;justify-self:stretch;margin:0 12px;scrollbar-width:none}.ribbon-links::-webkit-scrollbar{display:none}.ribbon-links a{white-space:nowrap}.event-grid{grid-template-columns:1fr}.event>.section-kicker,.section-head,.session-grid,.employee-intro{margin-left:10%}.practice-visual{right:-25vw}.session-grid{gap:28px}.session-desc{min-height:220px}.employee-intro{grid-template-columns:1fr}.flow-stage{margin-left:0;grid-template-columns:.8fr 1fr .8fr}.booth{grid-template-columns:1fr 1fr;gap:30px}}
@media(max-width:760px){:root{--nav-h:58px;--pad:20px}.ribbon{top:8px;width:calc(100% - 16px);padding-left:15px}.brand{font-size:12px}.ribbon-links{display:none}.nav-cta{padding:12px 15px;font-size:12px}.hero{padding-top:110px;min-height:100svh}.hero-topline p:last-child{padding-right:0}.hero-copy{margin-top:auto;margin-bottom:auto}.hero-title{font-size:clamp(51px,15vw,72px);line-height:.98}.hero-lead{font-size:13px;line-height:1.8;margin-top:26px}.desktop-only{display:none}.hero-actions{flex-direction:column;align-items:flex-start;gap:10px;margin-top:26px}.hero-meta{gap:18px;flex-direction:column;margin-top:10px}.scroll-cue{display:none}.ambient-flow{width:170vw;right:-68vw;height:112vh}.flow-wash{background:linear-gradient(180deg,rgba(252,252,249,.34) 0%,rgba(252,252,249,.15) 58%,rgba(252,252,249,.44) 100%)}.orbit-a{width:84vw;height:84vw}.orbit-b{width:52vw;height:52vw}.event,.sessions,.employee,.booth{padding-top:110px;padding-bottom:110px}.section-number{top:54px}.event>.section-kicker,.section-head,.session-grid,.employee-intro{margin-left:0}.event-grid{margin-top:36px}.display-title{font-size:19vw}.event-facts{grid-template-columns:1fr}.fact:nth-child(odd),.fact:nth-child(even){padding-left:0;padding-right:0;border-right:0}.fact.large{min-height:250px}.fact.large strong{font-size:22vw}.fact .venue-name{font-size:25px}.practice{min-height:115vh;padding:0 20px}.practice-sticky{justify-content:flex-end;padding-bottom:90px}.practice-title{font-size:13vw}.practice-copy{font-size:12px;max-width:88%;line-height:1.85}.practice-visual{right:-38vw;top:9vh;width:100vw}.giant-bg{font-size:28vw;bottom:2vh}.section-head{grid-template-columns:1fr}.section-title{font-size:12vw}.section-sidecopy{font-size:12px}.session-grid{grid-template-columns:1fr;margin-top:55px}.session-02{margin-top:25px}.session-desc{min-height:auto}.topic-block{min-height:auto}.session-meta div{grid-template-columns:94px 1fr}.bridge{padding:110px 20px 80px}.bridge-title{font-size:13vw}.bridge-ribbon{margin-top:75px;font-size:18vw}.employee-intro{gap:26px}.flow-stage{display:block;min-height:auto;margin-top:70px}.flow-column{gap:10px}.flow-center{margin:20px auto;width:min(88vw,430px)}.flow-svg{transform:rotate(90deg)}.flow-path{stroke-width:3}.employee-proof{margin:70px 0 0;grid-template-columns:1fr}.employee-proof>div,.employee-proof>div+div{padding:24px 0;border-right:0;border-bottom:1px solid #c8c7bf}.booth{grid-template-columns:1fr}.booth-visual{min-height:430px}.booth-copy{order:-1}.final-cta{min-height:90vh;padding:80px 20px}.final-inner h2{font-size:15vw}.final-actions{flex-direction:column;align-items:stretch}.cta-marquee{font-size:25vw;top:20%}.final-note{line-height:1.8!important}footer{padding-top:36px}.footer-top{flex-direction:column;align-items:flex-start;gap:8px;padding-bottom:22px}.footer-about{padding-top:22px}.footer-copy{margin-top:26px;padding-top:16px}.meaning-badge{font-size:12px}.session-top{margin-bottom:28px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.flow-canvas,.flow-field,.ambient-line,.flow-nodes{transform:none!important}.practice-visual,.bridge-ribbon,.cta-marquee{transform:none!important}.reveal{opacity:1!important;transform:none!important}}

/* Flow background v2: layered paths + independently roaming nodes */
.ambient-layer{opacity:.50}
.scroll-layer{opacity:.88}
.scroll-line{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;will-change:d}
.flow-nodes .node{will-change:transform,opacity}

/* Flow background v3: x-garden-inspired organic cable motion (original SYSLABO geometry) */
#organic-flow-field{transform-origin:74% 50%}
#organic-flow-field .ambient-line{shape-rendering:geometricPrecision}
#organic-flow-field .orange-line{stroke:rgba(235,112,30,.72);stroke-width:1.55}
#organic-flow-field .green-line{stroke:rgba(16,86,79,.80);stroke-width:1.5}
#organic-flow-field .pale-green{stroke:rgba(16,86,79,.20);stroke-width:1.05}
#organic-flow-field .pale-orange{stroke:rgba(235,112,30,.22);stroke-width:1.05}
#organic-flow-field .faint-line{opacity:.58}
#organic-flow-field .soft-node{opacity:.72}
@media(max-width:760px){
  #organic-flow-field .orange-line,#organic-flow-field .green-line{stroke-width:1.3}
  #organic-flow-field .pale-green,#organic-flow-field .pale-orange{stroke-width:.9}
}

/* Responsive QA refinements — verified at 1440 / 768 / 390 with Playwright */
.mobile-title-break{display:none}

@media (max-width: 900px) and (min-width: 761px){
  /* Two session columns became too narrow around iPad width. Preserve comparison,
     but stack the talks so Japanese headings and metadata retain editorial rhythm. */
  .sessions{padding-top:130px;padding-bottom:145px}
  .section-head,.session-grid{margin-left:8%;margin-right:0}
  .session-grid{grid-template-columns:1fr;gap:72px;max-width:620px}
  .session-02{margin-top:0}
  .session-desc{min-height:auto;max-width:590px}
  .topic-block{min-height:auto}
  .session-meta div{grid-template-columns:132px 1fr}
  .session h3{font-size:clamp(30px,4.1vw,38px);line-height:1.48}
}

@media (max-width: 760px){
  /* Hero: explicit Japanese line-break points instead of browser-created breaks. */
  .hero{padding-top:94px;padding-bottom:36px}
  .hero-topline{gap:20px;align-items:flex-start}
  .hero-topline p{line-height:1.2;max-width:100%}
  .hero-topline p:last-child{padding-right:0}
  .hero-copy{max-width:100%;width:100%;margin-top:16px;margin-bottom:36px}
  .hero-title{font-size:clamp(41px,11.7vw,48px);line-height:1.01;letter-spacing:-.055em;max-width:100%}
  .hero-title .line-mask:first-child>span{white-space:nowrap}
  .mobile-title-break{display:block}
  .hero-lead{max-width:340px;line-height:1.85;margin-top:24px}
  .hero-actions{margin-top:22px;gap:12px}
  .hero-actions .button{min-height:52px}
  .hero-meta{margin-top:8px;gap:14px}
  .hero-meta strong{font-size:14px;line-height:1.55}
  .hero-meta>div:last-child strong{max-width:290px}

  /* Keep the compact ribbon useful without letting the CTA dominate the viewport. */
  .ribbon{grid-template-columns:auto auto;justify-content:space-between;gap:8px;padding-right:7px}
  .brand{white-space:nowrap}
  .brand-logo{height:34px}
  .nav-cta{min-height:46px;padding:0 14px;gap:8px}
  .nav-cta span{font-size:14px}

  /* Event title remains expressive but no longer clips against the viewport edges. */
  .display-title{font-size:17.2vw;line-height:.91;letter-spacing:-.065em;max-width:100%}
  .event-intro>p{margin-top:34px;font-size:13px;line-height:1.9}
  .fact.large{min-height:225px}
  .fact.large strong{font-size:20.5vw}
  .fact .venue-name{font-size:23px;line-height:1.65}

  /* Long Japanese session content needs breathing room on 390px. */
  .sessions{padding-left:20px;padding-right:20px}
  .session-grid{gap:54px}
  .session{padding-top:18px}
  .session-top{gap:12px;align-items:flex-start}
  .session-index strong{font-size:31px}
  .session h3{font-size:25px;line-height:1.55;overflow-wrap:anywhere}
  .session h3 span{font-size:.68em;line-height:1.75;display:inline-block;margin-top:4px}
  .session-desc{font-size:12.5px;line-height:1.95;margin-top:22px}
  .topic-block{padding:22px 20px;margin-top:28px}
  .topic-block p{font-size:17px;line-height:1.65}
  .session-meta div{grid-template-columns:82px minmax(0,1fr);gap:12px;min-height:96px;padding:20px 0}
  .session-meta dd{font-size:13px;overflow-wrap:anywhere}

  /* EmployeeWorks flow: trim dead space while keeping the center circle prominent. */
  .flow-stage{margin-top:56px}
  .flow-center{width:min(78vw,310px);margin:22px auto 26px}
  .source-node,.result-node{padding:20px}
  .employee-proof{margin-top:56px}

  /* Decorative SVG should support content, not compete with it on a narrow screen. */
  .ambient-flow{width:154vw;right:-61vw;height:108vh}
  .flow-canvas{opacity:.78}
  .orbit-a{opacity:.22}.orbit-b{opacity:.2}
}

@media (max-width: 420px){
  .ribbon{width:calc(100% - 12px);left:50%}
  .brand{font-size:12px;gap:7px}
  .brand-logo{height:28px}
  .nav-cta{font-size:12px;padding:0 13px}
  .hero-title{font-size:clamp(40px,11.25vw,46px)}
  .button{font-size:12px}
  .final-inner h2{font-size:14.2vw}
}


/* Typography QA v2: preserve Japanese phrase boundaries and avoid emoji arrows. */
body{
  line-break:strict;
  word-break:normal;
  overflow-wrap:normal;
}
p, li, dd, dt, h1, h2, h3, h4, a, .venue-name{
  line-break:strict;
  overflow-wrap:normal;
  text-wrap:pretty;
}
/* Chrome/Android can use phrase-aware Japanese wrapping; unsupported browsers ignore it. */
p, li, dd, .session-desc, .practice-copy, .section-sidecopy, .event-intro>p{
  word-break:auto-phrase;
}
.controlled-break{
  word-break:auto-phrase;
  overflow-wrap:normal;
}
.controlled-break wbr{display:inline}
.session h3 .subline{font-size:.72em;line-height:1.7}
/* .session h3 span{font-size:.7em} would otherwise compound again on a nested
   .phrase-lock, shrinking it a second time relative to its already-shrunk parent. */
.session h3 .phrase-lock{font-size:1em}

/* CSS-drawn north-east arrow: uses currentColor, so it stays white on orange/black CTAs
   and dark on text links without invoking the mobile emoji font. */
.arrow-icon{
  position:relative;
  display:inline-block;
  flex:0 0 auto;
  width:14px;
  height:14px;
  font-size:0!important;
  line-height:0;
}
.arrow-icon::before{
  content:"";
  position:absolute;
  left:2px;
  bottom:2px;
  width:9px;
  height:1.6px;
  border-radius:2px;
  background:currentColor;
  transform:rotate(-45deg);
  transform-origin:center;
}
.arrow-icon::after{
  content:"";
  position:absolute;
  right:1px;
  top:1px;
  width:6px;
  height:6px;
  border-top:1.6px solid currentColor;
  border-right:1.6px solid currentColor;
}

@media(max-width:760px){
  /* Event facts must never remain opacity:0 on real mobile browsers if GSAP trigger timing differs. */
  .event-facts .fact{opacity:1!important;transform:none!important;visibility:visible!important}
  .fact.large:first-child{display:block!important;min-height:225px}
  .fact.large:first-child p{display:block!important}
  .fact.large:first-child strong,.fact.large:first-child em{visibility:visible!important;opacity:1!important}
  .arrow-icon{width:13px;height:13px}
  /* Do not let generic emergency wrapping split Japanese headings in arbitrary places. */
  .session h3{overflow-wrap:normal;word-break:normal}
  .session-meta dd{overflow-wrap:normal;word-break:auto-phrase}
}
html{overflow-x:clip}

/* =========================================================
   v3 continuity + CTA arrow + hero phrase lock
   ========================================================= */

/* Hero and Event Overview share one continuous visual field.
   The old hero-only glow was clipped by .hero overflow and produced a visible
   horizontal seam. The glow now lives on the story-level background instead. */
.hero::after{display:none!important}
.flow-background::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(ellipse 58% 25% at 72% 30%, rgba(255,90,22,.105) 0%, rgba(255,90,22,.045) 42%, rgba(255,90,22,0) 76%),
    radial-gradient(ellipse 55% 23% at 60% 58%, rgba(255,90,22,.07) 0%, rgba(255,90,22,.025) 46%, rgba(255,90,22,0) 78%);
}
.flow-canvas{z-index:1}
.flow-wash{z-index:2}

/* Keep the important Japanese phrase intact at every width. */
.hero-title .accent-line>span{white-space:nowrap}
.no-break{white-space:nowrap!important;word-break:keep-all!important;overflow-wrap:normal!important}

/* SVG arrow: predictable baseline/alignment on every OS; never becomes emoji. */
.arrow-icon{
  display:block;
  flex:0 0 auto;
  width:15px;
  height:15px;
  margin:0;
  overflow:visible;
  color:currentColor;
}
.arrow-icon path{
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
}
.arrow-icon::before,.arrow-icon::after{content:none!important;display:none!important}
.nav-cta,.button{align-items:center}
.nav-cta .arrow-icon,.button .arrow-icon{transform:translateY(0)}

/* Make the shared flow field explicitly continuous through Hero -> Event. */
.flow-story{background:#fcfcf9}
.hero,.event{background:transparent!important}

@media(max-width:760px){
  /* Same story, lighter density on mobile, not a separate background. */
  .flow-background::before{
    background:
      radial-gradient(ellipse 90% 20% at 72% 27%, rgba(255,90,22,.085) 0%, rgba(255,90,22,.03) 45%, rgba(255,90,22,0) 80%),
      radial-gradient(ellipse 95% 20% at 62% 55%, rgba(255,90,22,.055) 0%, rgba(255,90,22,.018) 48%, rgba(255,90,22,0) 82%);
  }
  .hero-title .accent-line>span{white-space:normal}
  .hero-search-phrase,.no-break{white-space:nowrap!important}
  .mobile-title-break{display:block!important}
  .arrow-icon{width:14px;height:14px}
}

/* v3.1: true cross-section sticky background.
   A sticky child cannot stick when nested inside an absolutely positioned wrapper
   the way the previous implementation was structured. Make the background itself
   the sticky story layer and cancel its layout height with a negative margin. */
.flow-background{
  position:sticky!important;
  top:0;
  inset:auto!important;
  width:100%;
  height:100vh;
  margin-bottom:-100vh;
  z-index:2;
  overflow:hidden;
  pointer-events:none;
}
.flow-canvas{
  position:absolute!important;
  inset:0;
  top:0!important;
  width:100%;
  height:100%;
  overflow:hidden;
}
/* Keep the transition genuinely seamless: no hero-only or section-only color block. */
.flow-background::before{display:none!important}
/* Correct sticky inset order: shorthand `inset:auto` previously reset top:0. */
.flow-background{inset:auto!important;top:0!important}

/* v3.2 final continuity model:
   one absolute SVG field spans the entire Hero + Event + Practice story.
   The SVG stretches vertically with the story, so there is no viewport-sized
   canvas edge that can coincide with a section boundary. */
.flow-background{
  position:absolute!important;
  inset:0!important;
  top:0!important;
  width:100%;
  height:100%;
  margin:0!important;
  z-index:2;
  overflow:hidden;
  pointer-events:none;
}
.flow-canvas{
  position:absolute!important;
  inset:0!important;
  width:100%;
  height:100%!important;
  overflow:hidden;
}
.ambient-flow{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  right:auto!important;
}

/* =========================================================
   v4 editorial / Japanese line-break / compact session QA
   ========================================================= */

/* Hero upper band: title/date on the left, PLATINUM SPONSOR + ServiceNow
   partner badge as a status pair riding the right side of the same row. */
.hero-top-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  max-width:min(970px,72vw);
  gap:24px;
  margin:0 0 36px;
  position:relative;
  z-index:3;
}
.hero-badges{
  display:flex;
  align-items:center;
  gap:clamp(20px,2vw,32px);
  flex:none;
}
.sponsor-label{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.2em;
  margin:0;
  width:clamp(115px,10.8vw,156px);
  height:clamp(115px,10.8vw,156px);
  padding:0 .9em;
  background:#0b2a3e;
  border-radius:18px;
  font:700 clamp(11px,.98vw,14px)/1.35 'DM Sans',sans-serif;
  letter-spacing:.06em;
  text-transform:uppercase;
  white-space:nowrap;
}
.sponsor-label span:first-child{color:#5FD93B}
.sponsor-label span:last-child{color:#fff}

/* Container owns size/aspect ratio so the placeholder image can be swapped for
   the final ServiceNow badge with no layout changes — only this block, and the
   img src attribute, need touching. */
.partner-badge{
  height:clamp(115px,10.8vw,156px);
  aspect-ratio:1/1;
  flex:none;
}
.partner-badge__image{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:0;
}
.hero-copy>.eyebrow{margin-bottom:24px}

.event-label-stack{
  position:relative;
  z-index:4;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  margin:0;
}
.event-label-stack .section-number{
  position:static;
  left:auto;
  top:auto;
  margin:0;
}
.event-label-stack .section-kicker{
  margin:0;
  font-size:14px;
}
.event-grid{margin-top:46px}

/* 01's number-then-label vertical stack, applied to sections whose kicker currently lives
   deep inside an offset grid/column (sessions/employee/booth/venue-map). Positioning it the
   same way .section-number already is (absolute, anchored to the section itself) means it
   aligns under the number regardless of whatever ancestor margin/grid-column wraps it in the
   markup — the number's own position is untouched. */
.section-label{
  position:absolute;
  left:var(--pad);
  top:112px; /* matches .section-number's default top:90px + its 12px line-height + a 10px gap */
  margin:0;
  font-size:14px;
  z-index:5;
}
@media (min-width:1001px){
  /* Sessions sits its number at top:72px on desktop (see .sessions>.section-number), not 90px. */
  #sessions .section-label{ top:94px; }
}
@media (max-width:760px){
  /* Matches the universal mobile .section-number{top:54px} override, and 01's own
     mobile gap (.event-label-stack{gap:8px} at this breakpoint), for exact parity. */
  .section-label{ top:74px; }
}

/* Explicit Japanese phrase locks for terms that must not split mid-word / mid-bunsetsu. */
.phrase-lock{
  display:inline-block;
  white-space:nowrap!important;
  word-break:keep-all!important;
  overflow-wrap:normal!important;
}

/* Desktop sessions: preserve type sizes, reduce vertical whitespace so both talks
   can be read as two compact parallel panels within one viewport. */
@media (min-width:1001px){
  .sessions{padding-top:96px;padding-bottom:104px}
  .sessions>.section-number{top:72px}
  .section-head{margin-left:14%;gap:40px}
  .session-grid{margin:44px 0 0 14%;gap:clamp(26px,3.2vw,52px);align-items:start}
  .session{padding-top:16px}
  .session-02{margin-top:0}
  .session-top{margin-bottom:20px}
  .session h3{line-height:1.38}
  .session h3 span{line-height:1.55}
  .session-desc{min-height:126px;margin-top:16px;line-height:1.75}
  .topic-block{min-height:0;margin-top:18px;padding:16px 20px}
  .topic-block p{margin-top:10px;line-height:1.45}
  .session-meta div{min-height:74px;padding:12px 0;grid-template-columns:108px 1fr}
  .session-meta dd{line-height:1.38}
  .session-meta small{margin-top:4px}
}

/* Tablet retains stacked sessions from earlier QA, but avoid inflated legacy min-heights. */
@media (max-width:1000px) and (min-width:761px){
  .event-label-stack{margin-left:0}
  .session-desc{min-height:auto}

  /* Hero: on a tall tablet viewport (e.g. iPad portrait) min-height:100svh +
     justify-content:space-between stretches the gap above/below hero-copy to
     fill the screen. Let the hero size to its content instead, so the top
     row/copy/CTA/meta keep a natural, consistent rhythm regardless of
     viewport height. Desktop (>1000px) is untouched. */
  .hero{justify-content:flex-start}
}

@media (max-width:760px){
  .hero-top-row{flex-direction:column;align-items:flex-start;max-width:100%;gap:16px;margin-bottom:28px}
  .hero-badges{gap:16px}
  .sponsor-label,.partner-badge{height:clamp(78px,20vw,100px)}
  .sponsor-label{width:clamp(96px,26vw,120px);padding:0 .8em;font-size:clamp(13px,3.4vw,15px)}
  .event-label-stack{gap:8px;margin:0 0 0 0}
  .event-grid{margin-top:28px}

  /* Address/access are supporting metadata, not full-height feature panels. */
  .fact.small{
    min-height:0!important;
    padding:16px 0!important;
  }
  .fact.small p{margin:10px 0 0;line-height:1.65}
  .fact.small + .fact.small{padding-top:14px!important}

  /* Avoid extra height in mobile session blocks while keeping current font sizes. */
  .session-desc{margin-top:18px;line-height:1.85}
  .topic-block{margin-top:22px;padding-top:18px;padding-bottom:18px}
  .session-meta div{min-height:82px;padding:16px 0}
}

/* =========================================================
   v5 event-first story: World Forum -> WHY SYSLABO -> Sessions
   ========================================================= */

/* The event chapter now explains WHY to attend before practical logistics. */
.event{
  padding-top:140px;
  padding-bottom:130px;
  min-height:auto;
}
.event-opening{
  position:relative;
  z-index:4;
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(420px,1fr);
  gap:clamp(70px,9vw,150px);
  align-items:start;
  margin-top:52px;
}
.event-intro{padding-top:8px}
.event-intro>p{max-width:520px}
.event-theme{
  position:relative;
  padding:30px 0 34px 34px;
  border-top:1px solid var(--ink);
  border-bottom:1px solid var(--line);
}
.event-theme::before{
  content:"";
  position:absolute;
  left:0;
  top:30px;
  bottom:34px;
  width:4px;
  background:linear-gradient(var(--orange) 0 56%,var(--green) 56% 100%);
}
.event-theme-label,.event-facts-heading{
  margin:0;
  font:700 12px/1 'DM Sans',sans-serif;
  letter-spacing:.14em;
  color:#89887f;
}
.event-theme blockquote{
  margin:26px 0 28px;
  font-size:clamp(43px,4.7vw,74px);
  line-height:1.03;
  letter-spacing:-.06em;
  font-weight:800;
}
.event-theme blockquote span{color:var(--orange)}
.event-theme>p:not(.event-theme-label){
  max-width:610px;
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:2;
}
.event-source-link{
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-top:24px;
  padding-bottom:4px;
  border-bottom:1px solid #aaa99f;
  font-size:12px;
  font-weight:700;
  transition:transform .25s;
}
.event-source-link:hover{transform:translateY(-2px)}
.event-reasons{
  position:relative;
  z-index:4;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:104px;
  border-top:1px solid var(--ink);
  border-bottom:1px solid var(--ink);
}
.event-reason{
  min-height:390px;
  padding:24px clamp(24px,3vw,48px) 34px 0;
}
.event-reason+.event-reason{
  padding-left:clamp(24px,3vw,48px);
  border-left:1px solid var(--line);
}
.reason-top{display:flex;justify-content:space-between;align-items:center}
.reason-top span{
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border-radius:50%;
  border:1px solid #bebdb4;
  font:600 12px/1 'DM Sans',sans-serif;
}
.reason-top em{
  font:700 12px/1 'DM Sans',sans-serif;
  font-style:normal;
  letter-spacing:.14em;
  color:var(--green);
}
.event-reason:nth-child(2) .reason-top em{color:var(--orange)}
.event-reason h3{
  margin:74px 0 22px;
  font-size:clamp(32px,3vw,48px);
  line-height:1.12;
  letter-spacing:-.055em;
}
.event-reason p{
  max-width:370px;
  margin:0;
  color:var(--muted);
  font-size:12.5px;
  line-height:1.95;
}
.event-pulse{
  position:relative;
  z-index:4;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:70px;
  padding:28px 0;
  border-bottom:1px solid var(--line);
}
.event-pulse>div{min-height:96px;padding:0 22px;border-left:1px solid var(--line)}
.event-pulse>div:first-child{padding-left:0;border-left:0}
.event-pulse strong{
  display:block;
  font:700 clamp(28px,3.1vw,48px)/1 'DM Sans',sans-serif;
  letter-spacing:-.065em;
}
.event-pulse strong span{color:var(--orange)}
.event-pulse small{
  display:block;
  margin-top:14px;
  color:#74736c;
  font:600 12px/1.55 'DM Sans','Noto Sans JP',sans-serif;
  letter-spacing:.04em;
}
.event-facts-wrap{
  position:relative;
  z-index:4;
  display:grid;
  grid-template-columns:minmax(130px,.3fr) minmax(0,1fr);
  gap:clamp(40px,6vw,90px);
  align-items:start;
  margin-top:105px;
}
.event-facts-heading{padding-top:8px;color:var(--orange)}
.event-facts{margin:0}
.visit-map{grid-column:1/-1;margin-top:34px}
.visit-map-frame{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:#fff}
.visit-map-frame iframe{display:block;width:100%;height:440px;border:0}
.event-to-syslabo{
  position:relative;
  z-index:4;
  display:grid;
  grid-template-columns:auto minmax(320px,720px) 1fr auto;
  gap:24px;
  align-items:center;
  margin-top:100px;
  padding:30px 0 0;
  border-top:1px solid var(--ink);
}
.event-to-syslabo>span{
  font:700 12px/1 'DM Sans',sans-serif;
  letter-spacing:.12em;
  white-space:nowrap;
}
.event-to-syslabo>span:last-child{color:var(--orange)}
.event-to-syslabo p{
  margin:0;
  font-size:clamp(17px,1.55vw,23px);
  line-height:1.8;
  letter-spacing:-.025em;
}
.event-to-syslabo i{height:1px;background:linear-gradient(90deg,var(--orange),var(--green));transform-origin:left}

/* Formalize the black chapter as 02 / WHY SYSLABO. */
.practice{min-height:145vh}
.practice-number{
  position:absolute;
  top:78px;
  left:var(--pad);
  z-index:6;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  color:#8e8d87;
}
.practice-number span{font:600 12px/1 'DM Sans',sans-serif;letter-spacing:.08em}
.practice-number em{font:700 14px/1 'DM Sans',sans-serif;font-style:normal;letter-spacing:.14em;color:#ffb08d}
.practice-sticky{max-width:790px;padding-top:150px}
.practice-title{margin-top:14px;line-height:1.12}
.practice-lead{
  margin:30px 0 0;
  color:#f1f0e9;
  font-size:clamp(17px,1.6vw,23px);
  line-height:1.7;
  letter-spacing:-.02em;
}
.practice-lead strong{color:#45D66F;font-weight:700}
.practice-copy{margin-top:20px;max-width:690px}
.practice-proof{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  width:min(650px,90%);
  margin-top:34px;
  padding-top:20px;
  border-top:1px solid rgba(255,255,255,.22);
}
.practice-proof>div{padding-right:20px}
.practice-proof>div+div{padding-left:20px;border-left:1px solid rgba(255,255,255,.14)}
.practice-proof small{
  display:block;
  color:#88877f;
  font:700 12px/1 'DM Sans',sans-serif;
  letter-spacing:.12em;
}
.practice-proof strong{
  display:block;
  margin-top:10px;
  color:#fff;
  font:650 14px/1.25 'DM Sans',sans-serif;
  letter-spacing:-.02em;
}

/* The fifth navigation item still fits at desktop; tighten before the tablet-scroller breakpoint. */
@media (max-width:1180px) and (min-width:1001px){
  .ribbon-links a{padding-left:9px;padding-right:9px;font-size:15px}
}

@media (max-width:1000px){
  .event-opening{grid-template-columns:1fr;gap:54px}
  .event-theme{max-width:650px;margin-left:10%}
  .event-reasons{grid-template-columns:1fr;margin-left:10%}
  .event-reason,.event-reason+.event-reason{
    display:grid;
    grid-template-columns:90px minmax(190px,.75fr) minmax(0,1fr);
    gap:28px;
    align-items:start;
    min-height:0;
    padding:28px 0;
    border-left:0;
    border-top:1px solid var(--line);
  }
  .event-reason:first-child{border-top:0}
  .reason-top{justify-content:flex-start;gap:14px;padding-top:3px}
  .reason-top em{writing-mode:vertical-rl}
  .event-reason h3{margin:0;font-size:34px}
  .event-reason p{margin:0;max-width:none}
  .event-pulse{grid-template-columns:1fr 1fr;margin-left:10%}
  .event-pulse>div:nth-child(3){border-left:0;border-top:1px solid var(--line);padding-top:24px}
  .event-pulse>div:nth-child(4){border-top:1px solid var(--line);padding-top:24px}
  .event-facts-wrap{grid-template-columns:1fr;margin-left:10%}
  .visit-map-frame iframe{height:380px}
  .event-to-syslabo{grid-template-columns:auto 1fr auto;margin-left:10%}
  .event-to-syslabo i{display:none}
  .event-to-syslabo p{grid-column:1/-1;grid-row:2}
  .practice-sticky{max-width:660px}
}

@media(max-width:760px){
  .event{padding-top:102px;padding-bottom:100px}
  .event-opening{margin-top:30px;gap:46px}
  .event-intro>p{max-width:94%}
  .event-theme{margin-left:0;padding:24px 0 28px 22px}
  .event-theme::before{top:24px;bottom:28px;width:3px}
  .event-theme blockquote{font-size:12.4vw;margin-top:22px}
  .event-theme>p:not(.event-theme-label){font-size:12px;line-height:1.9}
  .event-source-link{font-size:12px}
  .event-reasons{margin:62px 0 0;display:block}
  .event-reason,.event-reason+.event-reason{
    display:block;
    padding:25px 0 30px;
    border-top:1px solid var(--line);
  }
  .event-reason:first-child{border-top:0}
  .reason-top{justify-content:space-between}
  .reason-top em{writing-mode:horizontal-tb}
  .event-reason h3{margin:38px 0 16px;font-size:9.6vw;line-height:1.13}
  .event-reason p{font-size:12px;line-height:1.9;max-width:95%}
  .event-pulse{margin:38px 0 0;grid-template-columns:1fr 1fr;padding:0}
  .event-pulse>div{min-height:118px;padding:20px 14px;border-top:1px solid var(--line)}
  .event-pulse>div:nth-child(odd){padding-left:0;border-left:0}
  .event-pulse>div:nth-child(even){padding-right:0}
  .event-pulse>div:first-child,.event-pulse>div:nth-child(2){border-top:0}
  .event-pulse strong{font-size:9vw}
  .event-pulse small{font-size:12px;line-height:1.5}
  .event-facts-wrap{margin:72px 0 0;gap:24px}
  .event-facts-heading{font-size:12px}
  .visit-map{margin-top:24px}
  .visit-map-frame{border-radius:16px}
  .visit-map-frame iframe{height:320px}
  .event-to-syslabo{margin:68px 0 0;grid-template-columns:1fr auto;gap:14px;padding-top:24px}
  .event-to-syslabo>span{font-size:12px}
  .event-to-syslabo p{grid-column:1/-1;grid-row:auto;font-size:16px;line-height:1.85}

  .practice{min-height:128svh;padding-left:20px;padding-right:20px}
  .practice-number{top:74px;left:20px}
  .practice-sticky{justify-content:safe center;padding:128px 0 42px;height:100svh}
  .practice-title{font-size:12.2vw}
  .practice-lead{font-size:15px;line-height:1.7;margin-top:24px}
  .practice-copy{max-width:94%;font-size:12px;line-height:1.85;margin-top:16px}
  .practice-proof{width:100%;margin-top:24px;padding-top:16px}
  .practice-proof>div{padding-right:10px}
  .practice-proof>div+div{padding-left:10px}
  .practice-proof strong{font-size:12px;line-height:1.3}
  .practice-visual{opacity:.68;right:-49vw;top:3vh;width:108vw}
  .giant-bg{opacity:.72}
}

@media(max-width:420px){
  .event-theme blockquote{font-size:12vw}
  .event-pulse strong{font-size:8.7vw}
  .practice-title{font-size:11.5vw}
  .practice-lead{font-size:14px}
  .practice-copy{font-size:12px}
}

/* Tablet ribbon: five text links become cramped at 768px, so keep only brand + primary CTA. */
@media (max-width:850px) and (min-width:761px){
  .ribbon-links{display:none}
  .ribbon{grid-template-columns:auto 1fr auto}
  .nav-cta{grid-column:3}
}

/* Venue map: full-width reference image beneath the booth section, before the closing CTA. */
.venue-map{padding:150px var(--pad) 130px;background:#fafaf6}
.venue-map-head{margin-left:16%}
.venue-map-head .section-title{margin-top:16px}
.venue-map-image{margin:56px 16% 0;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:#fff}
.venue-map-image img{display:block;width:100%;height:auto}

@media (max-width:1000px){
  .venue-map-head{margin-left:10%}
  .venue-map-image{margin-left:10%;margin-right:10%}
}

@media (max-width:760px){
  .venue-map{padding:110px 20px 80px}
  .venue-map-head{margin-left:0}
  .venue-map-head .section-title{font-size:12vw}
  .venue-map-image{margin:36px 0 0;border-radius:16px}
}

/* =========================================================
   v6 Desktop-only Hero compaction: fit nav + top row + copy + CTA
   inside the first viewport without touching Tablet/Mobile, which
   keep their own natural stacked rhythm and may scroll to reach CTA.
   ========================================================= */
@media (min-width:1001px){
  .hero{justify-content:flex-start;padding-top:calc(var(--nav-h) + 48px)}

  .hero-top-row{margin-bottom:24px}
  .hero-badges{gap:20px;margin-right:150px}
  .hero-topline p{font-size:calc(clamp(22px,2vw,30px) + 2px)}
  .topline-break-desktop{display:block}
  .topline-line1{white-space:nowrap}
  .sponsor-label,.partner-badge{width:clamp(128px,11.3vw,166px);height:clamp(128px,11.3vw,166px)}
  .sponsor-label{border-radius:18px;font-size:clamp(16px,1.3vw,18px)}

  .hero-copy{margin-top:16px}
  .hero-copy>.eyebrow{margin-bottom:14px}
  .hero-title{font-size:clamp(48px,6.6vw,100px);line-height:.92}
  .hero-lead{margin-top:20px}
  .hero-actions{margin-top:22px}
}
