/* KURO KOKORO — brand layer. Existing project layouts and media are retained. */
@font-face{font-family:'General Sans';src:url('/assets/kuro/GeneralSans.woff') format('woff');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'General Sans';src:url('/assets/kuro/GeneralSansMedium.woff') format('woff');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'General Sans';src:url('/assets/kuro/GeneralSansBold.woff') format('woff');font-weight:700;font-style:normal;font-display:swap}
:root{--red:#dd1a2a;--orange:var(--red);--ink:#232323;--muted:#696969;--body:clamp(16px,1.35vw,24px);--pad:3.2vw;--gap:1.6vw}
body{font-family:'General Sans',Arial,sans-serif;font-weight:400;line-height:1.45}::selection{background:var(--red);color:#fff}button,input{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid currentColor;outline-offset:5px}main:focus{outline:none}.eyebrow{font-size:clamp(11px,.95vw,16px);font-weight:500;line-height:1.5;letter-spacing:.055em;text-transform:uppercase}
.site-header{height:clamp(154px,14vw,250px);padding:var(--pad);align-items:flex-start}.logo{width:clamp(116px,12vw,200px);height:auto;aspect-ratio:980/440;color:var(--red);flex:none}.logo svg{width:100%;height:100%;overflow:visible}.header-links{gap:24px;margin:0;align-items:center;font-size:clamp(15px,1.25vw,21px)}.header-links a{padding:9px 0}.header-links a:hover,.header-links a[aria-current]{text-decoration:none;color:var(--red)}.header-links a[aria-current]{box-shadow:0 1px 0 currentColor}.icon-button{width:36px;height:42px}.icon-button svg,.close-button svg{width:23px;height:23px}.icon-button:hover{color:var(--red)}.home .site-header{height:clamp(330px,28vw,510px);display:flex;min-height:0}.header-intro{position:absolute;top:calc(var(--pad) - 6px);left:23.5vw;width:45vw;padding:0;letter-spacing:-.035em;font-size:clamp(31px,3.25vw,64px);line-height:1.14}.header-intro h1{font-weight:500;font-size:inherit;line-height:inherit}.header-intro .eyebrow{margin-top:27px;letter-spacing:.035em;color:var(--muted)}.header-label{position:absolute;left:var(--pad);bottom:44px;font-size:clamp(11px,.92vw,15px);color:var(--muted);line-height:1.65}.hero-down{position:absolute;right:var(--pad);bottom:35px;font-size:38px;line-height:1;color:var(--red);padding:8px}.hero-down:hover{transform:translateY(4px)}
.feed-grid{row-gap:6.5vw;scroll-margin-top:32px}.card-caption{grid-template-columns:64px 1fr;gap:16px;margin-top:19px;line-height:1.4}.feed-card[data-span="span5"] .card-caption{grid-template-columns:1fr 2fr}.card-type{font-size:12px;line-height:1.5;color:var(--muted);padding-top:3px}.card-title{font-weight:500;letter-spacing:-.015em}.card-description{font-size:.9em;margin-top:7px;color:var(--muted)}.card-media img{transition:transform .6s cubic-bezier(.2,.65,.3,1)}.feed-card a:hover .card-media img,.work-card a:hover .card-media img{transform:scale(1.025)}.feed-end{margin:6.5vw 0 0;text-align:left}.all-work-link{display:flex;justify-content:space-between;align-items:center;border-top:1px solid color-mix(in srgb,var(--ink) 20%,transparent);padding-top:23px;font-size:clamp(22px,2.5vw,45px);letter-spacing:-.035em}.all-work-link span{color:var(--red)}.all-work-link:hover{color:var(--red)}
.filters{font-size:clamp(13px,1.1vw,18px);gap:12px 20px}.filter[aria-current="page"]{color:var(--red)}.work-toolbar{margin-bottom:4vw}.view-button{width:38px;height:38px}.view-button svg{width:21px;height:21px}.view-button[aria-pressed="true"]{background:#f5eded;color:var(--red)}.work-card .card-title{margin-top:17px}.work-grid.compact .card-title{font-size:clamp(13px,1.1vw,19px)}.project-intro h1{font-size:clamp(26px,2.7vw,46px);font-weight:500;letter-spacing:-.03em;line-height:1.16;grid-column:1/span 4;max-width:90%}.project-intro .project-description{grid-column:6/span 3}.project-tags{flex-wrap:wrap;font-size:14px}.carousel-bar{font-size:14px}.carousel-controls button{min-height:44px;min-width:44px;font-size:27px}.module-text p.large{font-size:clamp(23px,2vw,34px)}.section-title{font-weight:500}.video-pause{width:38px;height:38px;opacity:1}.footer-cta:focus-visible{outline-offset:12px}
.site-footer{padding:9vw var(--pad) 28px}.footer-invitation{padding-bottom:6vw}.footer-invitation>.eyebrow{color:var(--muted)}.footer-cta{display:flex;justify-content:space-between;gap:30px;align-items:baseline;font-size:clamp(58px,10vw,190px);font-weight:500;line-height:1.15;letter-spacing:-.06em;color:var(--red);margin-top:20px}.footer-cta span{font-weight:400;font-size:.8em;transition:transform .25s}.footer-cta:hover span{transform:translate(7px,-7px)}.footer-bottom{display:grid;grid-template-columns:1fr 1fr auto;gap:var(--gap);border-top:1px solid color-mix(in srgb,var(--ink) 20%,transparent);padding-top:29px;font-size:clamp(14px,1.15vw,19px)}.footer-brand>a{font-weight:700;letter-spacing:.01em}.footer-brand p{color:var(--muted);margin-top:7px}.footer-contact{display:flex;flex-direction:column;gap:7px}.footer-contact a:hover,.socials a:hover{color:var(--red);text-decoration:none}.socials{display:flex;align-items:flex-start;gap:25px}.footer-legal{display:flex;justify-content:space-between;gap:20px;font-size:12px;color:var(--muted);margin-top:65px}.progress-top{font-size:inherit;margin:0}
.studio-intro{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));column-gap:var(--gap);row-gap:28px}.studio-intro>.eyebrow{grid-column:1/-1;color:var(--muted)}.studio-intro h1{grid-column:1/span 5;font-size:clamp(44px,5.65vw,108px);font-weight:500;line-height:1.03;letter-spacing:-.055em}.studio-description{grid-column:6/span 3;font-size:clamp(16px,1.35vw,24px);color:var(--muted);padding-top:5px}.studio-description p+p{margin-top:1.4em}.studio-mark{background:var(--red);color:#fff;padding:8vw;margin:7vw 0}.studio-mark svg{width:100%;height:auto}.studio-services{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}.studio-services h2{font-size:clamp(34px,4vw,72px);font-weight:500;letter-spacing:-.045em;line-height:1.1;margin-top:28px}.studio-services .eyebrow{color:var(--muted)}.services-list .service{display:grid;grid-template-columns:40px 1fr;gap:20px;padding:28px 0;border-top:1px solid color-mix(in srgb,var(--ink) 20%,transparent)}.service>span{font-size:12px;padding-top:7px;color:var(--red)}.service h3{font-size:clamp(23px,2.5vw,42px);font-weight:500;letter-spacing:-.025em;line-height:1.2}.service p{color:var(--muted);font-size:.9em;margin-top:10px}.studio-person{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);margin-top:8vw;border-top:1px solid #ddd;padding-top:28px}.studio-person h2{font-size:30px;font-weight:500;margin-bottom:20px}.studio-person h2 span{font-size:14px;color:var(--muted);margin-left:20px;font-weight:400}.studio-person .text-link{font-size:clamp(14px,1.35vw,23px)}
.contact-page{padding-top:0;padding-bottom:1.5vw}.contact-page>.eyebrow{color:var(--muted)}.contact-page h1{font-size:clamp(68px,12vw,210px);font-weight:500;line-height:1.04;letter-spacing:-.065em;margin:28px 0 7vw}.contact-page h1 span{color:var(--red)}.contact-grid{display:grid;grid-template-columns:3fr 5fr;gap:var(--gap);border-top:1px solid #ddd;padding-top:35px}.contact-intro{font-size:clamp(23px,2.4vw,44px);font-weight:500;letter-spacing:-.025em;line-height:1.2}.contact-details>.eyebrow{color:var(--muted);margin-bottom:24px}.contact-email{display:flex;gap:20px;justify-content:space-between;font-size:clamp(20px,2.5vw,44px);font-weight:500;letter-spacing:-.035em;line-height:1.3;color:var(--red);overflow-wrap:anywhere}
.contact-form{margin-top:58px;border-top:1px solid color-mix(in srgb,var(--ink) 20%,transparent);padding-top:30px}
.contact-form .form-heading{color:var(--muted);margin-bottom:26px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.field{display:block;margin-bottom:26px}
.field>span{display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:9px}
.field input,.field textarea{width:100%;font:inherit;font-size:clamp(16px,1.35vw,21px);color:var(--ink);background:none;border:0;border-bottom:1px solid color-mix(in srgb,var(--ink) 28%,transparent);padding:0 0 11px;border-radius:0;transition:border-color .2s}
.field textarea{resize:vertical;min-height:76px;line-height:1.5}
.field input:focus,.field textarea:focus{outline:none;border-bottom-color:var(--red)}
.field input:focus-visible,.field textarea:focus-visible{outline:none}
.form-trap{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form-foot{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:16px;margin-top:6px}
.form-send{display:inline-flex;align-items:center;gap:.45em;font:inherit;font-size:clamp(19px,2vw,30px);font-weight:500;letter-spacing:-.03em;color:var(--red);background:none;border:0;padding:0;cursor:pointer}
.form-send .brand-arrow{transition:transform .25s cubic-bezier(.22,1,.36,1)}
.form-send:hover .brand-arrow{transform:translate(5px,-5px)}
.form-send[disabled]{opacity:.5;cursor:default}
.form-send[disabled] .brand-arrow{transform:none}
.form-note{font-size:14px;color:var(--muted);margin:0}
.form-note[data-state="sent"]{color:var(--ink)}
.form-note[data-state="error"]{color:var(--red)}

.menu-overlay{background:var(--red);color:#fff}.menu-overlay[open]{display:flex;flex-direction:column;animation:menu-in .3s cubic-bezier(.2,.8,.2,1)}.overlay-header{padding:var(--pad);flex-shrink:0;align-items:flex-start}.overlay-header .close-button{color:#fff}.menu-layout{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);padding:25px var(--pad) 70px;flex:1;align-items:start}.menu-layout>.eyebrow{align-self:end}.menu-nav{position:static;font-size:clamp(45px,6vw,110px);line-height:1.13;letter-spacing:-.055em;display:flex;align-items:stretch;gap:10px}.menu-nav a{display:flex;gap:24px;align-items:baseline}.menu-number{font-size:12px;letter-spacing:0;min-width:20px}.menu-arrow{margin-left:auto;font-size:.65em;opacity:0;transition:opacity .2s,transform .2s;transform:translate(-5px,5px)}.menu-nav a:hover,.menu-nav a[aria-current="page"]{text-decoration:none}.menu-nav a:hover .menu-arrow,.menu-nav a[aria-current] .menu-arrow{opacity:1;transform:none}.overlay-footer{position:static;display:flex;justify-content:space-between;gap:25px;margin:0 var(--pad);padding:25px 0;border-top:1px solid #ffffff55;flex-shrink:0;font-size:14px}.search-overlay .overlay-header .logo{color:var(--red)}.search-overlay .overlay-header .close-button{color:#232323}.search-hint{color:#696969}.search-count,.search-meta{font-size:14px}.search-results .work-card .card-title{font-size:clamp(14px,1.35vw,22px)}.search-input{font-size:clamp(42px,5.2vw,100px);font-weight:500}.search-input:focus-visible{border-color:var(--red)}
@media(min-width:1800px){.header-intro{font-size:3.25vw;width:45vw}}
@media(max-width:1000px){.header-links{gap:16px}.header-intro{left:25vw;font-size:3.6vw;width:42vw}.header-intro .eyebrow{font-size:10px;max-width:240px}.card-caption{grid-template-columns:1fr!important;gap:6px}.card-type{display:block;font-size:11px}.footer-bottom{grid-template-columns:1fr 1fr}.footer-bottom .socials{grid-column:1/-1;margin-top:18px}.studio-intro h1{grid-column:1/span 4}.studio-description{grid-column:5/span 4}.contact-grid{grid-template-columns:2fr 5fr}.contact-email{font-size:2.8vw}.header-label{bottom:36px}.footer-legal{margin-top:44px}}
@media(max-width:600px){:root{--pad:22px;--gap:14px;--body:17px}.site-header{height:140px;padding-top:24px}.logo{width:116px;min-width:116px;height:auto;aspect-ratio:980/440}.header-links{gap:14px;font-size:15px;margin:0;align-items:flex-start}.header-links>a{padding:9px 0}.header-links .about-nav{display:none}.icon-button{width:30px;height:40px}.icon-button svg{width:22px;height:22px}.home .site-header{height:390px;min-height:0;display:flex;padding-bottom:0}.header-intro{top:133px;left:var(--pad);width:calc(100% - 2 * var(--pad));font-size:36px;line-height:1.13;letter-spacing:-.035em}.desktop-break{display:none}.header-intro h1{max-width:355px}.header-intro .eyebrow{font-size:10px;max-width:none;margin-top:22px}.header-label{bottom:31px;font-size:10px;line-height:1.45}.hero-down{bottom:24px;font-size:32px}.feed-grid{gap:45px}.card-caption{grid-template-columns:58px 1fr!important;gap:14px;margin-top:16px}.card-type{font-size:11px;padding-top:3px}.card-description{font-size:15px;line-height:1.4}.feed-end{margin-top:50px}.all-work-link{font-size:27px;padding-top:18px}.filters{font-size:13px;gap:12px 10px}.work-toolbar{margin-top:0;margin-bottom:32px}.view-options{gap:4px}.view-button{width:32px;height:32px}.project-intro h1{font-size:30px;max-width:100%;margin-bottom:25px}.project-intro .project-description{font-size:17px}.site-footer{padding-top:80px;padding-bottom:25px}.footer-invitation{padding-bottom:45px}.footer-invitation>.eyebrow{font-size:10px;max-width:240px}.footer-cta{font-size:52px;gap:15px;margin-top:18px;letter-spacing:-.06em;line-height:1.05}.footer-cta span{font-size:36px}.footer-bottom{grid-template-columns:1fr;gap:22px;padding-top:25px;font-size:14px}.footer-contact{gap:7px}.footer-bottom .socials{grid-column:1/-1;margin-top:0;gap:24px}.footer-brand p{font-size:13px}.footer-legal{font-size:11px;margin-top:38px}.progress-top{font-size:11px}.studio-intro{display:block}.studio-intro h1{font-size:45px;margin:22px 0 29px}.studio-description{font-size:17px}.studio-mark{padding:32px 25px;margin:45px 0}.studio-services{grid-template-columns:1fr;gap:32px}.studio-services h2{font-size:38px;margin-top:20px}.services-list .service{grid-template-columns:24px 1fr;gap:15px;padding:22px 0}.service h3{font-size:27px}.service p{font-size:15px}.studio-person{grid-template-columns:1fr;gap:22px;margin-top:45px;padding-top:24px}.studio-person h2{font-size:28px;margin-bottom:15px}.studio-person .text-link{font-size:16px}.contact-page h1{font-size:64px;line-height:1;margin:24px 0 50px;letter-spacing:-.07em}.contact-page>.eyebrow{font-size:11px}.contact-grid{grid-template-columns:1fr;gap:32px;padding-top:26px}.contact-intro{font-size:28px}.contact-intro br{display:none}.contact-details>.eyebrow{font-size:11px;margin-bottom:18px}.contact-email{font-size:21px;letter-spacing:-.035em;gap:8px}.form-row{grid-template-columns:1fr;gap:0}.contact-form{margin-top:38px;padding-top:24px}.field{margin-bottom:22px}.form-send{font-size:20px}.menu-layout{display:flex;flex-direction:column-reverse;justify-content:space-between;gap:40px;padding:30px var(--pad) 45px}.menu-layout>.eyebrow{align-self:start;font-size:11px}.menu-nav{font-size:48px;width:100%;gap:13px}.menu-nav a{gap:20px}.menu-number{font-size:11px}.overlay-header{padding-top:24px}.overlay-footer{flex-direction:column;gap:12px;font-size:12px;padding:22px 0;margin:0 var(--pad)}.search-content{margin-top:12px}.search-overlay .overlay-header{height:125px}.search-hint{font-size:20px}.search-input{font-size:39px}.search-meta{font-size:13px}.search-results .work-card .card-title{font-size:14px}.search-results{gap:28px 14px}}
@media(max-width:360px){.header-links{gap:8px}.header-intro{font-size:32px}.home .site-header{height:370px}.footer-cta{font-size:44px}.contact-page h1{font-size:57px}.contact-email{font-size:18px}.studio-intro h1{font-size:40px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.feed-card a:hover .card-media img,.work-card a:hover .card-media img,.footer-cta:hover span,.hero-down:hover{transform:none}}
.themed-project .site-header .logo,.themed-project .header-links a:hover,.themed-project .header-links a[aria-current],.themed-project .footer-cta,.themed-project .footer-contact a:hover,.themed-project .socials a:hover{color:var(--ink)}

/* Live-site device module */
.module-device{grid-column:1/-1}
.device-scene{--rx:0deg;--ry:0deg;perspective:2400px;padding:3vw 7vw 1vw 4vw}
.device-stage{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 16%;align-items:end;gap:5%;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .9s cubic-bezier(.22,1,.36,1)}
.laptop{transform-style:preserve-3d;transform:rotateX(6deg) rotateY(-9deg);transition:transform .9s cubic-bezier(.22,1,.36,1)}
.device-scene:hover .laptop{transform:rotateX(2deg) rotateY(-3deg)}
.laptop-lid{position:relative;padding:1.4%;background:linear-gradient(160deg,#3a3a3c,#151516);border-radius:1.6vw 1.6vw .4vw .4vw;box-shadow:0 2.5vw 6vw rgba(0,0,0,.55),inset 0 0 0 1px rgba(255,255,255,.08);transform-origin:50% 100%;transform:rotateX(-8deg);transition:transform .9s cubic-bezier(.22,1,.36,1)}
.device-scene:hover .laptop-lid{transform:rotateX(0deg)}
.laptop-screen{position:relative;aspect-ratio:16/10;overflow:hidden;background:#060606;border-radius:.6vw}
.laptop-base{height:1.4vw;background:linear-gradient(#2b2b2d,#111);border-radius:0 0 1vw 1vw;box-shadow:0 1.2vw 2.4vw rgba(0,0,0,.5);position:relative}
.laptop-notch{position:absolute;left:50%;top:0;width:14%;height:.45vw;transform:translateX(-50%);background:#0a0a0a;border-radius:0 0 .4vw .4vw}
.phone{transform:translateZ(60px) translateY(-8%) rotateY(-10deg);transform-style:preserve-3d;padding:2.5%;background:linear-gradient(160deg,#3a3a3c,#151516);border-radius:2.4vw;box-shadow:0 2vw 5vw rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.08);transition:transform .9s cubic-bezier(.22,1,.36,1)}
.device-scene:hover .phone{transform:translateZ(120px) translateY(-6%) rotateY(-6deg)}
.phone-screen{position:relative;aspect-ratio:390/844;overflow:hidden;background:#060606;border-radius:1.8vw}
.laptop-screen iframe,.phone-screen iframe{position:absolute;inset:0;border:0;transform-origin:0 0;width:1440px;height:900px;background:#060606}
.phone-screen iframe{width:390px;height:844px}
.device-bar{display:flex;justify-content:space-between;align-items:baseline;gap:2vw;margin-top:3.2vw;border-top:1px solid color-mix(in srgb,var(--ink) 18%,transparent);padding-top:1.4vw;flex-wrap:wrap}
.device-hint{color:var(--muted);font-size:clamp(13px,1vw,16px)}
.device-link{font-size:clamp(20px,2.2vw,40px);letter-spacing:-.03em;font-weight:500}
.device-link span{color:var(--red)}.themed-project .device-link span{color:var(--ink)}
.device-link:hover{text-decoration:underline;text-underline-offset:6px}
.device-bar{margin-left:-4vw;margin-right:-7vw}
@media(max-width:900px){.device-scene{padding:2vw 3vw 0}.device-bar{margin-left:-3vw;margin-right:-3vw}.device-stage{grid-template-columns:1fr;gap:6vw}.phone{display:none}.laptop{transform:rotateX(4deg) rotateY(-4deg)}}
@media(max-width:600px){.device-scene{padding:0}.device-bar{margin-left:0;margin-right:0}.laptop-lid{border-radius:12px 12px 3px 3px;padding:6px}.laptop-screen{border-radius:5px}.laptop-base{height:10px}.device-bar{margin-top:28px;padding-top:14px}}
