/* JISOAR — product-led studio, September 2026. */
:root{--bg:#f7f8fa;--ink:#142334;--mut:#526174;--accent:#174eca;--line:#dce1e7}
.bar,.bar.scrolled{background:#f7f8faf5;box-shadow:none;padding-block:17px}
.bar .brand{font-size:30px;font-weight:700;letter-spacing:-.055em}.brand .brand-dot{color:var(--accent)}
.bar nav a.cta{background:#142334;border-radius:100px;padding:12px 21px}.bar nav a.on::after{bottom:-3px}
.wrap{max-width:1400px}.studio-hero{min-height:740px;padding:156px 0 90px;background-color:#101f32}
.studio-hero::before{background:linear-gradient(90deg,#101f32 0%,rgba(16,31,50,.95) 38%,rgba(16,31,50,.63) 100%)}
.studio-hero>.wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:60px;align-items:center}
.studio-hero h1{font-size:clamp(42px,4.6vw,66px);line-height:1.18;letter-spacing:-.055em}.studio-hero h1 span{color:#fff}
.hero-kicker{font-size:14px;letter-spacing:.11em;color:#a9c8ff;display:flex;align-items:center;gap:12px;margin-bottom:28px}.hero-kicker:before{content:'';width:28px;height:2px;background:#a9c8ff}
.studio-hero .hero-copy{font-size:18px;max-width:510px;color:#cfdae6;line-height:1.85}.studio-hero .hero-note{color:#b9c9d9}
.studio-hero .action.primary{background:var(--accent);color:#fff;border-color:var(--accent)}.studio-hero .action.primary:hover{background:#123fa6;border-color:#123fa6}.home-close .action.primary{background:#fff;color:#142334;border-color:#fff}.action{border-radius:100px;padding:15px 23px;font-size:15px;min-height:52px;transition:background .2s,transform .2s}.action:hover{transform:translateY(-2px)}
.hero-showcase{min-width:0;position:relative;padding:24px 0}.showcase-caption{display:flex;justify-content:space-between;color:#e0e9f4;font-size:14px;margin-bottom:16px}.showcase-caption span:last-child{color:#b2c4dc}
.showcase-window{display:block;border:1px solid #93a6bf66;border-radius:14px;overflow:hidden;background:#eef3f9;box-shadow:0 28px 70px #050d1b66;transform:rotate(-2deg);transition:transform .25s}.showcase-window:hover{transform:rotate(0)}
.window-bar{display:flex;align-items:center;gap:6px;padding:13px 16px;border-bottom:1px solid #d8e1ee;color:#4c6077;font-size:12px;background:#edf2f8}.window-bar i{width:7px;height:7px;border-radius:50%;background:#94a8bf}.window-bar span{margin-left:10px}
.showcase-window img{width:100%;height:300px;object-fit:cover;object-position:top;display:block}.showcase-foot{margin-top:25px;display:flex;gap:14px;align-items:center;color:#c9d8e8;font-size:14px}.showcase-foot strong{color:white;display:block;font-size:16px}.showcase-foot .case-arrow{margin-left:auto;font-size:24px}
.proof-strip{background:#fff}.proof-strip .wrap{padding-block:27px}.proof-strip strong{font-size:17px;margin-bottom:4px}.proof-strip p{font-size:14px}
.home-section{padding:100px 0}.section-kicker{font-size:13px;letter-spacing:.15em;font-weight:700}.section-heading h2{font-size:clamp(32px,3.7vw,52px);line-height:1.22}.section-heading p{line-height:1.8}
.service-lines{display:grid;grid-template-columns:repeat(3,1fr);border-top:0;gap:18px}.service-line{display:flex;flex-direction:column;align-items:start;position:relative;gap:18px;padding:30px;border:1px solid var(--line);border-radius:12px;background:#fff;min-height:265px;transition:border-color .2s,transform .2s}.service-line:first-child{background:#edf2ff;border-color:#becdf0}.service-line:hover{border-color:#174eca;transform:translateY(-4px)}.service-line h3{font-size:25px}.service-line .arrow{position:absolute;right:28px;top:26px;font-size:22px}.service-line .no{font-size:14px}.service-line p{font-size:16px;line-height:1.8}
.case-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}.featured-work{display:flex;flex-direction:column;align-items:stretch;border:1px solid var(--line);border-radius:16px;overflow:hidden;padding:0;gap:0;background:white}.featured-work>a{background:#e6edf4;padding:24px;display:block}.featured-work img{border:0;border-radius:6px;height:290px;display:block;transition:transform .3s}.featured-work>a:hover img{transform:translateY(-4px)}.featured-work>div{padding:30px}.featured-work h3{font-size:29px}.featured-work p{font-size:16px}.featured-work:first-child{grid-column:1/-1;display:grid;grid-template-columns:1.3fr 1fr;align-items:center}.featured-work:first-child>a{padding:38px;height:100%;display:flex;align-items:center;background:#e1e9f4}.featured-work:first-child img{height:330px}.work-status{font-size:13px;letter-spacing:.02em}.project-link{font-size:15px}
.process-band{background:#eaf0f7}.process-list{gap:36px}.process-list li{border-color:#a7bad1}.process-list h3{font-size:22px}.home-close{background:#142334}.home-close h2{font-size:clamp(34px,4vw,56px)}
.phero{padding-bottom:38px}.phero .eyebrow{color:#174eca}.phero h1{font-size:clamp(38px,5vw,68px);letter-spacing:-.045em}.pcard{border-color:var(--line)}.darkcard{background:#142334}.chip.dark{background:#142334}.btn{border-radius:100px}.chan{border-radius:12px}.brief-form{max-width:900px;background:white;border:1px solid var(--line);padding:32px;border-radius:14px}.brief-field select,.brief-field input,.brief-field textarea{font-size:16px}.brief-form .actions{margin-top:20px}.brief-output{min-height:260px}.brief-help{line-height:1.8}.brief-intro{margin:0 0 25px;color:var(--mut);font-size:16px}.brief-jump{display:inline-block;color:#174eca;font-weight:650;text-decoration:underline;text-underline-offset:5px;margin-top:20px}.brief-status{max-width:900px}.brief-field select:focus,.brief-field input:focus,.brief-field textarea:focus{border-color:#174eca}
footer{padding-bottom:35px}footer .row{gap:20px;flex-wrap:wrap}
@media(max-width:1050px){.studio-hero>.wrap{gap:30px}.studio-hero h1{font-size:45px}.showcase-window img{height:260px}.service-line{padding:24px}.service-line h3{font-size:22px}}
@media(max-width:760px){.studio-hero{padding:125px 0 64px}.studio-hero>.wrap{grid-template-columns:1fr;gap:24px}.studio-hero h1{font-size:clamp(38px,8.5vw,58px)}.studio-hero .hero-copy{font-size:17px}.hero-showcase{padding:12px 0}.showcase-window{transform:none}.showcase-window img{height:230px}.showcase-caption{margin-bottom:12px}.showcase-foot{margin-top:15px}.hero-kicker{font-size:12px;margin-bottom:22px}.studio-hero .hero-note{font-size:13px}.service-lines{grid-template-columns:1fr}.service-line{min-height:0;padding:25px;gap:10px}.service-line h3{font-size:24px}.service-line p{max-width:32em}.case-grid{grid-template-columns:1fr;gap:24px}.featured-work:first-child{grid-column:auto;display:flex}.featured-work:first-child>a{padding:24px}.featured-work:first-child img,.featured-work img{height:230px}.featured-work>div{padding:25px}.featured-work h3{font-size:26px}.home-section{padding:65px 0}.proof-strip .wrap{display:grid;grid-template-columns:1fr;gap:16px}.proof-strip p{display:flex;flex-wrap:wrap;gap:6px 14px}.proof-strip strong{min-width:140px}.brief-form{padding:22px}.bar .brand{font-size:26px}.bar nav{gap:14px}.bar nav a.cta{padding:10px 14px}.home-close{padding:60px 0}.process-list{gap:24px}.showcase-caption span:last-child{font-size:12px}}
@media(max-width:380px){.bar nav{gap:10px}.bar nav a{font-size:12px}.bar .brand{font-size:24px}.studio-hero h1{font-size:36px}.showcase-window img{height:200px}}
@media(prefers-reduced-motion:reduce){.showcase-window,.showcase-window:hover,.service-line:hover,.action:hover{transform:none}}
.bar nav a[aria-current]{text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:2px}
.bar nav a:nth-child(n){display:inline-flex;align-items:center}
footer nav a.cta{padding:0;border:0;border-radius:0;font-weight:inherit}
footer nav{display:flex;gap:20px;flex-wrap:wrap}footer nav .cta{background:none;color:inherit}footer nav a[aria-current]{text-decoration:underline;text-underline-offset:5px}
@media(max-width:380px){.phero h1{font-size:32px}.bar nav a:nth-child(n){margin:0;padding:8px 0;min-height:44px}.bar nav a.cta{padding:8px 10px}}
@media(max-width:600px){.bar,.bar.scrolled{display:flex;flex-wrap:wrap;gap:8px;padding:10px 20px}.bar .brand{font-size:26px;line-height:1.3}.bar nav{width:100%;justify-content:space-between;gap:8px}.bar nav a{font-size:14px;min-height:44px;display:inline-flex;align-items:center;letter-spacing:0}.bar nav a.cta{padding:9px 14px}.bar nav a[aria-current]{text-underline-offset:5px}html{scroll-padding-top:130px}.phero{padding-top:150px}.studio-hero{padding-top:150px}.pcard[id],#project-brief{scroll-margin-top:130px}footer nav{gap:12px 18px}}
