/* PRESENTATION SYSTEM
   The original stylesheet remains the complete, no-JS Design 1
   This file supplies a single shared selector and four deliberately different
   compositions over the same Django templates / project data / interactions
   Numbered sections are independent: no generated duplicates or image filters
*/

/* Shared accessible navigation and universal layout safety */
.design-rail{display:none;position:fixed;right:clamp(8px,1vw,18px);top:50%;transform:translateY(-50%);z-index:65;width:46px;padding:15px 3px 18px;flex-direction:column;align-items:center;gap:11px;color:var(--ink);background:var(--paper);border:1px solid var(--border);box-shadow:0 8px 26px #0002;isolation:isolate}
.has-design-switch .design-rail{display:flex}
.design-rail__caption{font:800 9px/1.2 system-ui,sans-serif;letter-spacing:.12em;writing-mode:vertical-rl;white-space:nowrap}
.design-rail__caption--end{color:var(--muted)}
.design-rail__numbers{display:flex;flex-direction:column;align-items:center;gap:1px;position:relative;z-index:1}
.design-rail button{display:grid;place-items:center;width:38px;height:42px;border:1px solid transparent;border-radius:0;background:var(--paper);color:var(--ink);font:800 12px/1 system-ui,sans-serif;transition:none}
.design-rail button:hover{border-color:var(--ink)}
.design-rail button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.design-rail button:focus-visible{outline:3px solid var(--lime);outline-offset:2px}
.design-rail__progress{position:absolute;right:0;top:0;width:3px;height:var(--scroll-progress,0%);background:var(--lime);pointer-events:none;transition:height .12s linear}
.accent-mark{display:inline-block;vertical-align:baseline;margin-left:.11em;width:.11em;height:.11em;background:var(--lime);border-radius:0;transform:translateY(-.06em)}
html[data-design] body{transition:none}
/* Theme changes must never crossfade text against the previous theme */
html[data-design] .pill-button{transition:transform .25s var(--ease)}
html[data-design] .filter-pill span{transition:none}
html[data-design] .project-card__image img,html[data-design] .gallery-open img,
html[data-design] .case-cover img{filter:none!important;mix-blend-mode:normal;}
html[data-design] .project-card__image img,html[data-design] .case-cover img{object-position:var(--image-position,center top)}
html[data-design] .gallery-item--full img{height:auto;max-height:none;object-fit:contain}
html[data-design] .gallery-open img{max-width:100%}
html[data-design] .case-cover__inner,html[data-design] .case-body__main,
html[data-design] .contact-form-panel,html[data-design] .about-copy{min-width:0}
/* Highlight focus with the chosen accent on every navigable surface */
html[data-design] :focus-visible{outline:3px solid var(--lime);outline-offset:4px}
html[data-design] .filter-pill input:focus-visible+span{outline-color:var(--lime)}
html[data-design] .status-dot{background:var(--lime);box-shadow:none}
html[data-design] .filter-pill input:checked+span{background:var(--ink);color:var(--paper);border-color:var(--ink)}
html[data-design] .form-field input:focus,html[data-design] .form-field textarea:focus,
html[data-design] .form-field select:focus{border-color:var(--lime)}
html[data-design] .consent-field input{accent-color:var(--lime)}
/* Screenshots always retain their own white canvas, even in dark themes */
html[data-design] .mock-browser,html[data-design] .device-frame--desktop,
html[data-design] .device-frame--mobile{background:#fff}
html[data-design] .mock-browser>img,html[data-design] .device-frame img{background:#fff}
html[data-design] .hero-phone{background:#fff;color:#111}
html[data-design] .gallery-open img{background:transparent}
html[data-design] .lightbox{background:#12161b;color:#fff}
html[data-design] .lightbox::backdrop{background:#12161b}

/* 01 — Original untouched: all base styles remain authoritative */
html[data-design="1"]{--paper:#f7f7f2;--white:#fff;--ink:#171b1b;--muted:#6d7472;--border:#dadcd6;--lime:#d9ff64;--gray:#eceee8;--deep:#1d2422}

/* 02 — EDITORIAL ATELIER
   An editorial spread: serif headlines, narrow marginalia, asymmetrical images,
   hairline rules and generous image captions on warm paper
*/
html[data-design="2"]{--paper:#f5f0e7;--white:#fffdfa;--ink:#202e49;--muted:#565f70;--border:#b6b8b7;--lime:#5274ff;--gray:#eae2d5;--deep:#202e49;--shell:min(1380px,calc(100% - 140px));color-scheme:light}
html[data-design="2"] body{font-family:'Liberation Serif','DejaVu Serif',Georgia,serif;background:var(--paper)}
html[data-design="2"] :is(.section-kicker,.eyebrow,.tiny-label,.wordmark,.main-nav,.pill-button,.text-link,.inline-arrow,.filter-row,.type-filter,.meta-line,.tag-list,.design-rail,.service-number,.service-end,.case-header__aside,.breadcrumb,.form-field,.form-top,.contact-methods,.footer-bottom,.browser-top,.results-bar,.pagination,.gallery-item figcaption,.case-cover__label,.direction-top,.direction-bottom,.next-work__button,.demo-marker){font-family:'Liberation Sans','DejaVu Sans',Arial,sans-serif}
html[data-design="2"] :is(.section-heading h2,.directions h2,.closing h2,.site-footer h2,.page-hero h1,.contact-intro h1,.case-header h1,.next-work__link h2){font-family:'Liberation Serif','DejaVu Serif',Georgia,serif;font-weight:400;letter-spacing:-.055em;line-height:1.05}
html[data-design="2"] :is(.section-heading h2 em,.directions h2 em,.closing h2 em,.site-footer h2 em,.page-hero h1 em,.contact-intro h1 em){font-style:italic;color:var(--muted)}
html[data-design="2"] .site-header{border-bottom:1px solid var(--ink);background:var(--paper)}
html[data-design="2"] .header-inner{min-height:98px}
html[data-design="2"] .brand-symbol{border-radius:0;background:var(--lime);color:#fff;transform:rotate(-10deg)}
html[data-design="2"] .wordmark{font-size:17px;font-weight:700;letter-spacing:-.02em}
html[data-design="2"] .main-nav>a{font-weight:500}
html[data-design="2"] .main-nav .nav-contact{border-radius:0;border-bottom:2px solid var(--ink);border-top:0;border-inline:0}
html[data-design="2"] .pill-button{border-radius:0;font-weight:700;min-height:56px}
html[data-design="2"] .pill-dark{background:var(--ink);color:#fff}
html[data-design="2"] .pill-dark:hover{background:#344c76}
html[data-design="2"] .pill-lime{background:#3659d2;color:#fff}
html[data-design="2"] .pill-outline{border-color:var(--ink)}
html[data-design="2"] .pill-outline:hover{color:#fff}
html[data-design="2"] .hero{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:5%;min-height:760px;padding-block:90px 115px;align-items:start}
html[data-design="2"] .hero-copy{justify-content:flex-start;padding-top:45px}
html[data-design="2"] .eyebrow{color:var(--ink);border-bottom:1px solid var(--border);padding-bottom:18px;width:100%}
html[data-design="2"] .eyebrow-index{color:var(--ink)}
html[data-design="2"] .hero h1{font-family:'Liberation Serif','DejaVu Serif',Georgia,serif;font-size:clamp(54px,5.6vw,94px);font-weight:400;letter-spacing:-.07em;line-height:1.025;margin:47px 0 28px}
html[data-design="2"] .hero-lede{font-size:clamp(16px,1.3vw,20px);line-height:1.65;max-width:430px;color:var(--muted)}
html[data-design="2"] .hero-footnote{color:var(--muted);border-top:1px solid var(--border);margin-top:56px;padding-top:15px}
html[data-design="2"] .hero-art{height:625px;margin-top:20px}
html[data-design="2"] .hero-art__grid{display:none}
html[data-design="2"] .hero-browser{width:91%;height:385px;right:0;top:0;transform:rotate(0);box-shadow:12px 12px 0 #d6d8dc}
html[data-design="2"] .hero-crm{width:76%;height:230px;left:0;bottom:42px;transform:rotate(0);box-shadow:12px 12px 0 #e2d7c5;z-index:2}
html[data-design="2"] .hero-phone{right:0;bottom:0;transform:none;width:105px;height:211px}
html[data-design="2"] .hero-caption{top:auto;bottom:0;left:0;transform:translateY(36px);color:var(--muted)}
html[data-design="2"] .art-index{right:0;bottom:-35px;color:var(--muted)}
html[data-design="2"] .stats{background:var(--deep)}
html[data-design="2"] .stats-inner{min-height:175px;grid-template-columns:repeat(3,1fr) auto}
html[data-design="2"] .stats strong{font-family:'Liberation Serif',serif;font-weight:400;font-size:70px}
html[data-design="2"] .stats strong span{color:#93a8ff}
html[data-design="2"] .section{padding-block:140px}
html[data-design="2"] .section-heading{align-items:start;border-top:1px solid var(--ink);padding-top:18px;gap:10%}
html[data-design="2"] .section-heading h2{font-size:clamp(48px,5.5vw,86px)}
html[data-design="2"] .section-heading__aside{padding-top:50px}
html[data-design="2"] .featured-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:100px 36px}
html[data-design="2"] .featured-grid>.project-card--wide{grid-column:1/-1}
html[data-design="2"] .featured-grid>.project-card:nth-child(3){margin-top:120px}
html[data-design="2"] .project-card__visual{border:1px solid var(--border);background:#e6dfd2}
html[data-design="2"] .project-card__image{background:#e6dfd2}
html[data-design="2"] .project-card__info{border-top:1px solid var(--ink);margin-top:18px;padding-top:15px}
html[data-design="2"] .project-card h3{font-family:'Liberation Serif','DejaVu Serif',serif;font-size:clamp(26px,2.9vw,43px);font-weight:400;letter-spacing:-.05em}
html[data-design="2"] .project-card__info p{font-size:14px;color:var(--muted)}
html[data-design="2"] .meta-line{color:var(--muted)}
html[data-design="2"] .round-arrow{border-radius:0;border-color:var(--ink)}
html[data-design="2"] .more-work{border-top:1px solid var(--ink)}
html[data-design="2"] .directions{background:#e9e2d7;padding-block:125px}
html[data-design="2"] .directions-intro{border-top:1px solid var(--ink);padding-top:20px}
html[data-design="2"] .direction-cards{gap:65px;align-items:start}
html[data-design="2"] .direction-card{min-height:690px;border:1px solid var(--border);padding:28px 30px;background:#f7f3eb;color:var(--ink)}
html[data-design="2"] .direction-card--crm{margin-top:95px;background:#e1e6f5;color:var(--ink)}
html[data-design="2"] .direction-card--site>p{color:#4d584f}
html[data-design="2"] .direction-card--crm>p{color:#48566e}
html[data-design="2"] .direction-card .direction-top,html[data-design="2"] .direction-card .direction-bottom{border-color:var(--ink)}
html[data-design="2"] .direction-card h3{font-family:'Liberation Serif',serif;font-weight:400;letter-spacing:-.06em}
html[data-design="2"] .direction-image{background:#fff}
html[data-design="2"] .closing{border-top:1px solid var(--ink)}
html[data-design="2"] .site-footer{background:var(--ink);color:#fff}
html[data-design="2"] .site-footer h2 em{color:#b7c2eb}
/* Atelier / catalog: marginal filter column + asymmetric editorial archive */
html[data-design="2"] .catalog-intro{padding-block:108px 95px;border-bottom:1px solid var(--ink)}
html[data-design="2"] .catalog-head{align-items:end}
html[data-design="2"] .catalog-head h1{font-family:'Liberation Serif',serif;font-weight:400;font-size:clamp(85px,13vw,186px);letter-spacing:-.085em}
html[data-design="2"] .catalog-head>p{font-size:17px;color:var(--muted);max-width:340px}
html[data-design="2"] .catalog-wrap{display:grid;grid-template-columns:minmax(180px,250px) minmax(0,1fr);gap:5%;align-items:start;padding-top:38px}
html[data-design="2"] .filters{border-top:0;position:sticky;top:24px;padding:0 0 25px}
html[data-design="2"] .type-filter{flex-direction:column;align-items:stretch;gap:0;border-top:1px solid var(--border)}
html[data-design="2"] .filter-pill span{padding:14px 0;border:0;border-bottom:1px solid var(--border);font-size:13px;background:transparent}
html[data-design="2"] .filter-pill input:checked+span{color:var(--ink);background:#e4e9ff;border-color:var(--lime)}
html[data-design="2"] .filter-row{display:grid;grid-template-columns:minmax(0,1fr);gap:17px}
html[data-design="2"] .field-inline{min-width:0;color:var(--ink)}
html[data-design="2"] .field-inline :is(select,input){background-color:transparent;border:1px solid var(--border)}
html[data-design="2"] #catalog-content{min-width:0}
html[data-design="2"] .results-bar{border-top:1px solid var(--ink);padding-top:18px;color:var(--muted)}
html[data-design="2"] .catalog-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:68px 23px}
html[data-design="2"] .catalog-grid>.project-card:nth-child(4n + 2){margin-top:94px}
html[data-design="2"] .catalog-grid>.project-card:nth-child(4n + 3){grid-column:1/-1;margin-block:20px}
html[data-design="2"] .catalog-grid>.project-card:nth-child(4n + 3) .project-card__image{padding-bottom:48%}
html[data-design="2"] .pagination{border-top:1px solid var(--ink)}
/* Atelier / case: wide image first, article as magazine columns */
html[data-design="2"] .case-header{padding-block:30px 93px}
html[data-design="2"] .breadcrumb{color:var(--muted)}
html[data-design="2"] .case-header__body{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(140px,.5fr);gap:7%;align-items:end;margin-top:95px}
html[data-design="2"] .case-header h1{font-size:clamp(70px,8.3vw,132px);font-weight:400;letter-spacing:-.075em}
html[data-design="2"] .case-header__body p{color:var(--muted);font-size:20px;max-width:620px}
html[data-design="2"] .case-header__aside{border-top:1px solid var(--ink);padding-top:18px;margin:0}
html[data-design="2"] .case-cover{background:#e8dfd2;padding:60px 0}
html[data-design="2"] .case-cover__inner{border:0;padding:20px;background:#fffdfa;box-shadow:22px 22px 0 #d3d0d0}
html[data-design="2"] .case-cover__label{color:var(--ink)}
html[data-design="2"] .case-body{grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:10%;padding-block:140px}
html[data-design="2"] .case-body__index{position:sticky;top:35px;align-self:start;border-top:1px solid var(--ink);padding-top:17px}
html[data-design="2"] .case-copy{padding-bottom:65px;margin-bottom:65px}
html[data-design="2"] .case-copy h2{font-family:'Liberation Serif',serif;font-size:clamp(36px,4vw,59px);font-weight:400}
html[data-design="2"] .prose{font-family:'Liberation Serif',serif;font-size:19px;line-height:1.8;color:var(--muted)}
html[data-design="2"] .module-row{grid-template-columns:35px 1fr 20px;border-bottom:1px solid var(--ink)}
html[data-design="2"] .gallery-section{background:#eee8dd;padding:130px 0}
html[data-design="2"] .gallery-grid{grid-template-columns:1.2fr .8fr;gap:85px 40px}
html[data-design="2"] .gallery-item:nth-child(3n + 2):not(.gallery-item--full){margin-top:75px}
html[data-design="2"] .gallery-open{background:#fff;padding:14px;border:1px solid var(--border)}
html[data-design="2"] .gallery-item figcaption{border-top:1px solid var(--ink);padding-top:12px;color:var(--muted)}
html[data-design="2"] .device-canvas{background:#e3dacc}
html[data-design="2"] .next-work{background:var(--deep);color:#fff}
html[data-design="2"] .next-work__link{grid-template-columns:1.25fr .75fr}
html[data-design="2"] .next-work__link h2{font-size:clamp(55px,6vw,95px)}
/* Atelier / secondary pages */
html[data-design="2"] .page-hero{border-bottom:1px solid var(--ink);padding-block:110px 100px}
html[data-design="2"] .page-hero h1{font-size:clamp(65px,7.5vw,120px);max-width:970px}
html[data-design="2"] .page-hero>p{font-family:'Liberation Serif',serif;font-size:19px;color:var(--muted)}
html[data-design="2"] .services-list{border-top:0;display:grid;grid-template-columns:1fr 1fr;gap:0 55px;padding-top:40px}
html[data-design="2"] .service-row{grid-template-columns:42px minmax(0,1fr);gap:17px;border-top:1px solid var(--ink);padding:32px 0 52px;transition:none}
html[data-design="2"] .service-row:hover{padding-left:0}
html[data-design="2"] .service-row h2{font-family:'Liberation Serif',serif;font-weight:400;font-size:clamp(27px,3vw,42px)}
html[data-design="2"] .service-row p{font-size:15px;color:var(--muted)}
html[data-design="2"] .service-number,html[data-design="2"] .service-end a,html[data-design="2"] .service-disclaimer{color:#48566e}
html[data-design="2"] .service-end{grid-column:2;align-items:flex-start;flex-direction:row;flex-wrap:wrap}
html[data-design="2"] .service-disclaimer{grid-column:1/-1}
html[data-design="2"] .about-head{border:0;padding-bottom:60px}
html[data-design="2"] .about-layout{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:8%}
html[data-design="2"] .about-visual{aspect-ratio:3/4}
html[data-design="2"] .about-typographic{background:#dad8ce;color:var(--ink);border:1px solid var(--ink)}
html[data-design="2"] .about-typographic strong{font-family:'Liberation Serif',serif;font-weight:400;font-size:clamp(40px,5vw,80px)}
html[data-design="2"] .about-squares span:first-child{background:var(--lime);color:#fff}
html[data-design="2"] .about-copy{border-top:1px solid var(--ink);padding-top:27px}
html[data-design="2"] .about-copy h2{font-family:'Liberation Serif',serif;font-weight:400;font-size:50px}
html[data-design="2"] .about-fact p{font-size:16px;color:var(--muted)}
html[data-design="2"] .contact-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:10%;padding-block:130px}
html[data-design="2"] .contact-intro h1{font-size:clamp(60px,6.5vw,105px)}
html[data-design="2"] .contact-intro>p{font-family:'Liberation Serif',serif;font-size:18px;color:var(--muted)}
html[data-design="2"] .contact-form-panel{background:transparent;border:1px solid var(--ink);padding:40px}
html[data-design="2"] .form-field input,html[data-design="2"] .form-field textarea,html[data-design="2"] .form-field select{background:transparent;color:var(--ink);border-color:var(--border)}
html[data-design="2"] .form-field label,html[data-design="2"] .consent-field label{color:var(--muted)}
html[data-design="2"] .form-top,html[data-design="2"] .case-header__aside>span{color:var(--muted)}
html[data-design="2"] .legal-page h1{font-family:'Liberation Serif',serif;font-weight:400}

/* 03 — NIGHT SHIFT
   Interface laboratory: dashboard-dominant hierarchy, monospace coordinates,
   illuminated amber controls. Screenshots are kept in unfiltered white frames
*/
html[data-design="3"]{--paper:#14191f;--white:#1c242c;--ink:#f4f2eb;--muted:#b7c2c8;--border:#485762;--lime:#ffb44f;--gray:#202a33;--deep:#0c1015;--shell:min(1460px,calc(100% - 120px));color-scheme:dark}
html[data-design="3"] body{background:var(--paper);color:var(--ink);font-family:'Liberation Sans','DejaVu Sans',Arial,sans-serif}
html[data-design="3"] :is(.section-kicker,.eyebrow,.tiny-label,.meta-line,.case-header__aside,.results-bar,.service-number,.form-top,.gallery-item figcaption,.device-switch,.browser-top,.footer-bottom,.stats-aside,.design-rail,.direction-top,.direction-bottom){font-family:'Liberation Mono','DejaVu Sans Mono',monospace;letter-spacing:.045em}
html[data-design="3"] :is(.section-heading h2,.page-hero h1,.contact-intro h1,.case-header h1,.next-work__link h2){font-weight:650;letter-spacing:-.075em}
html[data-design="3"] :is(.section-heading h2 em,.directions h2 em,.closing h2 em,.site-footer h2 em,.page-hero h1 em,.contact-intro h1 em){font-style:normal;color:var(--lime)}
html[data-design="3"] .site-header{background:#0d1218;border-color:var(--border)}
html[data-design="3"] .header-inner{min-height:79px}
html[data-design="3"] .brand-symbol{background:var(--lime);color:#17191c;border-radius:0}
html[data-design="3"] .main-nav .nav-contact{border-color:var(--lime);color:var(--lime);border-radius:0}
html[data-design="3"] .main-nav>a{color:var(--ink)}
html[data-design="3"] .pill-dark,html[data-design="3"] .filter-submit{background:var(--lime);color:#1a1c1e}
html[data-design="3"] .pill-dark:hover{background:#ffd28d}
html[data-design="3"] .pill-outline{border-color:var(--border);color:var(--ink)}
html[data-design="3"] .pill-outline:hover{background:var(--lime);color:#17191c}
html[data-design="3"] .pill-lime{color:#191919}
html[data-design="3"] .text-link{border-color:var(--lime)}
html[data-design="3"] .eyebrow,html[data-design="3"] .eyebrow-index{color:var(--lime)}
html[data-design="3"] .hero{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:3%;padding-block:110px;min-height:720px}
html[data-design="3"] .hero-copy{border-left:2px solid var(--lime);padding-left:24px;align-self:stretch}
html[data-design="3"] .hero h1{font-size:clamp(46px,4.8vw,77px);line-height:1.09;letter-spacing:-.085em}
html[data-design="3"] .hero-lede{color:var(--muted);font-size:15px;max-width:400px}
html[data-design="3"] .hero-footnote{color:var(--muted);border-top:1px solid var(--border);padding-top:15px}
html[data-design="3"] .hero-art{height:550px}
html[data-design="3"] .hero-art__grid{background-image:linear-gradient(#ffb44f16 1px,transparent 1px),linear-gradient(90deg,#ffb44f16 1px,transparent 1px);background-size:25px 25px}
html[data-design="3"] .hero-browser{width:91%;height:365px;right:0;top:0;transform:none;border-color:var(--border);box-shadow:0 0 0 1px var(--lime)}
html[data-design="3"] .hero-crm{width:82%;height:270px;left:0;bottom:0;transform:none;border:2px solid var(--lime);box-shadow:0 25px 45px #0008;z-index:3}
html[data-design="3"] .hero-phone{right:0;bottom:0;transform:none;z-index:4}
html[data-design="3"] .hero-caption{color:var(--lime);top:-25px;left:0}
html[data-design="3"] .art-index{right:0;bottom:-26px;color:var(--muted)}
html[data-design="3"] .stats{background:#0c1015;border-block:1px solid var(--border)}
html[data-design="3"] .stats-inner{min-height:174px}
html[data-design="3"] .stats strong{font-family:'Liberation Mono',monospace;font-size:clamp(34px,3.7vw,60px)}
html[data-design="3"] .stats strong span{color:var(--lime)}
html[data-design="3"] .stats-inner>div>span,html[data-design="3"] .stats-aside{color:#c5cdd1}
html[data-design="3"] .section{padding-block:120px}
html[data-design="3"] .section-heading{border-bottom:1px solid var(--border);padding-bottom:34px}
html[data-design="3"] .section-heading__aside p,html[data-design="3"] .project-card__info p{color:var(--muted)}
html[data-design="3"] .featured-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:42px 22px}
html[data-design="3"] .featured-grid>.project-card{grid-column:span 6}
html[data-design="3"] .featured-grid>.project-card--wide{grid-column:1/-1}
html[data-design="3"] .project-card--crm:not(.project-card--wide){grid-column:span 8}
html[data-design="3"] .project-card--crm:not(.project-card--wide)+.project-card:not(.project-card--wide){grid-column:span 4}
html[data-design="3"] .project-card__visual{background:#263441;border:1px solid var(--border);padding:7px}
html[data-design="3"] .project-card__image,html[data-design="3"] .project-card__image--crm{background:#fff}
html[data-design="3"] .project-card--crm .project-card__image{padding-bottom:56%}
html[data-design="3"] .project-card__info{border-top:1px solid var(--border);padding-top:17px;margin-top:10px}
html[data-design="3"] .project-card h3{font-weight:600}
html[data-design="3"] .meta-line,html[data-design="3"] .meta-line span+span:before{color:var(--lime)}
html[data-design="3"] .tag-list>span{border-color:var(--border);color:var(--muted)}
html[data-design="3"] .round-arrow{border-radius:0;border-color:var(--lime);color:var(--lime)}
html[data-design="3"] .visual-cta,html[data-design="3"] .zoom-mark,html[data-design="3"] .success-symbol{color:#17191c}
html[data-design="3"] .more-work{border-color:var(--border)}
html[data-design="3"] .directions{background:#101821;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
html[data-design="3"] .direction-cards{grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
html[data-design="3"] .direction-card--site{grid-column:span 5;background:#202b35;color:var(--ink);border:1px solid var(--border)}
html[data-design="3"] .direction-card--crm{grid-column:span 7;background:#282c32;color:var(--ink);border:1px solid var(--lime)}
html[data-design="3"] .direction-card .direction-top,html[data-design="3"] .direction-card .direction-bottom{border-color:var(--border)}
html[data-design="3"] .direction-card>p{color:var(--muted)}
html[data-design="3"] .closing{border-top:1px solid var(--border)}
html[data-design="3"] .site-footer,html[data-design="3"] .next-work{background:#080c11}
html[data-design="3"] .site-footer h2 em{color:var(--lime)}
/* Night / catalog: technical filter command bar and dashboard-scale CRM */
html[data-design="3"] .catalog-intro{border-bottom:1px solid var(--border);padding-block:85px 70px}
html[data-design="3"] .catalog-head h1{font-weight:700;font-size:clamp(73px,10vw,142px);letter-spacing:-.095em}
html[data-design="3"] .catalog-head>p{color:var(--muted)}
html[data-design="3"] .catalog-wrap{padding-top:28px}
html[data-design="3"] .filters{border:1px solid var(--border);padding:19px 24px;background:var(--gray)}
html[data-design="3"] .type-filter{margin-bottom:18px}
html[data-design="3"] .filter-pill span{background:#171e26;color:var(--ink);border-color:var(--border)}
html[data-design="3"] .filter-pill input:checked+span{background:var(--lime);border-color:var(--lime);color:#17191c}
html[data-design="3"] .field-inline{color:var(--muted)}
html[data-design="3"] .field-inline :is(select,input){background-color:#141a22;color:var(--ink);border-color:var(--border)}
html[data-design="3"] .filter-submit{border-color:var(--lime)}
html[data-design="3"] .results-bar{color:var(--muted);border-bottom:1px solid var(--border);padding-block:26px}
html[data-design="3"] .catalog-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:38px 20px;padding-top:26px}
html[data-design="3"] .catalog-grid>.project-card{grid-column:span 6}
html[data-design="3"] .catalog-grid>.project-card--crm{grid-column:span 12}
html[data-design="3"] .catalog-grid>.project-card--crm .project-card__image{padding-bottom:40%}
html[data-design="3"] .pagination{border-color:var(--border)}
/* Night / case: CRM makes room for the actual readable dashboard */
html[data-design="3"] .case-header{padding-block:30px 62px}
html[data-design="3"] .breadcrumb{color:var(--muted)}
html[data-design="3"] .case-header__body{display:grid;grid-template-columns:minmax(0,1fr) 180px;gap:8%;margin-top:65px}
html[data-design="3"] .case-header h1{font-size:clamp(55px,7vw,108px)}
html[data-design="3"] .case-header__body p{color:var(--muted)}
html[data-design="3"] .case-header__aside{border-left:1px solid var(--lime);padding-left:20px}
html[data-design="3"] .case-header__aside>span,html[data-design="3"] .case-cover__label{color:var(--muted)}
html[data-design="3"] .demo-notice{background:#2d2b20;border-color:var(--lime);color:var(--ink)}
html[data-design="3"] .case-cover{background:#0e151d;padding:65px 0 55px;border-block:1px solid var(--border)}
html[data-design="3"] .case-cover__inner{width:min(100% - 80px,1420px);max-width:1420px;padding:10px;background:#26313b;border:1px solid var(--border);box-shadow:0 24px 72px #000a}
html[data-design="3"] .case[data-project-kind="crm"] .case-cover__inner{width:min(100% - 40px,1550px);max-width:1550px;padding:5px;border-color:var(--lime)}
html[data-design="3"] .case-cover__inner>img{max-height:unset;max-width:100%;background:#fff}
html[data-design="3"] .case-body{grid-template-columns:200px minmax(0,1fr);gap:8%;padding-block:100px}
html[data-design="3"] .case-body__index{border-top:1px solid var(--lime);padding-top:16px;color:var(--lime)}
html[data-design="3"] .case-copy{border-color:var(--border)}
html[data-design="3"] .case-copy h2{font-size:clamp(28px,3vw,46px)}
html[data-design="3"] .case-copy>.section-kicker{color:var(--lime)}
html[data-design="3"] .prose,html[data-design="3"] .module-row p{color:var(--muted)}
html[data-design="3"] .module-row{border-color:var(--border);grid-template-columns:55px 1fr 24px}
html[data-design="3"] .module-row>span{color:var(--lime)}
html[data-design="3"] .gallery-section{background:#172029;border-top:1px solid var(--border)}
html[data-design="3"] .gallery-heading>p{color:var(--muted)}
html[data-design="3"] .gallery-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:45px 22px}
html[data-design="3"] .gallery-item{grid-column:span 6}
html[data-design="3"] .gallery-item--full,html[data-design="3"] .case[data-project-kind="crm"] .gallery-item{grid-column:1/-1}
html[data-design="3"] .gallery-open{background:#27323d;padding:8px;border:1px solid var(--border)}
html[data-design="3"] .gallery-item figcaption{color:var(--muted);border-top:1px solid var(--border);padding-top:12px}
html[data-design="3"] .device-canvas{background:#0c131a;border:1px solid var(--border)}
html[data-design="3"] .switch-controls{border-color:var(--border)}
html[data-design="3"] .switch-controls button{color:var(--ink)}
html[data-design="3"] .switch-controls button.active{background:var(--lime);color:#17191c}
html[data-design="3"] .next-work__link{grid-template-columns:.75fr 1.25fr}
html[data-design="3"] .next-work__image{border:1px solid var(--border)}
html[data-design="3"] .next-work__link p{color:var(--muted)}
/* Night / secondary pages: dark panels rather than simply inverted background */
html[data-design="3"] .page-hero{border-left:2px solid var(--lime);margin-top:85px;padding:25px 0 60px 38px}
html[data-design="3"] .page-hero h1{max-width:1050px}
html[data-design="3"] .page-hero>p{color:var(--muted)}
html[data-design="3"] .services-list{border-color:var(--border);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px;padding-top:22px}
html[data-design="3"] .service-row{grid-column:span 6;display:grid;grid-template-columns:45px 1fr;gap:15px;background:#1d2630;border:1px solid var(--border);padding:29px 28px;transition:border-color .2s}
html[data-design="3"] .service-row:hover{padding-left:28px;border-color:var(--lime)}
html[data-design="3"] .service-number{color:var(--lime)}
html[data-design="3"] .service-row h2{font-size:clamp(25px,2.6vw,37px)}
html[data-design="3"] .service-row p,html[data-design="3"] .service-tasks{color:var(--muted)}
html[data-design="3"] .service-end{grid-column:2;flex-direction:row;align-items:start;flex-wrap:wrap;gap:19px}
html[data-design="3"] .service-end a:first-child{color:var(--muted)}
html[data-design="3"] .service-disclaimer{grid-column:1/-1;color:var(--muted)}
html[data-design="3"] .about-head{border:0;margin-top:0;padding-left:0}
html[data-design="3"] .about-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:5%}
html[data-design="3"] .about-visual{aspect-ratio:1/1;align-self:start;border:1px solid var(--border)}
html[data-design="3"] .about-typographic{background:#18232f;color:var(--ink);min-height:480px}
html[data-design="3"] .about-typographic strong{font-family:'Liberation Mono',monospace;font-size:clamp(24px,3.1vw,50px);letter-spacing:-.07em}
html[data-design="3"] .about-squares span:first-child{background:var(--lime);color:#17191c}
html[data-design="3"] .about-typographic small{color:var(--muted)}
html[data-design="3"] .about-copy{border-left:1px solid var(--lime);padding:15px 0 0 35px}
html[data-design="3"] .about-fact{border-color:var(--border)}
html[data-design="3"] .about-fact>span,html[data-design="3"] .contact-methods>div>span{color:var(--lime)}
html[data-design="3"] .about-fact p{color:var(--muted)}
html[data-design="3"] .contact-layout{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:4%;padding-block:100px}
html[data-design="3"] .contact-intro{border-left:2px solid var(--lime);padding-left:25px}
html[data-design="3"] .contact-intro h1{font-size:clamp(46px,5.6vw,87px)}
html[data-design="3"] .contact-intro>p{color:var(--muted)}
html[data-design="3"] .contact-methods{margin-top:75px}
html[data-design="3"] .contact-methods>div{border-color:var(--border)}
html[data-design="3"] .contact-form-panel{background:#1d2630;border:1px solid var(--border)}
html[data-design="3"] .form-top{color:var(--muted);border-color:var(--border)}
html[data-design="3"] .form-field label,html[data-design="3"] .consent-field label,html[data-design="3"] .success-panel p{color:var(--muted)}
html[data-design="3"] .form-field :is(input,textarea,select){background:transparent;border-color:var(--border);color:var(--ink)}
html[data-design="3"] .form-field :is(input,textarea)::placeholder{color:#b2bdc5}
html[data-design="3"] .success-symbol{color:#17191c}
html[data-design="3"] .legal-page h1{color:var(--ink)}
html[data-design="3"] .legal-warning,html[data-design="3"] .empty-panel{background:#26323c;color:var(--ink);border:1px solid var(--border)}
html[data-design="3"] .empty-panel p{color:var(--muted)}
html[data-design="3"] .preview-alert{background:#3d3425;color:#fff}

/* 04 — GRIDLINE
   Twelve equal columns, rigid cells, strong baseline, hard cuts and zero shadows
*/
html[data-design="4"]{--paper:#fafafa;--white:#fff;--ink:#111;--muted:#595959;--border:#a5a5a5;--lime:#e43f36;--gray:#eee;--deep:#171717;--shell:min(1520px,calc(100% - 104px));color-scheme:light}
html[data-design="4"] body{font-family:'Liberation Sans','DejaVu Sans',Arial,sans-serif}
html[data-design="4"] :is(.section-heading h2,.directions h2,.closing h2,.site-footer h2,.page-hero h1,.contact-intro h1,.case-header h1,.project-card h3,.service-row h2,.next-work__link h2){font-weight:900;letter-spacing:-.085em;text-transform:uppercase;line-height:1.02}
html[data-design="4"] :is(.section-heading h2 em,.directions h2 em,.closing h2 em,.site-footer h2 em,.page-hero h1 em,.contact-intro h1 em){color:var(--lime);font-style:normal}
html[data-design="4"] :is(.site-header,.filters,.project-card__info,.direction-card,.contact-form-panel,.mock-browser,.project-card__visual,.about-visual,.round-arrow,.pill-button,.nav-contact,.hero-phone){border-radius:0;box-shadow:none}
html[data-design="4"] .site-header{border-bottom:2px solid var(--ink)}
html[data-design="4"] .header-inner{min-height:82px}
html[data-design="4"] .brand-symbol{border-radius:0;background:var(--lime);color:#fff}
html[data-design="4"] .wordmark{font-weight:900;font-size:17px;text-transform:uppercase}
html[data-design="4"] .main-nav{gap:0;align-self:stretch}
html[data-design="4"] .main-nav>a{display:flex;align-items:center;padding:0 22px;border-left:1px solid var(--border);text-transform:uppercase;font-weight:800;font-size:11px}
html[data-design="4"] .main-nav .nav-contact{border:0;border-inline:1px solid var(--ink);background:#c92d26;color:#fff}
html[data-design="4"] .pill-button{font-weight:900;min-height:54px}
html[data-design="4"] .pill-dark{background:var(--ink);color:#fff}
html[data-design="4"] .pill-lime{background:#c92d26;color:#fff}
html[data-design="4"] .pill-outline:hover{color:#fff}
html[data-design="4"] .hero{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:15px;row-gap:0;min-height:680px;padding-block:73px 100px;border-bottom:2px solid var(--ink)}
html[data-design="4"] .hero-copy{grid-column:1/7;border-top:2px solid var(--ink);padding:15px 0 0;justify-content:start}
html[data-design="4"] .hero-art{grid-column:7/-1;margin-left:18px;border-left:2px solid var(--ink);padding-left:18px;height:500px}
html[data-design="4"] .hero h1{font-size:clamp(44px,4.8vw,81px);margin:40px 0 19px;font-weight:900;text-transform:uppercase;line-height:1.02}
html[data-design="4"] .hero-lede{color:var(--muted);font-size:14px;max-width:410px}
html[data-design="4"] .eyebrow, html[data-design="4"] .eyebrow-index{color:var(--ink)}
html[data-design="4"] .hero-footnote{margin-top:38px;padding-top:10px;border-top:2px solid var(--ink);color:var(--muted)}
html[data-design="4"] .hero-art__grid{display:none}
html[data-design="4"] .hero-browser{width:94%;height:315px;right:0;top:0;transform:none;border:2px solid var(--ink)}
html[data-design="4"] .hero-crm{width:82%;height:200px;left:0;bottom:0;transform:none;border:2px solid var(--ink)}
html[data-design="4"] .hero-phone{width:90px;height:185px;right:0;bottom:0;transform:none;border-radius:0}
html[data-design="4"] .hero-caption{top:auto;bottom:-33px;left:0;font-size:9px}
html[data-design="4"] .art-index{display:none}
html[data-design="4"] .stats{background:var(--paper);color:var(--ink);border-bottom:2px solid var(--ink)}
html[data-design="4"] .stats-inner{grid-template-columns:repeat(3,minmax(0,1fr)) auto;min-height:155px;gap:0}
html[data-design="4"] .stats-inner>div{align-items:center;border-right:2px solid var(--ink);padding:20px;gap:15px}
html[data-design="4"] .stats strong{font-size:clamp(39px,4vw,66px);font-weight:900}
html[data-design="4"] .stats strong span{color:var(--lime)}
html[data-design="4"] .stats-inner>div>span, html[data-design="4"] .stats-aside{color:var(--muted)}
html[data-design="4"] .stats-aside{padding-inline:20px}
html[data-design="4"] .section{padding-block:105px}
html[data-design="4"] .section-heading{border-top:2px solid var(--ink);padding-top:16px;margin-bottom:38px}
html[data-design="4"] .section-heading h2{font-size:clamp(45px,5.2vw,84px)}
html[data-design="4"] .section-heading__aside p, html[data-design="4"] .project-card__info p{color:var(--muted)}
html[data-design="4"] .featured-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:35px 15px}
html[data-design="4"] .featured-grid>.project-card{grid-column:span 6}
html[data-design="4"] .featured-grid>.project-card--wide{grid-column:1/-1}
html[data-design="4"] .project-card__visual{border:2px solid var(--ink);background:var(--gray)}
html[data-design="4"] .project-card__image{background:#eee}
html[data-design="4"] .project-card__info{border-top:2px solid var(--ink);margin-top:8px;padding-top:12px}
html[data-design="4"] .project-card h3{font-size:clamp(22px,2.3vw,36px);margin:9px 0}
html[data-design="4"] .meta-line{color:var(--muted)}
html[data-design="4"] .round-arrow{border:2px solid var(--ink);border-radius:0}
html[data-design="4"] .tag-list>span{border:1px solid var(--border)}
html[data-design="4"] .more-work{border-top:2px solid var(--ink)}
html[data-design="4"] .directions{background:#efefef;border-block:2px solid var(--ink)}
html[data-design="4"] .directions-intro{border-top:2px solid var(--ink);padding-top:18px}
html[data-design="4"] .direction-cards{gap:16px}
html[data-design="4"] .direction-card{background:#fafafa;color:var(--ink);border:2px solid var(--ink)}
html[data-design="4"] .direction-card--crm{background:#191919;color:#fff}
html[data-design="4"] .direction-card .direction-top,html[data-design="4"] .direction-card .direction-bottom{border-color:currentColor}
html[data-design="4"] .direction-card h3{font-weight:900;text-transform:uppercase;letter-spacing:-.08em}
html[data-design="4"] .direction-card--crm>p{color:#dedede}
html[data-design="4"] .closing{border-top:2px solid var(--ink)}
html[data-design="4"] .site-footer{background:var(--ink);color:#fff}
html[data-design="4"] .site-footer h2 em{color:var(--lime)}
/* Gridline / catalog: left-stacked sidebar + 12-column archive */
html[data-design="4"] .catalog-intro{border-bottom:2px solid var(--ink);padding-block:78px 62px}
html[data-design="4"] .catalog-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;align-items:end}
html[data-design="4"] .catalog-head h1{grid-column:1/9;font-weight:900;font-size:clamp(83px,13vw,192px);line-height:.88;letter-spacing:-.12em;text-transform:uppercase}
html[data-design="4"] .catalog-head>p{grid-column:9/-1;max-width:none;color:var(--muted)}
html[data-design="4"] .catalog-wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:16px;padding-top:35px}
html[data-design="4"] .filters{grid-column:1/4;border:0;border-top:2px solid var(--ink);padding:18px 0;position:sticky;top:12px}
html[data-design="4"] .type-filter{display:grid;gap:0;border-top:1px solid var(--border)}
html[data-design="4"] .filter-pill span{border:0;border-bottom:1px solid var(--border);padding:13px 8px;background:transparent;text-transform:uppercase}
html[data-design="4"] .filter-pill input:checked+span{background:#c92d26;color:#fff;border-color:#c92d26}
html[data-design="4"] .filter-row{display:grid;grid-template-columns:minmax(0,1fr);gap:15px}
html[data-design="4"] .field-inline{min-width:0;color:var(--ink)}
html[data-design="4"] .field-inline :is(select,input){border:1px solid var(--ink);background-color:#fff}
html[data-design="4"] .filter-submit{background:var(--ink);color:#fff}
html[data-design="4"] #catalog-content{grid-column:4/-1;min-width:0}
html[data-design="4"] .results-bar{border-top:2px solid var(--ink);padding-top:18px;color:var(--muted)}
html[data-design="4"] .catalog-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:42px 16px}
html[data-design="4"] .catalog-grid>.project-card{grid-column:span 6}
html[data-design="4"] .catalog-grid>.project-card:nth-child(5n + 1){grid-column:1/-1}
html[data-design="4"] .catalog-grid>.project-card:nth-child(5n + 1) .project-card__image{padding-bottom:47%}
html[data-design="4"] .pagination{border-top:2px solid var(--ink)}
/* Gridline / case: numbered content cells and hard framed screenshots */
html[data-design="4"] .case-header{padding-block:24px 68px}
html[data-design="4"] .breadcrumb{color:var(--muted);text-transform:uppercase}
html[data-design="4"] .case-header__body{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px;border-top:2px solid var(--ink);padding-top:15px;margin-top:67px}
html[data-design="4"] .case-header__body>div:first-child{grid-column:1/10}
html[data-design="4"] .case-header__aside{grid-column:10/-1;border-left:2px solid var(--ink);padding-left:17px;margin:0}
html[data-design="4"] .case-header h1{font-size:clamp(55px,7vw,112px)}
html[data-design="4"] .case-header__body p{color:var(--muted)}
html[data-design="4"] .case-header__aside>span{color:var(--muted)}
html[data-design="4"] .case-cover{background:#ebebeb;border-block:2px solid var(--ink);padding:38px 0}
html[data-design="4"] .case-cover__inner{padding:0;box-shadow:none;border:2px solid var(--ink);background:#fff}
html[data-design="4"] .case-cover__label{color:var(--ink);text-transform:uppercase}
html[data-design="4"] .case-body{grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;padding-block:100px}
html[data-design="4"] .case-body__index{grid-column:1/4;border-top:2px solid var(--ink);padding-top:16px;color:var(--ink)}
html[data-design="4"] .case-body__main{grid-column:4/-1;max-width:none}
html[data-design="4"] .case-copy{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:0 28px;border-bottom:2px solid var(--ink);margin:0;padding:27px 0 52px}
html[data-design="4"] .case-copy>.section-kicker{grid-column:1/-1;color:var(--lime)}
html[data-design="4"] .case-copy h2{font-size:clamp(28px,3.15vw,50px);margin:13px 0;grid-column:1}
html[data-design="4"] .case-copy>.prose,html[data-design="4"] .case-copy>.module-list{grid-column:2;margin-top:13px}
html[data-design="4"] .case-copy>.case-block-image{grid-column:1/-1;margin-top:25px}
html[data-design="4"] .prose{color:var(--muted)}
html[data-design="4"] .module-row{border-color:var(--ink)}
html[data-design="4"] .gallery-section{background:#f0f0f0;border-top:2px solid var(--ink)}
html[data-design="4"] .gallery-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:52px 16px}
html[data-design="4"] .gallery-item{grid-column:span 6}
html[data-design="4"] .gallery-item--full{grid-column:1/-1}
html[data-design="4"] .gallery-open{background:#e5e5e5;border:2px solid var(--ink)}
html[data-design="4"] .gallery-item figcaption{border-top:2px solid var(--ink);color:var(--ink);padding-top:10px}
html[data-design="4"] .device-canvas{background:#e1e1e1;border:2px solid var(--ink)}
html[data-design="4"] .switch-controls{border:2px solid var(--ink)}
html[data-design="4"] .switch-controls button.active{background:var(--ink);color:#fff}
html[data-design="4"] .next-work{background:#c92d26;color:#fff;border-top:2px solid var(--ink)}
html[data-design="4"] .next-work__link{grid-template-columns:1fr 1fr}
html[data-design="4"] .next-work>.shell>.section-kicker,html[data-design="4"] .next-work__button{color:#fff;border-color:#fff}
html[data-design="4"] .next-work__link p{color:#fff}
html[data-design="4"] .next-work__image{border:2px solid var(--ink)}
/* Gridline / informational and contact pages retain explicit cell structure */
html[data-design="4"] .page-hero{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px;border-bottom:2px solid var(--ink);padding-block:90px 80px}
html[data-design="4"] .page-hero>.section-kicker{grid-column:1/-1}
html[data-design="4"] .page-hero h1{grid-column:1/10;font-size:clamp(52px,6.5vw,110px);margin:10px 0}
html[data-design="4"] .page-hero>p{grid-column:10/-1;max-width:none;color:var(--muted);align-self:end}
html[data-design="4"] .services-list{border-top:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 16px;padding-top:25px}
html[data-design="4"] .service-row{grid-column:span 6;display:grid;grid-template-columns:42px minmax(0,1fr);gap:18px;border:2px solid var(--ink);border-right:0;margin:0;padding:23px 17px 38px;transition:none}
html[data-design="4"] .service-row:nth-child(even){border-right:2px solid var(--ink)}
html[data-design="4"] .service-row:hover{padding-left:17px;background:#f0f0f0}
html[data-design="4"] .service-number{font-size:14px;color:#bb2c24}
html[data-design="4"] .service-row h2{font-size:clamp(24px,2.9vw,43px)}
html[data-design="4"] .service-row p{color:var(--muted)}
html[data-design="4"] .service-end{grid-column:2;flex-direction:row;align-items:start;flex-wrap:wrap}
html[data-design="4"] .service-end a{color:var(--muted)}
html[data-design="4"] .service-disclaimer{grid-column:1/-1;color:var(--muted)}
html[data-design="4"] .about-head{border:0;padding-bottom:30px}
html[data-design="4"] .about-layout{grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
html[data-design="4"] .about-visual{grid-column:1/6;aspect-ratio:1/1;border:2px solid var(--ink)}
html[data-design="4"] .about-typographic{min-height:400px;background:#151515;color:#fff}
html[data-design="4"] .about-typographic strong{font-size:clamp(40px,4.1vw,65px);font-weight:900;text-transform:uppercase}
html[data-design="4"] .about-squares span{border-radius:0}
html[data-design="4"] .about-squares span:first-child{background:var(--lime);color:#fff}
html[data-design="4"] .about-copy{grid-column:7/-1;border-top:2px solid var(--ink);padding-top:18px}
html[data-design="4"] .about-copy h2{font-size:clamp(31px,3.9vw,60px);text-transform:uppercase;font-weight:900}
html[data-design="4"] .about-fact{border-top:2px solid var(--ink)}
html[data-design="4"] .about-fact p{color:var(--muted)}
html[data-design="4"] .contact-layout{grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;padding-block:85px 140px}
html[data-design="4"] .contact-intro{grid-column:1/6;border-top:2px solid var(--ink);padding-top:15px}
html[data-design="4"] .contact-intro h1{font-size:clamp(45px,5.7vw,90px)}
html[data-design="4"] .contact-intro>p{color:var(--muted)}
html[data-design="4"] .contact-methods{margin-top:60px}
html[data-design="4"] .contact-form-panel{grid-column:7/-1;background:#fff;border:2px solid var(--ink);padding:30px}
html[data-design="4"] .form-top{color:var(--ink);border-color:var(--ink)}
html[data-design="4"] .form-field :is(input,textarea,select){border-bottom:2px solid var(--ink);color:var(--ink)}
html[data-design="4"] .form-field label,html[data-design="4"] .consent-field label{color:var(--muted)}
html[data-design="4"] .legal-page h1{font-weight:900;text-transform:uppercase}
html[data-design="4"] .empty-panel,html[data-design="4"] .legal-warning{border:2px solid var(--ink);background:#fff}

/* 05 — GALLERY SPACE
   Museum staging: images as exhibits, expansive white walls, quiet labels,
   staggered installations and separate wide CRM exhibition strips
*/
html[data-design="5"]{--paper:#f4f3f8;--white:#fff;--ink:#25223a;--muted:#605b72;--border:#c9c4d9;--lime:#7c54dd;--gray:#e8e4f1;--deep:#2b2542;--shell:min(1500px,calc(100% - 146px));color-scheme:light}
html[data-design="5"] body{font-family:'Liberation Sans','DejaVu Sans',Arial,sans-serif}
html[data-design="5"] :is(.section-heading h2,.directions h2,.closing h2,.site-footer h2,.page-hero h1,.contact-intro h1,.case-header h1,.next-work__link h2){font-weight:500;letter-spacing:-.075em;line-height:1.08}
html[data-design="5"] :is(.section-heading h2 em,.directions h2 em,.closing h2 em,.site-footer h2 em,.page-hero h1 em,.contact-intro h1 em){font-style:normal;color:var(--muted)}
html[data-design="5"] .site-header{background:var(--paper);border-bottom:1px solid var(--border)}
html[data-design="5"] .header-inner{min-height:103px}
html[data-design="5"] .brand-symbol{background:var(--lime);color:#fff;border-radius:0;width:40px;height:40px}
html[data-design="5"] .wordmark{font-size:17px;font-weight:600}
html[data-design="5"] .main-nav .nav-contact{border-color:var(--lime);color:var(--lime);border-radius:0}
html[data-design="5"] .pill-dark{background:var(--ink);color:#fff}
html[data-design="5"] .pill-outline:hover{background:var(--ink);color:#fff}
html[data-design="5"] .pill-lime{color:#fff}
html[data-design="5"] .hero{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:5%;min-height:820px;padding-block:110px 125px}
html[data-design="5"] .hero-copy{justify-content:start;padding-top:50px}
html[data-design="5"] .eyebrow{color:var(--lime)}
html[data-design="5"] .hero h1{font-size:clamp(46px,4.3vw,73px);font-weight:500;line-height:1.1}
html[data-design="5"] .hero-lede{color:var(--muted);font-size:16px;max-width:430px}
html[data-design="5"] .hero-footnote{color:var(--muted);border-top:1px solid var(--border);padding-top:16px}
html[data-design="5"] .hero-art{height:640px}
html[data-design="5"] .hero-art__grid{display:none}
html[data-design="5"] .hero-browser{width:88%;height:445px;right:0;top:0;transform:none;box-shadow:0 25px 50px #25223a19;border:12px solid #fff}
html[data-design="5"] .hero-crm{width:72%;height:285px;left:0;bottom:0;transform:none;border:12px solid #fff;box-shadow:0 25px 60px #25223a20;z-index:2}
html[data-design="5"] .hero-phone{right:0;bottom:0;transform:none;width:103px;height:210px}
html[data-design="5"] .hero-caption{top:auto;bottom:-35px;left:0;color:var(--muted)}
html[data-design="5"] .art-index{right:0;bottom:-35px;color:var(--muted)}
html[data-design="5"] .stats{background:#e8e4f0;color:var(--ink);border-block:1px solid var(--border)}
html[data-design="5"] .stats-inner{min-height:166px}
html[data-design="5"] .stats-inner>div{border-color:var(--border)}
html[data-design="5"] .stats strong{font-size:clamp(43px,4.6vw,71px);font-weight:500}
html[data-design="5"] .stats strong span{color:var(--lime)}
html[data-design="5"] .stats-inner>div>span,html[data-design="5"] .stats-aside{color:var(--muted)}
html[data-design="5"] .section{padding-block:150px}
html[data-design="5"] .section-heading{margin-bottom:75px;align-items:start}
html[data-design="5"] .section-heading h2{font-size:clamp(50px,5.5vw,90px)}
html[data-design="5"] .section-heading__aside{padding-top:45px}
html[data-design="5"] .section-heading__aside p,html[data-design="5"] .project-card__info p{color:var(--muted)}
html[data-design="5"] .featured-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:100px 24px}
html[data-design="5"] .featured-grid>.project-card{grid-column:span 5}
html[data-design="5"] .featured-grid>.project-card:nth-child(2n){grid-column:span 7;margin-top:105px}
html[data-design="5"] .featured-grid>.project-card--wide{grid-column:1/-1;margin-top:0}
html[data-design="5"] .project-card__visual{background:#e4dff0;padding:18px;box-shadow:0 28px 45px #2b254213}
html[data-design="5"] .project-card--wide .project-card__visual{padding:28px}
html[data-design="5"] .project-card__image{background:#fff}
html[data-design="5"] .project-card__info{padding:20px 4px 0}
html[data-design="5"] .project-card h3{font-weight:600;font-size:clamp(24px,2.4vw,37px)}
html[data-design="5"] .meta-line{color:var(--muted)}
html[data-design="5"] .round-arrow{border-radius:50%;border-color:var(--lime);color:var(--lime)}
html[data-design="5"] .more-work{border-color:var(--border)}
html[data-design="5"] .directions{background:#ebe9f2}
html[data-design="5"] .direction-cards{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:30px;align-items:start}
html[data-design="5"] .direction-card{background:#e2ddee;color:var(--ink);padding:35px;min-height:650px}
html[data-design="5"] .direction-card--crm{background:#302948;color:#fff;margin-top:70px}
html[data-design="5"] .direction-card--site .direction-top,html[data-design="5"] .direction-card--site .direction-bottom{border-color:var(--ink)}
html[data-design="5"] .direction-card--crm>p{color:#eeeaf9}
html[data-design="5"] .direction-card--site>p{color:#484355}
html[data-design="5"] .direction-card h3{font-size:clamp(39px,4vw,65px);font-weight:500}
html[data-design="5"] .direction-image{background:#fff}
html[data-design="5"] .closing{border-top:1px solid var(--border)}
html[data-design="5"] .site-footer{background:var(--deep);color:#fff}
html[data-design="5"] .site-footer h2 em{color:#bdb0ea}
/* Gallery / catalog: generous wall gaps and full-width CRM exhibits */
html[data-design="5"] .catalog-intro{padding-block:120px 110px}
html[data-design="5"] .catalog-head{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:8%;align-items:end}
html[data-design="5"] .catalog-head h1{font-size:clamp(76px,12vw,180px);font-weight:500;letter-spacing:-.1em}
html[data-design="5"] .catalog-head>p{max-width:420px;color:var(--muted);font-size:17px}
html[data-design="5"] .catalog-wrap{padding-bottom:170px}
html[data-design="5"] .filters{background:#fff;border:1px solid var(--border);padding:22px 30px}
html[data-design="5"] .filter-pill span{background:var(--paper);border-color:var(--border)}
html[data-design="5"] .filter-pill input:checked+span{background:var(--lime);color:#fff;border-color:var(--lime)}
html[data-design="5"] .field-inline{color:var(--muted)}
html[data-design="5"] .field-inline :is(select,input){background-color:#fff;border-color:var(--border)}
html[data-design="5"] .filter-submit{background:var(--ink);color:#fff}
html[data-design="5"] .results-bar{color:var(--muted);padding-block:42px}
html[data-design="5"] .catalog-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:100px 25px}
html[data-design="5"] .catalog-grid>.project-card{grid-column:span 5}
html[data-design="5"] .catalog-grid>.project-card:nth-child(4n + 2){grid-column:span 7;margin-top:110px}
html[data-design="5"] .catalog-grid>.project-card:nth-child(4n + 3){grid-column:span 7}
html[data-design="5"] .catalog-grid>.project-card:nth-child(4n + 4){grid-column:span 5;margin-top:80px}
html[data-design="5"] .catalog-grid>.project-card--crm{grid-column:1/-1;margin-top:0}
html[data-design="5"] .catalog-grid>.project-card--crm .project-card__image{padding-bottom:45%}
html[data-design="5"] .pagination{border-color:var(--border)}
/* Gallery / case: curated exhibition strips and generous readable screenshots */
html[data-design="5"] .case-header{padding-block:32px 110px}
html[data-design="5"] .breadcrumb{color:var(--muted)}
html[data-design="5"] .case-header__body{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,.4fr);gap:8%;margin-top:100px}
html[data-design="5"] .case-header h1{font-size:clamp(64px,7.5vw,125px);font-weight:500}
html[data-design="5"] .case-header__body p{color:var(--muted);font-size:19px}
html[data-design="5"] .case-header__aside{border-top:1px solid var(--border);padding-top:18px;margin-top:18px}
html[data-design="5"] .case-header__aside>span{color:var(--muted)}
html[data-design="5"] .case-cover{background:#e6e1f0;padding:85px 0}
html[data-design="5"] .case-cover__inner{max-width:1400px;padding:20px;background:#fff;border:0;box-shadow:0 35px 75px #25223a20}
html[data-design="5"] .case[data-project-kind="crm"] .case-cover__inner{max-width:1550px;width:min(100% - 40px,1550px);padding:10px}
html[data-design="5"] .case-cover__label{color:var(--muted)}
html[data-design="5"] .case-body{grid-template-columns:minmax(0,.55fr) minmax(0,1fr);gap:15%;padding-block:160px}
html[data-design="5"] .case-body__index{border-top:1px solid var(--border);padding-top:18px;color:var(--lime)}
html[data-design="5"] .case-copy{margin-bottom:80px;padding-bottom:70px}
html[data-design="5"] .case-copy h2{font-size:clamp(34px,3.3vw,53px);font-weight:500}
html[data-design="5"] .case-copy>.section-kicker{color:var(--lime)}
html[data-design="5"] .prose,html[data-design="5"] .module-row p{color:var(--muted);font-size:15px;line-height:2}
html[data-design="5"] .gallery-section{background:#ece9f4;padding:145px 0}
html[data-design="5"] .gallery-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:110px 28px}
html[data-design="5"] .gallery-item{grid-column:span 5}
html[data-design="5"] .gallery-item:nth-child(2n):not(.gallery-item--full){grid-column:span 7;margin-top:95px}
html[data-design="5"] .gallery-item--full,html[data-design="5"] .case[data-project-kind="crm"] .gallery-item{grid-column:1/-1;margin-top:0}
html[data-design="5"] .gallery-open{background:#fff;padding:18px;box-shadow:0 25px 55px #25223a14}
html[data-design="5"] .gallery-item figcaption{color:var(--muted);border-top:1px solid var(--border);padding-top:13px}
html[data-design="5"] .device-canvas{background:#e0d9ee}
html[data-design="5"] .switch-controls{border-color:var(--border)}
html[data-design="5"] .switch-controls button.active{background:var(--lime);color:#fff}
html[data-design="5"] .next-work{background:var(--deep);color:#fff;padding-block:145px}
html[data-design="5"] .next-work__link{grid-template-columns:.7fr 1.3fr;gap:8%}
html[data-design="5"] .next-work__link h2{font-size:clamp(52px,6vw,92px)}
html[data-design="5"] .next-work__image{padding:16px;background:#fff}
html[data-design="5"] .next-work__link p{color:#d3cde9}
/* Gallery / services, about, contact as exhibition labels and wall panels */
html[data-design="5"] .page-hero{padding-block:125px 105px}
html[data-design="5"] .page-hero h1{font-size:clamp(64px,7vw,118px);max-width:1000px}
html[data-design="5"] .page-hero>p{font-size:17px;color:var(--muted)}
html[data-design="5"] .services-list{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:30px;padding-top:35px;border-top:1px solid var(--border)}
html[data-design="5"] .service-row{grid-column:span 4;display:flex;flex-direction:column;gap:25px;min-height:350px;padding:32px;background:#fff;border:1px solid var(--border);transition:transform .22s}
html[data-design="5"] .service-row:hover{padding-left:32px;transform:translateY(-5px)}
html[data-design="5"] .service-number{color:var(--lime);font-size:13px}
html[data-design="5"] .service-row h2{font-size:clamp(25px,2.3vw,37px);font-weight:600}
html[data-design="5"] .service-row p{color:var(--muted)}
html[data-design="5"] .service-end{margin-top:auto;flex-direction:row;align-items:start;flex-wrap:wrap}
html[data-design="5"] .service-end a:first-child{color:var(--muted)}
html[data-design="5"] .service-disclaimer{grid-column:1/-1;color:var(--muted)}
html[data-design="5"] .about-head{padding-bottom:55px}
html[data-design="5"] .about-layout{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:9%;align-items:start}
html[data-design="5"] .about-visual{aspect-ratio:1/1;background:#e6e1f0;padding:22px}
html[data-design="5"] .about-typographic{background:#302948;color:#fff;min-height:450px}
html[data-design="5"] .about-typographic strong{font-weight:500;font-size:clamp(38px,4.5vw,70px)}
html[data-design="5"] .about-squares span:first-child{background:var(--lime);color:#fff}
html[data-design="5"] .about-typographic small{color:#d7cfee}
html[data-design="5"] .about-copy{border-top:1px solid var(--border);padding-top:30px}
html[data-design="5"] .about-copy h2{font-weight:500;font-size:clamp(32px,3.6vw,56px)}
html[data-design="5"] .about-fact p{color:var(--muted)}
html[data-design="5"] .contact-layout{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:9%;padding-block:130px}
html[data-design="5"] .contact-intro h1{font-size:clamp(55px,6vw,104px)}
html[data-design="5"] .contact-intro>p{color:var(--muted);font-size:15px}
html[data-design="5"] .contact-form-panel{background:#fff;border:1px solid var(--border);padding:43px;box-shadow:0 24px 65px #25223a12}
html[data-design="5"] .form-top{color:var(--muted);border-color:var(--border)}
html[data-design="5"] .form-field :is(input,textarea,select){background:#fff;border-color:var(--border);color:var(--ink)}
html[data-design="5"] .form-field label,html[data-design="5"] .consent-field label,html[data-design="5"] .success-panel p{color:var(--muted)}
html[data-design="5"] .success-symbol{color:#fff}
html[data-design="5"] .legal-page h1{font-weight:500}
html[data-design="5"] .legal-warning,html[data-design="5"] .empty-panel{background:#fff;border:1px solid var(--border);color:var(--ink)}
html[data-design="5"] .empty-panel p{color:var(--muted)}

/* Long Cyrillic legal headings and client-entered titles must wrap even at 320px */
html[data-design] :is(.legal-page h1,.case-header h1,.catalog-head h1,.page-hero h1,.contact-intro h1,.service-row h2){overflow-wrap:anywhere;hyphens:auto}

/* Error pages inherit the complete visual grammar of the selected variant */
.error-page{padding-block:clamp(85px,13vw,190px);min-height:70vh}
.error-page__inner{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);gap:6%;align-items:end;border-top:1px solid var(--border);padding-top:30px}
.error-page__code{font-size:clamp(145px,23vw,330px);font-weight:800;line-height:.9;letter-spacing:-.13em;color:var(--lime)}
.error-page h1{font-size:clamp(32px,4.8vw,72px);letter-spacing:-.075em;line-height:1.1;overflow-wrap:anywhere;margin:0}
.error-page p{color:var(--muted);font-size:15px;line-height:1.7;margin-block:23px}
html[data-design="2"] .error-page__inner{grid-template-columns:.62fr 1fr;border-color:var(--ink)}
html[data-design="2"] .error-page__code,html[data-design="2"] .error-page h1{font-family:'Liberation Serif','DejaVu Serif',serif;font-weight:400}
html[data-design="3"] .error-page__inner{border-color:var(--lime)}
html[data-design="3"] .error-page__code{font-family:'Liberation Mono',monospace;font-size:clamp(100px,16vw,235px)}
html[data-design="4"] .error-page__inner{border-top:2px solid var(--ink);grid-template-columns:repeat(12,minmax(0,1fr));gap:15px}
html[data-design="4"] .error-page__code{grid-column:1/6;font-weight:900}
html[data-design="4"] .error-page__inner>div{grid-column:7/-1}
html[data-design="4"] .error-page h1{text-transform:uppercase;font-weight:900}
html[data-design="5"] .error-page__inner{grid-template-columns:1fr 1fr;border-top:0;gap:9%;background:#e6e1f0;padding:clamp(20px,4vw,65px)}
html[data-design="5"] .error-page__code{font-weight:500}
@media(max-width:620px){
 .error-page{min-height:70vh;padding-block:75px 115px}
 .error-page__inner,html[data-design="2"] .error-page__inner,html[data-design="4"] .error-page__inner,html[data-design="5"] .error-page__inner{display:block;padding-top:23px}
 .error-page__code,html[data-design="3"] .error-page__code{font-size:clamp(100px,35vw,170px)}
 .error-page h1{font-size:clamp(32px,9vw,50px)}
}
/* Shared content states whose base CSS uses fixed lime/olive colors */
html[data-design="2"] .demo-notice,html[data-design="4"] .demo-notice,html[data-design="5"] .demo-notice{background:var(--gray);border-left-color:var(--lime);color:var(--ink)}
html[data-design="2"] .preview-alert,html[data-design="4"] .preview-alert,html[data-design="5"] .preview-alert{background:var(--gray);color:var(--ink)}
html[data-design="2"] .empty-panel,html[data-design="2"] .legal-warning{background:var(--gray);color:var(--ink)}
html[data-design="2"] .empty-panel p,html[data-design="4"] .empty-panel p,html[data-design="5"] .empty-panel p{color:var(--muted)}
html[data-design="2"] .filter-submit,html[data-design="4"] .filter-submit,html[data-design="5"] .filter-submit{border-color:var(--ink)}
html[data-design="2"] .success-symbol,html[data-design="4"] .success-symbol,html[data-design="5"] .success-symbol{background:var(--lime);border-radius:0;color:#fff}
html[data-design="2"] .visual-cta{background:#3659d2}
html[data-design="4"] .visual-cta{background:#c92d26}
html[data-design="2"] .visual-cta,html[data-design="4"] .visual-cta,html[data-design="5"] .visual-cta,
html[data-design="2"] .zoom-mark,html[data-design="4"] .zoom-mark,html[data-design="5"] .zoom-mark{color:#fff}
html[data-design="3"] .design-rail button[aria-pressed="true"]{background:var(--lime);color:#16191d;border-color:var(--lime)}
html[data-design="2"] .filter-pill input:checked+span{border-color:var(--lime)}
html[data-design="3"] .filter-pill input:checked+span{border-color:var(--lime)}
html[data-design="2"] .case-cover__inner>img,html[data-design="3"] .case-cover__inner>img,
html[data-design="4"] .case-cover__inner>img,html[data-design="5"] .case-cover__inner>img{object-fit:contain;object-position:var(--image-position,center top)}

/* Responsiveness is shared; variant-specific desktop grids collapse deliberately */
@media(max-width:1180px){
 html[data-design="2"],html[data-design="3"],html[data-design="4"],html[data-design="5"]{--shell:calc(100% - 100px)}
 html[data-design="2"] .hero,html[data-design="3"] .hero,html[data-design="5"] .hero{grid-template-columns:1fr;gap:45px;min-height:0}
 html[data-design="4"] .hero{grid-template-columns:1fr;gap:30px}
 html[data-design="4"] .hero-copy,html[data-design="4"] .hero-art{grid-column:1}
 html[data-design="4"] .hero-art{margin-left:0;border-left:0;padding-left:0}
 html[data-design="2"] .hero-copy,html[data-design="3"] .hero-copy,html[data-design="5"] .hero-copy{padding-top:0}
 html[data-design="2"] .hero-art,html[data-design="3"] .hero-art,html[data-design="5"] .hero-art{width:min(100%,760px);margin:0 auto}
 html[data-design="2"] .catalog-wrap,html[data-design="4"] .catalog-wrap{display:block}
 html[data-design="2"] .filters,html[data-design="4"] .filters{position:static;display:block;border-block:1px solid var(--border);padding:18px 0}
 html[data-design="2"] .type-filter,html[data-design="4"] .type-filter{display:flex;border:0;flex-wrap:wrap;gap:9px}
 html[data-design="2"] .filter-pill span,html[data-design="4"] .filter-pill span{border:1px solid var(--border);padding:9px 14px}
 html[data-design="2"] .filter-row,html[data-design="4"] .filter-row{display:flex;flex-wrap:wrap;gap:12px}
 html[data-design="2"] .field-inline,html[data-design="4"] .field-inline{min-width:170px}
 html[data-design="4"] #catalog-content{min-width:0}
 html[data-design="4"] .catalog-head h1{grid-column:1/9}
 html[data-design="4"] .catalog-head>p{grid-column:9/-1}
 html[data-design="5"] .services-list .service-row{grid-column:span 6}
}
@media(max-width:820px){
 html[data-design="2"],html[data-design="3"],html[data-design="4"],html[data-design="5"]{--shell:calc(100% - 68px)}
 .design-rail,.has-design-switch .design-rail{position:sticky;top:0;bottom:auto;right:auto;left:auto;transform:none;width:100%;height:53px;flex-direction:row;justify-content:center;padding:4px 8px;gap:0;border-radius:0;box-shadow:none;border:0;border-bottom:1px solid var(--border);background:var(--paper)}
 html{scroll-padding-top:64px}
 .design-rail__caption{display:none}
 .design-rail__numbers{flex-direction:row;gap:2px}
 .design-rail button{width:44px;height:44px;font-size:13px}
 .design-rail__progress{top:auto;right:auto;left:0;bottom:0;height:3px;width:var(--scroll-progress,0%);transition:width .12s linear}
 /* The selector is in normal document flow: no footer overlay compensation */
 .js main{padding-bottom:0}
 html[data-design="2"] .featured-grid,html[data-design="3"] .featured-grid,html[data-design="4"] .featured-grid,html[data-design="5"] .featured-grid,
 html[data-design="2"] .catalog-grid,html[data-design="3"] .catalog-grid,html[data-design="4"] .catalog-grid,html[data-design="5"] .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:52px 20px}
 html[data-design="2"] .featured-grid>.project-card,html[data-design="3"] .featured-grid>.project-card,html[data-design="4"] .featured-grid>.project-card,html[data-design="5"] .featured-grid>.project-card,
 html[data-design="2"] .catalog-grid>.project-card,html[data-design="3"] .catalog-grid>.project-card,html[data-design="4"] .catalog-grid>.project-card,html[data-design="5"] .catalog-grid>.project-card{grid-column:auto;margin-top:0}
 html[data-design="2"] .featured-grid>.project-card--wide,html[data-design="3"] .featured-grid>.project-card--wide,html[data-design="4"] .featured-grid>.project-card--wide,html[data-design="5"] .featured-grid>.project-card--wide,
 html[data-design="2"] .catalog-grid>.project-card--crm,html[data-design="3"] .catalog-grid>.project-card--crm,html[data-design="4"] .catalog-grid>.project-card--crm,html[data-design="5"] .catalog-grid>.project-card--crm{grid-column:1/-1}
 html[data-design="2"] .catalog-grid>.project-card:nth-child(4n + 3),html[data-design="4"] .catalog-grid>.project-card:nth-child(5n + 1){grid-column:1/-1;margin-top:0}
 html[data-design="2"] .catalog-grid>.project-card:nth-child(4n + 2),html[data-design="5"] .catalog-grid>.project-card:nth-child(4n + 2),html[data-design="5"] .catalog-grid>.project-card:nth-child(4n + 4){margin-top:0}
 html[data-design="2"] .direction-cards,html[data-design="3"] .direction-cards,html[data-design="4"] .direction-cards,html[data-design="5"] .direction-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}
 html[data-design="3"] .direction-card--site,html[data-design="3"] .direction-card--crm{grid-column:auto}
 html[data-design="2"] .direction-card--crm,html[data-design="5"] .direction-card--crm{margin-top:0}
 html[data-design="2"] .case-header__body,html[data-design="3"] .case-header__body,html[data-design="4"] .case-header__body,html[data-design="5"] .case-header__body{display:block;margin-top:45px}
 html[data-design="4"] .case-header__aside{border-left:0;border-top:1px solid var(--border)}
 html[data-design="2"] .case-header__aside,html[data-design="3"] .case-header__aside,html[data-design="4"] .case-header__aside,html[data-design="5"] .case-header__aside{margin-top:27px}
 html[data-design="2"] .case-body,html[data-design="3"] .case-body,html[data-design="4"] .case-body,html[data-design="5"] .case-body{display:block;padding-block:80px}
 html[data-design="4"] .case-body__index,html[data-design="4"] .case-body__main{grid-column:auto}
 html[data-design="2"] .case-body__index,html[data-design="3"] .case-body__index,html[data-design="4"] .case-body__index,html[data-design="5"] .case-body__index{position:static;margin-bottom:35px}
 html[data-design="4"] .case-copy{display:block}
 html[data-design="4"] .case-copy>.prose{margin-top:10px}
 html[data-design="2"] .gallery-grid,html[data-design="3"] .gallery-grid,html[data-design="4"] .gallery-grid,html[data-design="5"] .gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:47px 20px}
 html[data-design="2"] .gallery-item,html[data-design="3"] .gallery-item,html[data-design="4"] .gallery-item,html[data-design="5"] .gallery-item{grid-column:auto;margin-top:0}
 html[data-design="2"] .gallery-item--full,html[data-design="3"] .gallery-item--full,html[data-design="4"] .gallery-item--full,html[data-design="5"] .gallery-item--full,
 html[data-design="3"] .case[data-project-kind="crm"] .gallery-item,html[data-design="5"] .case[data-project-kind="crm"] .gallery-item{grid-column:1/-1;margin-top:0}
 html[data-design="2"] .services-list,html[data-design="3"] .services-list,html[data-design="4"] .services-list,html[data-design="5"] .services-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
 html[data-design="2"] .service-row,html[data-design="3"] .service-row,html[data-design="4"] .service-row,html[data-design="5"] .service-row{grid-column:auto}
 html[data-design="4"] .service-row:nth-child(odd){border-right:2px solid var(--ink)}
 html[data-design="2"] .service-disclaimer,html[data-design="3"] .service-disclaimer,html[data-design="4"] .service-disclaimer,html[data-design="5"] .service-disclaimer{grid-column:1/-1}
 html[data-design="2"] .about-layout,html[data-design="3"] .about-layout,html[data-design="4"] .about-layout,html[data-design="5"] .about-layout,
 html[data-design="2"] .contact-layout,html[data-design="3"] .contact-layout,html[data-design="4"] .contact-layout,html[data-design="5"] .contact-layout{display:grid;grid-template-columns:1fr;gap:45px}
 html[data-design="4"] .about-visual,html[data-design="4"] .about-copy,html[data-design="4"] .contact-intro,html[data-design="4"] .contact-form-panel{grid-column:1}
 html[data-design="2"] .about-visual,html[data-design="3"] .about-visual,html[data-design="4"] .about-visual,html[data-design="5"] .about-visual{max-width:650px}
 html[data-design="4"] .catalog-head,html[data-design="4"] .page-hero{display:block}
 html[data-design="4"] .catalog-head>p{max-width:500px;margin-top:23px}
 html[data-design="4"] .page-hero h1{font-size:clamp(48px,8vw,78px)}
 html[data-design="4"] .page-hero>p{max-width:550px}
 html[data-design="2"] .next-work__link,html[data-design="3"] .next-work__link,html[data-design="4"] .next-work__link,html[data-design="5"] .next-work__link{grid-template-columns:1fr 1fr;gap:25px}
}
@media(max-width:620px){
 html[data-design="2"],html[data-design="3"],html[data-design="4"],html[data-design="5"]{--shell:calc(100% - 38px)}
 html[data-design="2"] .hero,html[data-design="3"] .hero,html[data-design="4"] .hero,html[data-design="5"] .hero{grid-template-columns:1fr;min-height:0;gap:24px;padding-block:48px 73px}
 html[data-design="4"] .hero-copy,html[data-design="4"] .hero-art{grid-column:1}
 html[data-design="2"] .hero h1,html[data-design="3"] .hero h1,html[data-design="4"] .hero h1,html[data-design="5"] .hero h1{font-size:clamp(37px,9vw,54px);line-height:1.1;overflow-wrap:break-word}
 html[data-design="2"] .hero-art,html[data-design="3"] .hero-art,html[data-design="4"] .hero-art,html[data-design="5"] .hero-art{width:100%;height:345px;margin:0}
 html[data-design="2"] .hero-browser,html[data-design="3"] .hero-browser,html[data-design="4"] .hero-browser,html[data-design="5"] .hero-browser{width:88%;height:225px;top:12px;right:0}
 html[data-design="2"] .hero-crm,html[data-design="3"] .hero-crm,html[data-design="4"] .hero-crm,html[data-design="5"] .hero-crm{width:75%;height:144px;bottom:17px;left:0}
 html[data-design="2"] .hero-phone,html[data-design="3"] .hero-phone,html[data-design="4"] .hero-phone,html[data-design="5"] .hero-phone{width:70px;height:141px;right:0;bottom:0}
 html[data-design="2"] .hero-caption,html[data-design="3"] .hero-caption,html[data-design="4"] .hero-caption,html[data-design="5"] .hero-caption{display:none}
 html[data-design="2"] .hero-footnote,html[data-design="3"] .hero-footnote,html[data-design="4"] .hero-footnote,html[data-design="5"] .hero-footnote{margin-top:25px;padding-top:13px}
 html[data-design="2"] .stats-inner,html[data-design="3"] .stats-inner,html[data-design="4"] .stats-inner,html[data-design="5"] .stats-inner{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-height:120px;padding-block:20px}
 html[data-design="2"] .stats-inner>div,html[data-design="3"] .stats-inner>div,html[data-design="4"] .stats-inner>div,html[data-design="5"] .stats-inner>div{padding:0 6px;display:flex;flex-direction:column;border:0;gap:8px}
 html[data-design="2"] .stats strong,html[data-design="3"] .stats strong,html[data-design="4"] .stats strong,html[data-design="5"] .stats strong{font-size:clamp(26px,7vw,42px)}
 html[data-design="2"] .stats-aside,html[data-design="3"] .stats-aside,html[data-design="4"] .stats-aside,html[data-design="5"] .stats-aside{display:none}
 html[data-design="2"] .section,html[data-design="3"] .section,html[data-design="4"] .section,html[data-design="5"] .section{padding-block:75px}
 html[data-design="2"] .section-heading h2,html[data-design="3"] .section-heading h2,html[data-design="4"] .section-heading h2,html[data-design="5"] .section-heading h2{font-size:clamp(34px,9vw,55px)}
 html[data-design="2"] .section-heading__aside,html[data-design="3"] .section-heading__aside,html[data-design="4"] .section-heading__aside,html[data-design="5"] .section-heading__aside{padding-top:0}
 html[data-design="2"] .featured-grid,html[data-design="3"] .featured-grid,html[data-design="4"] .featured-grid,html[data-design="5"] .featured-grid,
 html[data-design="2"] .catalog-grid,html[data-design="3"] .catalog-grid,html[data-design="4"] .catalog-grid,html[data-design="5"] .catalog-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:42px}
 html[data-design="2"] .featured-grid>.project-card,html[data-design="3"] .featured-grid>.project-card,html[data-design="4"] .featured-grid>.project-card,html[data-design="5"] .featured-grid>.project-card,
 html[data-design="2"] .catalog-grid>.project-card,html[data-design="3"] .catalog-grid>.project-card,html[data-design="4"] .catalog-grid>.project-card,html[data-design="5"] .catalog-grid>.project-card{grid-column:1/-1;margin:0}
 html[data-design="2"] .catalog-grid>.project-card:nth-child(4n + 3),html[data-design="4"] .catalog-grid>.project-card:nth-child(5n + 1),html[data-design="5"] .catalog-grid>.project-card--crm{grid-column:1/-1}
 html[data-design="2"] .featured-grid>.project-card:nth-child(3),html[data-design="5"] .featured-grid>.project-card:nth-child(2n){margin-top:0}
 html[data-design="2"] .catalog-grid>.project-card:nth-child(4n + 3) .project-card__image,html[data-design="4"] .catalog-grid>.project-card:nth-child(5n + 1) .project-card__image,
 html[data-design="3"] .catalog-grid>.project-card--crm .project-card__image,html[data-design="5"] .catalog-grid>.project-card--crm .project-card__image{padding-bottom:62%}
 html[data-design="2"] .direction-cards,html[data-design="3"] .direction-cards,html[data-design="4"] .direction-cards,html[data-design="5"] .direction-cards{grid-template-columns:minmax(0,1fr)}
 html[data-design="2"] .direction-card,html[data-design="3"] .direction-card,html[data-design="4"] .direction-card,html[data-design="5"] .direction-card{min-height:0}
 html[data-design="2"] .catalog-intro,html[data-design="3"] .catalog-intro,html[data-design="4"] .catalog-intro,html[data-design="5"] .catalog-intro{padding-block:55px 42px}
 html[data-design="2"] .catalog-head h1,html[data-design="3"] .catalog-head h1,html[data-design="4"] .catalog-head h1,html[data-design="5"] .catalog-head h1{font-size:clamp(65px,18vw,100px);line-height:1}
 html[data-design="2"] .catalog-head,html[data-design="3"] .catalog-head,html[data-design="4"] .catalog-head,html[data-design="5"] .catalog-head{display:block}
 html[data-design="2"] .catalog-head>p,html[data-design="3"] .catalog-head>p,html[data-design="4"] .catalog-head>p,html[data-design="5"] .catalog-head>p{margin-top:17px;font-size:13px;max-width:100%}
 html[data-design="2"] .filters,html[data-design="3"] .filters,html[data-design="4"] .filters,html[data-design="5"] .filters{padding:18px 12px}
 html[data-design="2"] .filter-row,html[data-design="3"] .filter-row,html[data-design="4"] .filter-row,html[data-design="5"] .filter-row{display:grid;grid-template-columns:1fr;gap:12px}
 html[data-design="2"] .field-inline,html[data-design="3"] .field-inline,html[data-design="4"] .field-inline,html[data-design="5"] .field-inline{min-width:0}
 html[data-design="2"] .results-bar,html[data-design="3"] .results-bar,html[data-design="4"] .results-bar,html[data-design="5"] .results-bar{gap:14px;flex-wrap:wrap;font-size:9px}
 html[data-design="2"] .case-header,html[data-design="3"] .case-header,html[data-design="4"] .case-header,html[data-design="5"] .case-header{padding-block:22px 45px}
 html[data-design="2"] .case-header h1,html[data-design="3"] .case-header h1,html[data-design="4"] .case-header h1,html[data-design="5"] .case-header h1{font-size:clamp(43px,10vw,65px);overflow-wrap:break-word}
 html[data-design="2"] .case-header__body p,html[data-design="3"] .case-header__body p,html[data-design="4"] .case-header__body p,html[data-design="5"] .case-header__body p{font-size:14px}
 html[data-design="2"] .case-cover,html[data-design="3"] .case-cover,html[data-design="4"] .case-cover,html[data-design="5"] .case-cover{padding:26px 0}
 html[data-design="2"] .case-cover__inner,html[data-design="3"] .case-cover__inner,html[data-design="4"] .case-cover__inner,html[data-design="5"] .case-cover__inner,
 html[data-design="3"] .case[data-project-kind="crm"] .case-cover__inner,html[data-design="5"] .case[data-project-kind="crm"] .case-cover__inner{width:calc(100% - 24px);padding:6px;box-shadow:none}
 html[data-design="2"] .case-body,html[data-design="3"] .case-body,html[data-design="4"] .case-body,html[data-design="5"] .case-body{padding-block:67px}
 html[data-design="2"] .case-copy,html[data-design="3"] .case-copy,html[data-design="4"] .case-copy,html[data-design="5"] .case-copy{padding-bottom:40px;margin-bottom:40px}
 html[data-design="2"] .prose,html[data-design="3"] .prose,html[data-design="4"] .prose,html[data-design="5"] .prose{font-size:14px;line-height:1.8}
 html[data-design="2"] .gallery-section,html[data-design="3"] .gallery-section,html[data-design="4"] .gallery-section,html[data-design="5"] .gallery-section{padding:67px 0}
 html[data-design="2"] .gallery-grid,html[data-design="3"] .gallery-grid,html[data-design="4"] .gallery-grid,html[data-design="5"] .gallery-grid{display:grid;grid-template-columns:1fr;gap:38px}
 html[data-design="2"] .gallery-item,html[data-design="3"] .gallery-item,html[data-design="4"] .gallery-item,html[data-design="5"] .gallery-item,
 html[data-design="3"] .case[data-project-kind="crm"] .gallery-item,html[data-design="5"] .case[data-project-kind="crm"] .gallery-item{grid-column:1/-1;margin:0}
 html[data-design="2"] .gallery-open,html[data-design="3"] .gallery-open,html[data-design="4"] .gallery-open,html[data-design="5"] .gallery-open{padding:5px}
 html[data-design="2"] .page-hero,html[data-design="3"] .page-hero,html[data-design="4"] .page-hero,html[data-design="5"] .page-hero{display:block;margin-top:0;padding-block:65px 45px;padding-left:0;border-left:0}
 html[data-design="2"] .page-hero h1,html[data-design="3"] .page-hero h1,html[data-design="4"] .page-hero h1,html[data-design="5"] .page-hero h1,
 html[data-design="2"] .contact-intro h1,html[data-design="3"] .contact-intro h1,html[data-design="4"] .contact-intro h1,html[data-design="5"] .contact-intro h1{font-size:clamp(40px,10vw,62px)}
 html[data-design="2"] .services-list,html[data-design="3"] .services-list,html[data-design="4"] .services-list,html[data-design="5"] .services-list{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;padding-bottom:75px}
 html[data-design="2"] .service-row,html[data-design="3"] .service-row,html[data-design="4"] .service-row,html[data-design="5"] .service-row{grid-column:1;min-height:0;padding:23px;gap:14px}
 html[data-design="2"] .service-row:hover,html[data-design="3"] .service-row:hover,html[data-design="4"] .service-row:hover,html[data-design="5"] .service-row:hover{padding-left:23px}
 html[data-design="4"] .service-row:nth-child(even){border:2px solid var(--ink)}
 html[data-design="2"] .service-disclaimer,html[data-design="3"] .service-disclaimer,html[data-design="4"] .service-disclaimer,html[data-design="5"] .service-disclaimer{grid-column:1}
 html[data-design="2"] .about-layout,html[data-design="3"] .about-layout,html[data-design="4"] .about-layout,html[data-design="5"] .about-layout,
 html[data-design="2"] .contact-layout,html[data-design="3"] .contact-layout,html[data-design="4"] .contact-layout,html[data-design="5"] .contact-layout{grid-template-columns:1fr;gap:40px;padding-bottom:90px}
 html[data-design="2"] .about-typographic,html[data-design="3"] .about-typographic,html[data-design="4"] .about-typographic,html[data-design="5"] .about-typographic{min-height:350px;padding:25px}
 html[data-design="2"] .contact-form-panel,html[data-design="3"] .contact-form-panel,html[data-design="4"] .contact-form-panel,html[data-design="5"] .contact-form-panel{padding:24px 18px}
 html[data-design="2"] .contact-intro,html[data-design="3"] .contact-intro,html[data-design="4"] .contact-intro,html[data-design="5"] .contact-intro{border:0;padding:0}
 html[data-design="2"] .contact-methods,html[data-design="3"] .contact-methods,html[data-design="4"] .contact-methods,html[data-design="5"] .contact-methods{margin-top:45px}
 html[data-design="2"] .next-work,html[data-design="3"] .next-work,html[data-design="4"] .next-work,html[data-design="5"] .next-work{padding-block:65px}
 html[data-design="2"] .next-work__link,html[data-design="3"] .next-work__link,html[data-design="4"] .next-work__link,html[data-design="5"] .next-work__link{grid-template-columns:1fr;gap:30px}
}
@media(max-width:350px){
 html[data-design="2"],html[data-design="3"],html[data-design="4"],html[data-design="5"]{--shell:calc(100% - 28px)}
 .design-rail button{width:42px;height:44px}
 html[data-design="2"] .hero h1,html[data-design="3"] .hero h1,html[data-design="4"] .hero h1,html[data-design="5"] .hero h1{font-size:36px}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 html[data-design] body,.design-rail__progress,.design-rail button,
 html[data-design] .project-card__image img,html[data-design] .gallery-open img,
 html[data-design] .service-row{transition:none!important;animation:none!important}
}