/* KAIRO's identity: precise geometry, warm paper, deliberate space. */
:root{--copper:#a54a33}a.identity-lockup{display:block;line-height:1;letter-spacing:0}.identity-lockup img{width:153px;height:auto;max-height:38px}.identity-lockup .brand-sub{font-size:5.5px;letter-spacing:1.65px;margin:6px 0 0 39px}.footer-top .footer-logo img{width:330px;height:auto}.hero h1{letter-spacing:-.075em}.hero-line .serif{color:#707b57}.hero-side .button{background:var(--ink)}.hero-side .button:hover{background:var(--copper)}
.atelier-stage{--stage-bg:#cfd6c4;--stage-ink:#273b2d;background:var(--stage-bg);color:var(--stage-ink);height:590px;overflow:hidden;border-radius:0;transition:background .65s,color .65s}.atelier-stage[data-direction=ma]{--stage-bg:#d8c2a2;--stage-ink:#35271c}.atelier-stage[data-direction=colbo]{--stage-bg:#ded2c7;--stage-ink:#57392b}.stage-grid{position:absolute;inset:0;background-image:linear-gradient(#4a523715 1px,transparent 1px),linear-gradient(90deg,#4a523715 1px,transparent 1px);background-size:65px 65px;mask-image:linear-gradient(90deg,black,transparent 75%)}.atelier-top{position:absolute;top:24px;left:28px;right:28px;display:flex;justify-content:space-between;font-size:7px;letter-spacing:1.1px}.direction-copy{position:absolute;left:4%;top:90px;width:28%;z-index:2}.direction-index{display:block;font-size:9px;letter-spacing:1.7px;margin-bottom:30px}.direction-copy h2{font-size:64px;line-height:1.05;letter-spacing:-4px;min-height:136px}.direction-copy p{font-size:12px;line-height:1.8;margin-top:22px;max-width:205px}.direction-discipline{display:block;font-size:6px;letter-spacing:1px;margin-top:26px}.direction-mark{font-size:65px;line-height:1;margin-top:10px;display:block}.studio-window{position:absolute;width:calc(66% - 28px);right:28px;top:86px;bottom:95px;padding:0;background:#f5f4ee;box-shadow:0 35px 45px -24px #1b221a66;text-align:left;transform:none;translate:none}.studio-window:hover{transform:none}.studio-window-chrome{height:25px;display:flex;justify-content:space-between;align-items:center;padding:0 13px;background:#f5f4ee;color:#64675c;font-size:5.5px;letter-spacing:.5px}.studio-window-chrome>span:first-child{color:#c7c8be;font-size:5px}.studio-window>img{display:block;width:100%;height:calc(100% - 25px);object-fit:cover;object-position:top}.window-play{position:absolute;right:23px;bottom:22px;display:flex;gap:35px;align-items:center;padding:14px 18px;background:#20221f;color:#f5f4ee;font-size:9px;box-shadow:0 5px 15px #0002}.window-play>span{font-size:15px}.direction-switcher{position:absolute;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid #54614340;background:var(--stage-bg);z-index:3}.direction-switcher button{padding:22px 26px;display:flex;gap:12px;align-items:center;background:transparent;text-align:left;font-family:Manrope,Arial,sans-serif;font-size:11px;letter-spacing:-.3px;border-right:1px solid #54614330;transition:background .3s}.direction-switcher button>span:first-child{font:9px DM,Arial,sans-serif;opacity:.5}.direction-switcher button>span:last-child{margin-left:auto;font:6px DM,Arial,sans-serif;letter-spacing:.8px;opacity:.6}.direction-switcher button[aria-pressed=true]{background:var(--stage-ink);color:var(--paper)}.direction-switcher button:hover:not([aria-pressed=true]){background:#fff3}.atelier-stage.is-changing .studio-window{animation:direction-arrive .6s cubic-bezier(.16,1,.3,1)}@keyframes direction-arrive{from{opacity:.4}to{opacity:1}}
.plan-baseline{display:flex;align-items:center;gap:22px;border-top:1px solid var(--line);padding:24px 0 30px;max-width:950px}.baseline-mark{width:39px;height:39px;display:grid;place-items:center;border:1px solid var(--line);font-size:23px;flex-shrink:0}.plan-baseline p{font-size:12px;line-height:1.8;color:var(--muted)}.plan-baseline strong{display:block;color:var(--ink);font-weight:500}.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.plan-card{padding:28px 28px 22px;border:1px solid var(--line);background:#f0f0e8;transition:background .35s,border-color .35s;min-width:0;position:relative}.plan-card.selected{background:#e3e8d7;border-color:#8b9873}.plan-top{display:flex;align-items:center;justify-content:space-between;font-size:7px;letter-spacing:1px}.plan-symbol{font-size:22px}.plan-card h3{font-size:31px;letter-spacing:-1.5px;margin-top:30px}.plan-use{font-size:11px;line-height:1.8;margin-top:9px;min-height:40px;color:#6b705f}.plan-price{font-family:Manrope,Arial,sans-serif;font-size:54px;letter-spacing:-3px;margin-top:25px;line-height:1.2;white-space:nowrap}.plan-price>span{font:10px DM,Arial,sans-serif;letter-spacing:0}.plan-price>small{font:9px DM,Arial,sans-serif;letter-spacing:.6px}.plan-card ul{list-style:none;margin:28px 0 0;padding:0;border-top:1px solid #b7bfaa77}.plan-card li{padding:15px 0;border-bottom:1px solid #b7bfaa77;min-height:61px}.plan-card li>strong{display:block;font-size:11px;font-weight:500}.plan-card li>span{display:block;font-size:9px;line-height:1.6;margin-top:4px;color:#737966}.plan-time{font-size:7px;letter-spacing:.8px;margin:24px 0 19px}.plan-compare{width:100%;display:flex;align-items:center;justify-content:space-between;padding:12px 0;font-size:10px;border-top:1px solid #b7bfaa77;background:transparent}.plan-compare span{font-size:18px;font-weight:400}.plan-compare[aria-pressed=true] span{transform:rotate(45deg)}.plan-choose{display:flex;justify-content:space-between;align-items:center;margin-top:7px;padding:16px 17px;background:var(--ink);color:var(--paper);font-size:10px}.plan-choose:hover{background:var(--copper)}.plan-difference{display:grid;grid-template-columns:140px 1fr auto;gap:35px;align-items:center;padding:32px 0 35px;border-bottom:1px solid var(--line)}.difference-number{font-family:var(--serif);font-size:45px;letter-spacing:-2px;color:var(--copper)}.plan-difference .eyebrow{font-size:7px;color:var(--muted)}.plan-difference h3{font-size:22px;letter-spacing:-.8px;margin:8px 0 10px}.plan-difference p:not(.eyebrow){font-size:11px;line-height:1.9;color:var(--muted);max-width:650px}.plan-difference>a{white-space:nowrap;border-bottom:1px solid currentColor;font-size:10px;padding-bottom:5px}.scope-comparison{margin-top:12px;border-bottom:1px solid var(--line)}.scope-comparison summary{padding:22px 0;display:flex;justify-content:space-between;align-items:center;cursor:pointer;list-style:none;font-size:12px}.scope-comparison summary::-webkit-details-marker{display:none}.scope-comparison summary>span{font-size:20px}.scope-comparison[open] summary>span{transform:rotate(45deg)}.comparison-scroll{overflow-x:auto}.scope-comparison table{border-collapse:collapse;width:100%;text-align:left;font-size:10px;min-width:660px;margin-bottom:25px}.scope-comparison caption{text-align:left;font-size:9px;color:var(--muted);padding:10px 0 20px}.scope-comparison th,.scope-comparison td{padding:15px 17px;border-top:1px solid var(--line);font-weight:400;line-height:1.6}.scope-comparison th{color:var(--ink)}.scope-comparison td{color:var(--muted)}.scope-comparison thead{background:#e8ecdd}.scope-comparison th:first-child{padding-left:0;width:25%}.scope-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:28px}.scope-notes .eyebrow{font-size:7px;color:#5b654a}.scope-notes p{font-size:10px;line-height:1.9;color:var(--muted);margin-top:10px}.footer-logo{display:block}.featured-case,.real-demo-art{border-radius:0}.project-dialog{border-radius:0}.section-heading h2{line-height:1.08}
@media(min-width:1500px){.atelier-stage{height:660px}.direction-copy h2{font-size:76px}.studio-window{top:90px;right:28px;width:calc(66% - 28px)}}
@media(max-width:1050px){.atelier-stage{height:515px}.direction-copy{top:80px}.direction-copy h2{font-size:48px;min-height:100px;letter-spacing:-3px}.direction-copy p{font-size:10px;max-width:160px}.direction-index{margin-bottom:25px}.direction-discipline{font-size:5px;line-height:1.9;max-width:130px}.direction-mark{font-size:55px}.studio-window{top:95px;bottom:86px;right:20px;width:calc(66% - 20px)}.direction-switcher button{padding:21px 18px;font-size:10px}.direction-switcher button>span:last-child{font-size:5px}.plan-card{padding:23px 20px 19px}.plan-price{font-size:43px;letter-spacing:-2.4px}.plan-card h3{font-size:29px}.plan-card li>strong{font-size:10px}.plan-card li>span{font-size:8px}.plan-difference{grid-template-columns:110px 1fr;gap:25px}.plan-difference>a{grid-column:2;justify-self:start;margin-top:-10px}.scope-notes{gap:25px}.footer-top .footer-logo img{width:290px}}
@media(max-width:700px){.identity-lockup img{width:135px}.identity-lockup .brand-sub{font-size:4.8px;letter-spacing:1.45px;margin-left:34px}.atelier-stage{height:480px;margin-left:-20px;margin-right:-20px}.atelier-top{left:20px;right:20px;top:20px;font-size:6px}.atelier-top>span:last-child{display:none}.direction-copy{left:20px;top:52px;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:0 15px}.direction-index{font-size:7px;grid-column:1/-1;margin-bottom:13px}.direction-copy h2{font-size:38px;line-height:1;min-height:0;letter-spacing:-2px}.direction-copy h2 br{display:none}.direction-copy h2 .serif{margin-left:5px}.direction-copy p{font-size:9px;margin:0 15px 0 0;line-height:1.7;max-width:180px;align-self:center}.direction-discipline,.direction-mark{display:none}.studio-window{left:20px;right:auto;width:calc(100% - 40px);top:167px;bottom:auto;transform:none;translate:none}.studio-window-chrome{height:20px;font-size:4.5px;padding:0 9px}.window-play{right:13px;bottom:13px;font-size:7px;padding:10px 12px;gap:20px}.window-play>span{font-size:12px}.direction-switcher button{padding:20px 12px;font-size:9px;gap:8px;justify-content:center}.direction-switcher button>span:first-child{font-size:6px}.direction-switcher button>span:last-child{display:none}.plan-baseline{padding:20px 0 25px;gap:15px;align-items:start}.plan-baseline p{font-size:10px}.baseline-mark{width:30px;height:30px;font-size:20px}.plans{grid-template-columns:1fr;gap:15px}.plan-card{padding:25px;display:grid;grid-template-columns:1fr auto;gap:0 15px}.plan-top{grid-column:1/-1;font-size:7px}.plan-card h3{margin-top:18px;grid-column:1;font-size:31px}.plan-use{grid-column:1;font-size:10px;min-height:0;max-width:170px}.plan-price{grid-column:2;grid-row:2/4;font-size:41px;align-self:center;margin-top:12px;letter-spacing:-2px}.plan-price>span{display:block;font-size:8px;margin-bottom:3px;letter-spacing:0}.plan-price>small{font-size:7px}.plan-card ul{grid-column:1/-1;margin-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:0 17px}.plan-card li{min-height:65px;padding:14px 0}.plan-card li>strong{font-size:10px}.plan-card li>span{font-size:9px;line-height:1.7;max-width:140px}.plan-time{grid-column:1/-1;font-size:6px;margin:22px 0 15px}.plan-compare{grid-column:1/-1;font-size:10px}.plan-choose{grid-column:1/-1;font-size:10px;padding:15px}.plan-difference{grid-template-columns:1fr;gap:16px;padding:27px 0}.difference-number{font-size:38px}.plan-difference h3{font-size:23px;line-height:1.3}.plan-difference p:not(.eyebrow){font-size:10px}.plan-difference>a{grid-column:1;margin-top:0;font-size:10px;justify-self:start}.scope-comparison summary{font-size:11px}.scope-notes{grid-template-columns:1fr;gap:22px}.scope-notes .eyebrow{font-size:7px}.scope-notes p{font-size:10px;line-height:1.8;max-width:100%}.footer-top .footer-logo img{width:250px}.footer-top .footer-logo{letter-spacing:0}.scope-comparison table{font-size:9px}.scope-comparison td,.scope-comparison th{padding:13px 12px}.section-heading h2{font-size:35px}}
@media(max-width:380px){.atelier-stage{height:455px}.direction-copy h2{font-size:33px}.direction-copy p{font-size:8px}.studio-window{top:160px}}
@media(prefers-reduced-motion:reduce){.atelier-stage.is-changing .studio-window{animation:none}.studio-window{translate:none;transform:none}.studio-window:hover{transform:none}}
@media(max-width:700px){.studio-window>img{height:auto;aspect-ratio:1348/926;max-height:none}}

/* The existing live KOI EAST storefront. */
.direction-switcher{grid-template-columns:repeat(2,minmax(0,1fr))}.direction-switcher button{padding-inline:19px;gap:9px}.direction-switcher button:last-child{border-right:0}.atelier-stage[data-direction=koi]{--stage-bg:#d9c6bf;--stage-ink:#532e29}.atelier-stage[data-direction=koi] .direction-copy h2 .serif{color:#963b32}.koi-case{align-items:start;grid-template-columns:1.6fr .8fr;margin:62px 0 0;gap:48px;padding-top:45px;border-top:1px solid var(--line)}.koi-case .featured-copy{padding-left:10px}.koi-case .featured-copy h3{font-size:45px;white-space:nowrap}.koi-case .featured-copy h3 .serif{color:var(--copper)}.koi-visual{background:#dfd0c7}.koi-visual .ma-browser{transform:none}.koi-visual:hover .ma-browser{transform:none}.koi-visual .featured-visual-label{justify-content:flex-start;align-items:center;gap:7px;color:#67483d}.live-project-dot{width:5px;height:5px;background:#944031;border-radius:50%;display:inline-block}.koi-case .ma-browser img{object-position:top;aspect-ratio:1348/542;object-fit:contain}
@media(max-width:1050px){.direction-switcher button{padding-inline:13px}.direction-switcher button>span:last-child{display:none}.koi-case{grid-template-columns:1.4fr .85fr;gap:28px}.koi-case .featured-copy{padding-left:0}.koi-case .featured-copy h3{font-size:37px}}
@media(max-width:700px){.atelier-stage{height:480px}.direction-switcher{grid-template-columns:repeat(2,minmax(0,1fr))}.direction-switcher button{padding:15px 13px;justify-content:flex-start;min-height:43px}.direction-switcher button:nth-child(2){border-right:0}.koi-case{grid-template-columns:1fr;gap:0;margin-top:37px;padding-top:35px}.koi-case .featured-copy{grid-row:1;padding:0 0 28px}.koi-case .featured-copy h3{font-size:42px}.koi-case .featured-visual{grid-row:2}.koi-case .ma-browser img{aspect-ratio:1348/542}}
@media(max-width:380px){.atelier-stage{height:455px}}

/* KOI uses a clean, complete hero capture at its natural viewport ratio. */
.atelier-stage[data-direction=koi] .studio-window{bottom:auto}
.atelier-stage[data-direction=koi] .studio-window>img{height:auto;aspect-ratio:1348/542;object-fit:contain}
.koi-visual .demo-play,.koi-visual:hover .demo-play{top:0;right:0;bottom:auto;height:38px;padding:0 17px;gap:7px;background:transparent;color:#67483d;transform:none;box-shadow:none}
.koi-visual .demo-play>span{width:20px;height:20px;font-size:12px;border-color:#67483d55;color:#67483d}
.atelier-stage[data-direction=koi] .window-play{position:static;justify-content:space-between;padding:12px 16px;box-shadow:none}
@media(max-width:700px){.koi-visual .demo-play,.koi-visual:hover .demo-play{height:34px;padding:0 12px}.atelier-stage[data-direction=koi] .window-play{padding:10px 12px}}
