:root{font-family:Arial,Helvetica,sans-serif;font-synthesis:none;font-size:100%;scroll-behavior:smooth;color:#1d241f;background:#f8f8f4}*{box-sizing:border-box}body{margin:0;line-height:1.65}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}img{max-width:100%;display:block;object-fit:cover}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid currentColor;outline-offset:5px}[hidden]{display:none!important}.skip{position:absolute;top:-100px;left:20px;padding:14px;background:#fff;z-index:20}.skip:focus{top:10px}.demo-bar{background:#fff;color:#202820;border-bottom:1px solid #d8ddd5;padding:12px 4vw;display:flex;align-items:center;justify-content:space-between;gap:14px;font:14px/1.5 Arial,sans-serif}.demo-bar a{text-decoration:underline;text-underline-offset:4px;min-height:32px;display:inline-flex;align-items:center}.demo-bar>span{max-width:530px}.demo-wrap{width:min(1240px,calc(100% - 96px));margin-inline:auto}.demo-nav{display:flex;justify-content:space-between;align-items:center;gap:30px;padding-block:28px;border-bottom:1px solid var(--line,#c8cdc3)}.demo-logo{font-size:2.4rem;letter-spacing:-.07em;line-height:1.1;font-weight:700}.demo-nav nav{display:flex;align-items:center;gap:32px;font-size:.875rem}.demo-nav a{padding-block:8px}.demo-nav nav a:hover{text-decoration:underline;text-underline-offset:5px}.demo-kicker{font-size:.875rem;letter-spacing:.09em;text-transform:uppercase;line-height:1.5;margin:0 0 22px}.demo-button{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;padding:15px 22px;min-height:52px;font-size:1rem;line-height:1.5;font-weight:600;background:var(--accent,#242c24);color:var(--on-accent,#fff);border:1px solid transparent}.demo-button:hover{filter:brightness(.92)}.demo-section{padding-block:80px;scroll-margin-top:24px}.demo-section h2{font-size:clamp(2rem,4vw,3.5rem);line-height:1.12;letter-spacing:-.04em;font-weight:500;margin:0 0 24px}.demo-section p{font-size:1rem;max-width:640px}.demo-footer{padding:28px 4vw;background:#fff;color:#263027;border-top:1px solid #d9ddd4;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;font-size:.875rem}.demo-footer a{text-decoration:underline;text-underline-offset:4px}.demo-footer nav{display:flex;gap:18px;flex-wrap:wrap}.demo-end{padding:48px 0;border-top:1px solid var(--line,#c8cdc3);display:flex;justify-content:space-between;gap:30px;align-items:center}.demo-end p{font-size:1rem;margin:0;max-width:620px}.demo-end strong{display:block;font-size:1.375rem;margin-bottom:10px}.demo-end .demo-button{flex-shrink:0}.demo-note{font-size:.875rem!important;line-height:1.6;opacity:.8}.demo-nav,.demo-hero{animation:arrive .65s ease both}.demo-hero{animation-delay:.08s}@keyframes arrive{from{opacity:.3;transform:translateY(10px)}to{opacity:1;transform:none}}
/* VOLT — technical, dark, structured. */
.volt-page{--accent:#f2e548;--on-accent:#141b23;--line:#414b54;background:#171d24;color:#f4f6f3}.volt-page .demo-logo{color:#f2e548;font-weight:900}.volt-page .demo-nav{border-color:#414b54}.volt-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;padding-block:52px 48px;align-items:stretch}.volt-hero-copy{display:flex;flex-direction:column;align-items:start;justify-content:center;padding-block:22px}.volt-hero h1{font-size:clamp(3.3rem,6.3vw,6rem);line-height:1;letter-spacing:-.065em;font-weight:800;margin:0 0 30px}.volt-hero h1 span{color:#f2e548}.volt-hero-copy>p:not(.demo-kicker){font-size:1.125rem;line-height:1.7;color:#c9d0d5;max-width:435px;margin:0 0 30px}.volt-hero figure{margin:0;position:relative;min-width:0}.volt-hero img{width:100%;height:550px;object-position:center;border-radius:2px}.volt-hero figcaption{position:absolute;bottom:22px;left:22px;right:22px;background:#171d24ed;padding:16px 20px;font-size:.875rem;border-left:3px solid #f2e548}.volt-hero figcaption strong{display:block;font-size:1rem}.volt-strip{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid #414b54}.volt-strip>div{padding:22px 20px;display:flex;gap:18px;align-items:center;font-size:1rem}.volt-strip>div+div{border-left:1px solid #414b54}.volt-strip span{color:#f2e548;font-size:.875rem}.volt-services{display:grid;grid-template-columns:.8fr 1.2fr;gap:72px}.volt-services h2{font-weight:700}.volt-services>div>p{color:#c9d0d5}.service-switch{display:flex;flex-direction:column;border-top:1px solid #414b54}.service-switch button{background:none;color:#dce1e4;text-align:left;border:0;border-bottom:1px solid #414b54;padding:18px 16px;display:flex;justify-content:space-between;gap:20px;font-size:1.125rem}.service-switch button[aria-pressed=true]{background:#f2e548;color:#171d24;font-weight:700}.service-copy{padding:28px 0 0}.service-copy h3{font-size:1.5rem;margin:0 0 12px;letter-spacing:-.02em}.service-copy p{color:#c9d0d5;margin:0 0 16px}.service-copy ul{padding-left:20px;color:#e1e7e9;line-height:1.9;margin-bottom:0}.volt-process{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:40px}.volt-process article{border-top:1px solid #414b54;padding-top:20px}.volt-process h3{font-size:1.2rem;margin:12px 0}.volt-process span{font-size:.875rem;color:#f2e548}.volt-process p{color:#c9d0d5}.volt-page .demo-end p{color:#c9d0d5}.volt-page .demo-end strong{color:#fff}
/* KLIKA — editorial cafe, plum ink, pink paper, pistachio accents. */
.klika-page{--accent:#39263b;--on-accent:#fff;--line:#bba4b5;background:#eedce6;color:#39263b}.klika-page .demo-logo{font:700 3rem/1 Georgia,serif;letter-spacing:-.085em}.klika-hero{padding-block:45px 55px;text-align:center;display:grid;grid-template-columns:1fr 1.1fr;gap:40px;align-items:center}.klika-hero h1{font:clamp(4rem,8vw,8rem)/.94 Georgia,serif;letter-spacing:-.075em;margin:0 0 30px}.klika-hero h1 em{font-weight:400}.klika-hero-copy{padding-block:20px}.klika-hero-copy>p:not(.demo-kicker){font-size:1.125rem;max-width:360px;margin:0 auto 30px}.klika-photo{position:relative;padding:20px 10px 0}.klika-photo img{width:100%;aspect-ratio:1;max-height:590px;border-radius:50% 50% 12px 12px}.klika-photo>span{position:absolute;bottom:22px;left:0;padding:15px 22px;background:#dceaab;font-size:.875rem;transform:rotate(-5deg);border:1px solid #aebd78}.klika-ribbon{background:#dceaab;padding:19px 24px;display:flex;justify-content:center;gap:44px;font-size:1rem;border-block:1px solid #aab67f;flex-wrap:wrap}.klika-menu{max-width:940px}.klika-menu .demo-kicker,.klika-menu h2{text-align:center}.klika-menu h2{font-family:Georgia,serif;font-size:3.25rem}.menu-switch{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:32px 0}.menu-switch button{border:1px solid #bba4b5;border-radius:99px;padding:12px 24px;min-height:48px;color:#39263b;background:transparent}.menu-switch button[aria-pressed=true]{background:#39263b;color:white;border-color:#39263b}.menu-panel{border-top:1px solid #bba4b5}.menu-item{display:flex;justify-content:space-between;gap:20px;align-items:baseline;padding:21px 0;border-bottom:1px solid #bba4b5}.menu-item h3{font-size:1.2rem;margin:0 0 4px;font-weight:500}.menu-item p{font-size:.875rem;margin:0}.menu-item>span{font-size:1.125rem;white-space:nowrap}.klika-menu .demo-note{text-align:center;max-width:none;margin-top:25px}.klika-story{background:#39263b;color:#f0e0e9;padding-block:64px}.klika-story>.demo-wrap{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}.klika-story h2{font:3rem/1.1 Georgia,serif;letter-spacing:-.045em;margin:0}.klika-story p{font-size:1.125rem;margin:0 0 20px}.klika-story .demo-note{margin:0}.klika-page .demo-end{border:0;padding-block:60px}
/* FORMA — architectural editorial, open image and disciplined type. */
.forma-page{background:#eeeee7;--accent:#2b332a;--on-accent:#fff;--line:#b7beb0;color:#293028}.forma-page .demo-logo{font:3rem/1 Georgia,serif;letter-spacing:-.06em;font-weight:400}.forma-hero{padding-block:48px 0}.forma-intro{display:grid;grid-template-columns:1.4fr .6fr;gap:50px;align-items:end;margin-bottom:42px}.forma-intro h1{font:clamp(3.5rem,7vw,7rem)/1.02 Georgia,serif;letter-spacing:-.065em;margin:0}.forma-intro h1 em{font-weight:400}.forma-intro>div:last-child p{font-size:1rem;line-height:1.75;margin:0 0 22px}.forma-intro a{text-decoration:underline;text-underline-offset:6px;display:inline-flex;min-height:44px;align-items:center}.forma-hero figure{margin:0}.forma-hero figure img{width:100%;height:540px;object-position:center 48%}.forma-hero figcaption{display:flex;justify-content:space-between;gap:24px;font-size:.875rem;padding-block:20px;border-bottom:1px solid #b7beb0}.forma-project{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px}.forma-project h2{font-family:Georgia,serif;font-size:3.25rem}.forma-project>div>p{font-size:1.125rem;margin-top:0}.project-facts{margin:30px 0;display:grid;grid-template-columns:1fr 1fr;gap:20px;padding-block:24px;border-block:1px solid #b7beb0}.project-facts dt{font-size:.875rem;margin-bottom:4px}.project-facts dd{font-size:1.125rem;margin:0}.forma-project details{border-bottom:1px solid #b7beb0}.forma-project summary{padding:20px 0;cursor:pointer;font-size:1.125rem}.forma-project details p{padding-bottom:20px;font-size:1rem;margin:0}.forma-services{background:#dce0d4;padding-block:60px}.forma-services>.demo-wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:45px}.forma-services h3{font:1.875rem/1.2 Georgia,serif;margin:20px 0 15px}.forma-services p{font-size:1rem;margin:0}.forma-services span{font-size:.875rem}.forma-page .demo-end{border:0;padding-block:60px}
@media(max-width:1000px){.demo-wrap{width:calc(100% - 56px)}.volt-hero{gap:30px}.volt-hero img{height:480px}.volt-services{gap:40px}.demo-nav nav{gap:22px}.klika-hero{gap:24px}.klika-hero h1{font-size:6rem}.forma-intro{grid-template-columns:1.2fr .8fr;gap:32px}.forma-project{gap:40px}.demo-end{align-items:start;flex-direction:column}.volt-strip>div{padding-inline:15px;gap:12px}}
@media(max-width:700px){.demo-wrap{width:calc(100% - 40px)}.demo-bar{padding:12px 20px;align-items:start;gap:10px;flex-wrap:wrap}.demo-bar>span{flex-basis:100%;order:2;font-size:.875rem}.demo-nav{padding-block:22px;gap:16px;flex-wrap:wrap}.demo-nav nav{gap:12px 22px;flex-wrap:wrap}.demo-logo{font-size:2rem}.demo-section{padding-block:48px}.volt-hero{grid-template-columns:1fr;padding-block:28px 32px;gap:30px}.volt-hero h1{font-size:clamp(3.3rem,12vw,5.3rem)}.volt-hero-copy{padding:0}.volt-hero img{height:390px}.volt-hero-copy>p:not(.demo-kicker){font-size:1rem}.volt-strip{grid-template-columns:1fr}.volt-strip>div{padding:16px 0}.volt-strip>div+div{border-left:0;border-top:1px solid #414b54}.volt-services{grid-template-columns:1fr;gap:24px}.volt-process{grid-template-columns:1fr;gap:20px;margin-top:30px}.volt-process article{padding-top:15px}.klika-hero{grid-template-columns:1fr;padding-block:36px 40px;gap:20px}.klika-hero-copy{padding:0}.klika-hero h1{font-size:clamp(4.7rem,18vw,7rem)}.klika-hero-copy>p:not(.demo-kicker){font-size:1rem}.klika-photo{max-width:430px;margin-inline:auto;width:100%}.klika-ribbon{gap:10px 25px;font-size:.875rem}.klika-menu h2{font-size:2.75rem}.menu-switch{gap:8px}.menu-switch button{padding:10px 18px}.klika-story>.demo-wrap{grid-template-columns:1fr;gap:24px}.klika-story{padding-block:45px}.klika-story h2{font-size:2.5rem}.klika-story p{font-size:1rem}.forma-hero{padding-top:32px}.forma-intro{grid-template-columns:1fr;gap:25px;margin-bottom:25px}.forma-intro h1{font-size:clamp(3.5rem,12vw,5rem)}.forma-hero figure img{height:390px}.forma-hero figcaption{flex-direction:column;gap:5px}.forma-project{grid-template-columns:1fr;gap:20px}.forma-project h2{font-size:2.75rem}.forma-services>.demo-wrap{grid-template-columns:1fr;gap:35px}.forma-services{padding-block:40px}.forma-services h3{margin-top:10px}.demo-end{gap:24px;padding-block:40px!important}.demo-footer{padding:25px 20px}.demo-footer nav{gap:12px 20px}.demo-kicker{margin-bottom:18px}}
@media(max-width:380px){.demo-wrap{width:calc(100% - 32px)}.demo-nav nav{font-size:.875rem;gap:10px 16px}.demo-bar{padding-inline:16px}.volt-hero img{height:310px}.demo-button{padding-inline:16px;gap:18px}.menu-switch button{padding:10px 14px}.project-facts{grid-template-columns:1fr}.klika-hero h1{font-size:4.6rem}.demo-end .demo-button{max-width:100%;font-size:.875rem}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
