
/* JAKHON 2026 — career, boutique studio and interactive extensions */
.project-tools{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:-8px 0 24px;color:#57717e;font:700 11px Consolas,monospace}
.project-search{display:flex;align-items:center;gap:9px;max-width:490px;flex:1;padding:0 15px;border:1px solid #cedcde;border-radius:10px;background:white}
.project-search>span{font-size:25px;color:#1b8c7a}.project-search input{flex:1;width:100%;min-width:0;height:48px;border:0;outline:0;color:#12333d;background:none;font:500 13px "Segoe UI",sans-serif}
.project-search:focus-within{outline:2px solid #4acdb7;outline-offset:2px}
.project-empty{padding:36px;text-align:center;border:1px dashed #8eb3b4;background:#edf7f5;border-radius:12px;color:#17474d}
.project-empty button{border:0;background:none;text-decoration:underline;font-weight:700;color:#00685d}
.art-mini{position:relative;display:flex;flex-direction:column;gap:9px;align-items:center;justify-content:center;text-align:center;padding:25px!important}
.art-mini strong{font-size:clamp(25px,3vw,37px);font-weight:840;letter-spacing:-.06em;line-height:1.1;color:#e4fff7;position:relative;z-index:2}
.art-mini small{position:relative;z-index:2;color:#b2ddd4;font:750 9px Consolas,monospace;letter-spacing:.14em}
.art-gourmet{background:radial-gradient(circle at 60% 30%,#946b51,#232a35 70%)!important}
.art-chatbot{background:radial-gradient(circle at 50% 50%,#245f72,#12283f 70%)!important}
.art-news{background:linear-gradient(125deg,#14354a,#26625e)!important}
.art-notify{background:linear-gradient(135deg,#1c3147,#474171)!important}
.art-motion{background:radial-gradient(circle at 55% 35%,#6b5b9d,#202e56 73%)!important}
.career-section{background:#101e2e;color:#eefbf7}
.career-layout{display:grid;grid-template-columns:1.05fr 1fr;gap:min(11vw,140px);align-items:start}
.career-layout h2{font-size:clamp(2.65rem,4.2vw,5rem);margin-bottom:26px}
.career-layout h2 span{color:#71dec5}
.career-layout p{max-width:520px;color:#a0b8c4;font-size:15px;line-height:1.85}
.career-layout .btn{margin-top:15px}
.career-steps>div{border-left:1px solid #3a7f7e;padding:0 0 34px 28px;position:relative}
.career-steps>div::before{position:absolute;content:"";background:#67dfc4;width:9px;height:9px;border-radius:50%;left:-5px;top:3px}
.career-steps>div:last-child{padding-bottom:0}
.career-steps small{display:block;color:#69d6bd;font:700 10px Consolas,monospace;letter-spacing:.14em;margin-bottom:15px}
.career-steps h3{font-size:23px;margin-bottom:12px}
.career-steps p{font-size:13px;margin:0}
.hf-strip{padding:27px 0 0;border-top:1px solid #34525a;margin-top:70px;display:flex;justify-content:space-between;align-items:center;gap:22px}
.hf-strip>strong{font:800 11px Consolas,monospace;letter-spacing:.1em;color:#a4dbd3}
.hf-strip>div{display:flex;gap:8px;flex-wrap:wrap}
.hf-strip span{padding:7px 11px;font:650 11px "Segoe UI",sans-serif;border:1px solid #365864;border-radius:8px;background:#162f3e;color:#c9f2e5}
.studio-teaser{padding:70px 0;background:linear-gradient(120deg,#21455e,#19374b 52%,#314264);color:#f2faf9}
.teaser-layout{display:flex;align-items:center;justify-content:space-between;gap:30px}
.teaser-layout h2{font-size:clamp(2.5rem,4vw,4.7rem);margin-bottom:17px}
.teaser-layout p{max-width:680px;color:#c7d4e3;font-size:14px;line-height:1.8}
.teaser-layout .section-label{color:#81ddcf}
.teaser-layout .btn{flex-shrink:0}
@media(max-width:900px){.career-layout{grid-template-columns:1fr;gap:60px}.hf-strip{align-items:flex-start;flex-direction:column}.teaser-layout{align-items:flex-start;flex-direction:column}}
@media(max-width:560px){.project-tools{align-items:stretch;flex-direction:column}.project-search{max-width:none}.career-steps h3{font-size:19px}.hf-strip{margin-top:40px}.studio-teaser{padding:65px 0}}
/* AI video / studio page */
.studio-header-block{background:linear-gradient(130deg,#07131f,#183045 55%,#1b3149);padding:125px 0 100px;position:relative;overflow:hidden}
.studio-header-block:before{content:"";position:absolute;width:490px;height:490px;border:1px solid #5e8eaa44;border-radius:50%;right:-100px;top:-90px;box-shadow:0 0 0 55px #94b5fa09,0 0 0 130px #94b5fa09}
.studio-hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:65px;align-items:center;position:relative;z-index:1}
.studio-label{color:#71daca;font:750 11px Consolas,monospace;letter-spacing:.16em}
.studio-header-block h1{margin:20px 0 25px;font-size:clamp(3.7rem,6.5vw,7rem)}
.studio-header-block h1 em{font-style:normal;color:#81e0d0}
.studio-header-block p{max-width:650px;color:#b5cbd7;font-size:17px;line-height:1.8}
.studio-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:35px}
.studio-hero-art{position:relative;aspect-ratio:1/1;display:grid;place-items:center;border:1px solid #426879;border-radius:30px;background:radial-gradient(circle at center,#2d6675,#142c43 60%,#0b1c30);box-shadow:0 40px 80px #0003}
.studio-hero-art:before,.studio-hero-art:after{content:"";position:absolute;width:76%;height:76%;border:1px solid #60e1d049;border-radius:50%}
.studio-hero-art:after{width:55%;height:55%;border-color:#6fb4f95e}
.studio-hero-art span{z-index:1;font-size:clamp(2.7rem,5vw,6rem);font-weight:850;letter-spacing:-.09em;line-height:.95;text-align:center;color:#e5fff8}
.studio-hero-art small{position:absolute;bottom:12%;font:750 10px Consolas,monospace;color:#94cdbf;letter-spacing:.13em}
.studio-subnav{background:#102435;position:sticky;top:87px;z-index:40;border-bottom:1px solid #2e4f5b}
.studio-subnav .container{display:flex;align-items:center;gap:35px;overflow-x:auto;white-space:nowrap;scrollbar-width:none}
.studio-subnav a{padding:16px 0;font-size:12px;font-weight:720;color:#b5d0d9}
.studio-subnav a:hover{color:#6cf1d0}
.studio-section{background:#eef3f3;color:#19303c}
.studio-section.alt{background:#0d1e30;color:#eef7f6}
.studio-section h2{font-size:clamp(2.7rem,4.4vw,5.1rem);margin:0 0 17px}
.studio-intro{max-width:740px;color:#637985;line-height:1.8}
.studio-section.alt .studio-intro{color:#a6bbc7}
.motion-plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:43px}
.motion-plan{padding:24px 21px 23px;display:flex;align-items:stretch;flex-direction:column;gap:10px;text-align:left;background:#fff;color:#1b3542;border:1px solid #d4e3e5;border-radius:12px;transition:transform .22s,border-color .22s,box-shadow .22s}
.motion-plan:hover{transform:translateY(-4px);border-color:#66bcb2}
.motion-plan.is-selected{background:#103b49;color:#e7fff6;border-color:#58ddc0;box-shadow:0 18px 32px #0b464126}
.motion-plan>span{font:750 10px Consolas,monospace;letter-spacing:.1em;color:#418b85}
.motion-plan.is-selected>span{color:#83edcd}
.motion-plan>strong{font-size:29px;letter-spacing:-.05em}
.motion-plan>small{min-height:42px;line-height:1.6;color:#68818a}
.motion-plan.is-selected small{color:#b3dad4}
.motion-plan>b{margin-top:13px;font-size:32px;letter-spacing:-.05em}
.motion-plan>b em{font-size:13px;font-weight:600;font-style:normal;letter-spacing:0}
.motion-plan small:last-child{margin-top:auto;border-top:1px solid #d5e0e1;padding-top:15px;min-height:0;font-size:11px}
.motion-plan.is-selected small:last-child{border-color:#386776}
.motion-calc{display:grid;grid-template-columns:1fr .86fr;gap:0;background:white;border:1px solid #dce7e8;border-radius:15px;overflow:hidden;margin-top:24px;box-shadow:0 18px 35px #1943530b}
.calc-inputs{padding:42px}
.calc-inputs h3{font-size:34px;line-height:1.12;margin-bottom:38px}
.duration-heading{display:flex;justify-content:space-between;gap:10px;font-size:14px;font-weight:760}
.duration-heading output{color:#0c8e7e;font-family:Consolas,monospace}
#video-duration{width:100%;accent-color:#159c8c;margin:24px 0 10px;cursor:pointer}
.duration-marks{display:flex;justify-content:space-between;font-size:11px;color:#82949b}
.motion-extras{border:0;padding:0;margin:45px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.motion-extras legend{font-size:12px;font-weight:800;grid-column:span 2;margin-bottom:16px}
.motion-extras label{font-size:13px;display:flex;gap:9px;align-items:center;cursor:pointer}
.motion-extras input{accent-color:#1a9e8a;width:16px;height:16px}
.calc-output{padding:42px;background:#123947;color:#f4fffa;display:flex;flex-direction:column;gap:17px}
.calc-output>span:first-child{font:700 10px Consolas,monospace;letter-spacing:.12em;color:#7dd7cb}
.calc-total{display:flex;flex-direction:column;gap:3px;border-bottom:1px solid #3b6772;padding-bottom:19px}
.calc-total small{color:#b0cccf;font-size:12px}
.calc-total strong{font-size:clamp(2.4rem,4.5vw,4.2rem);letter-spacing:-.055em;line-height:1.12}
.calc-total.deposit strong{color:#87f0d2}
.calc-remainder{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:12px;color:#bcd1d3}
.calc-remainder b{color:white;font-size:21px}
.calc-output p{font-size:11px;line-height:1.8;color:#acc5c9;margin:0}
.calc-output .btn{width:100%;gap:9px}
.calc-output .btn-outline{color:white;border-color:#517987}
.copy-status{font-size:11px;color:#a4f2d5;min-height:18px}
.includes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:28px}
.includes-grid>div{padding:26px 24px;border:1px solid #dce7e7;border-radius:10px;background:#fff}
.includes-grid strong{display:block;font-size:16px}
.includes-grid p{font-size:12px;line-height:1.7;color:#657d86;margin:10px 0 0}
.includes-grid a{color:#007e75;font-weight:750}
.bot-studio-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-top:38px}
.bot-studio-card{padding:32px;border:1px solid #355062;border-radius:15px;background:#132d3f;transition:transform .22s,border-color .22s}
.bot-studio-card:hover{transform:translateY(-4px);border-color:#72ddc8}
.bot-studio-card .bot-id{color:#7ad9c4;font:750 10px Consolas,monospace;letter-spacing:.14em}
.bot-studio-card h3{font-size:27px;margin:25px 0 15px}
.bot-studio-card p{font-size:13px;color:#a6beca;line-height:1.9}
.bot-studio-card .bot-mark{font-size:50px;color:#b6f0e2}
.bot-studio-card .bot-status{display:inline-block;font-size:11px;color:#e9d7b2;background:#69552e;padding:5px 9px;border-radius:30px}
.studio-career-timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:42px}
.studio-career-timeline>article{padding:29px;border:1px solid #d4e1e1;background:#fff;border-radius:13px}
.studio-career-timeline article>small{font:780 11px Consolas,monospace;color:#108879;letter-spacing:.1em}
.studio-career-timeline article h3{font-size:23px;margin:26px 0 16px}
.studio-career-timeline article p{font-size:13px;line-height:1.8;color:#617883}
.hf-panel{margin-top:28px;background:#153644;border-radius:14px;padding:37px;color:#e7fcf5}
.hf-panel h3{font-size:26px;margin-bottom:13px}
.hf-panel p{max-width:780px;color:#b9d0d0;font-size:14px;line-height:1.8}
.hf-panel .hf-tags{display:flex;gap:8px;flex-wrap:wrap}
.hf-panel .hf-tags span{padding:9px 12px;border:1px solid #46747b;border-radius:7px;color:#b0f3da;font-weight:720;font-size:12px}
.quote-form{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:38px;max-width:930px}
.quote-form .field{display:flex;flex-direction:column;gap:9px}
.quote-form .field.full{grid-column:span 2}
.quote-form label{font-size:12px;color:#bdcfd8;font-weight:700}
.quote-form input,.quote-form select,.quote-form textarea{border:1px solid #52707d;background:#102737;border-radius:9px;padding:14px 16px;color:#fff;font:inherit;font-size:13px;min-width:0}
.quote-form textarea{resize:vertical;min-height:115px}
.quote-form .btn{justify-self:start}
.quote-note{grid-column:span 2;color:#9bbbc6;font-size:11px}
.quote-status{grid-column:span 2;color:#a5f0d5;font-size:12px}
@media(max-width:1080px){.motion-plans{grid-template-columns:repeat(2,1fr)}.studio-career-timeline{grid-template-columns:1fr 1fr}.studio-subnav{top:75px}}
@media(max-width:760px){.studio-hero-grid,.motion-calc{grid-template-columns:1fr}.studio-hero-art{max-width:460px;width:100%;aspect-ratio:1.3}.studio-header-block{padding:75px 0}.includes-grid{grid-template-columns:1fr}.bot-studio-grid,.studio-career-timeline{grid-template-columns:1fr}.studio-subnav .container{gap:19px}}
@media(max-width:480px){.motion-plans{grid-template-columns:1fr 1fr;gap:8px}.motion-plan{padding:20px 13px}.motion-plan>b{font-size:27px}.motion-plan>strong{font-size:24px}.calc-inputs,.calc-output{padding:26px 20px}.motion-extras{grid-template-columns:1fr}.quote-form{grid-template-columns:1fr}.quote-form .field.full,.quote-note,.quote-status{grid-column:auto}}

@media(min-width:821px) and (max-width:1050px){
 .menu-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:43px;height:43px;border:1px solid #315466;border-radius:8px;background:none;z-index:110}
 .menu-toggle span{width:19px;height:2px;background:#d8f4ee;border-radius:2px;transition:transform .2s,opacity .2s}
 .menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(8px) rotate(45deg)}
 .menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
 .menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-8px) rotate(-45deg)}
 .site-nav{display:none;position:fixed;top:87px;left:0;right:0;min-height:calc(100dvh - 87px);padding:30px 35px;background:#071925;flex-direction:column;align-items:stretch;gap:7px;box-shadow:0 30px 35px #0007;overflow-y:auto}
 .site-nav.is-open{display:flex}
 .site-nav>a{padding:16px 7px;border-bottom:1px solid #23414b;font-size:18px}
 .site-nav .nav-contact{padding:16px;margin-top:10px}
 .studio-subnav{top:87px}
}
