/* M013 T001: all text is set in the catalogue font Anonymous Pro (SIL OFL 1.1), renamed Alum Mono (OFL §3), in two real weights 400 and 700 (scripts/prepare-fonts.mjs). The fallback face is a system monospace font scaled to Anonymous Pro's metrics (UPM 2048, advance 1118, hhea ascent 1675, descent 373, line gap 0) against a 1229/2048 advance (Courier New, Liberation Mono, Droid Sans Mono; Menlo and DejaVu Sans Mono are 1233): size-adjust 1118/1229, each override divided by it (tests/chrome.test.mjs recomputes them from the woff2). */@font-face{font-family:'Alum Mono';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/alum-mono-400.woff2') format('woff2')}@font-face{font-family:'Alum Mono';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/alum-mono-700.woff2') format('woff2')}@font-face{font-family:'Alum Mono Fallback';font-style:normal;font-weight:400 700;src:local('Menlo Regular'),local('Menlo-Regular'),local('DejaVu Sans Mono'),local('Liberation Mono'),local('Droid Sans Mono'),local('Courier New');size-adjust:90.97%;ascent-override:89.91%;descent-override:20.02%;line-gap-override:0%}/* Narrowest phones (№117): below 389px the H1 minimum (--fs-h1) and the contact values on /architects/ (--fs-contact) scale with the window, so text that Chromium on Linux renders a little wider than on a Mac still fits (reports/proof/ci-failures-M002.md); from 390px both sizes are unchanged. */:root{--paper:#fff;--white:#fff;--ink:#111;--muted:#5e5e5e;--line:#dcdcdc;--dark:#111;--accent:#6b6b6b;--tint:#f0f0f0;--band:#f2f2f2;--display:'Alum Mono','Alum Mono Fallback',monospace;--body:'Alum Mono','Alum Mono Fallback',monospace;--container:1328px;--line-strong:#c8c8c8;--line-dark:#696969;--muted-dark:#c8c8c8;--fs-h1:clamp(min(28px,7.2vw),3.3vw,48px);--fs-h2:clamp(25px,2.5vw,36px);--fs-h3:26px;--fs-h4:18px;--fs-lead:20px;--fs-body:18px;--fs-small:17px;--fs-caption:15px;--fs-contact:min(var(--fs-h4),4.63vw);--lh-heading:1.25;--lh-title:1.4;--lh-text:1.75;--ls-heading:-.04em;--ls-title:-.03em;--ls-caps:.14em;--measure:720px;--space-section:72px;--space-block:48px;--space-heading:32px;--space-colonnade:72px;--gap-split:56px;--gap-col:32px;--gap-row:36px;--gap-tile:16px;--tap-target:44px;--control-mark:18px;--gap-field:8px;--space-field:20px;--header-height:89px;--bar-height:0px;--bar-height-launcher:96px;--bar-height-banner:240px;--thead-height:136px;--label-cols:1fr 2.15fr;--label-gap:48px;--label-offset:calc((100% - var(--label-gap)) / 3.15 + var(--label-gap));--z-over-media:1;--z-dialog-close:3;--z-header:25;--z-compare:25;--z-mobile-bar:28;--z-cookie:40;--z-toast:60;--z-skip:100;--z-table-head:1;--tint-photo:#e5e5e5;--tint-strong:#e3e3e3;--tint-hover:#fafafa;--line-status:#bdbdbd;--line-soft:#bebebe;--line-mid:#a1a1a1;--placeholder:#7e7e7e;--hover-dark:#dedede;--topline-ink:#e6e6e6;--footer-ink:#e5e5e5;--footer-text:#bfbfbf;--footer-muted:#c6c6c6;--footer-eyebrow:#b5b5b5;--footer-line:#616161;--media-dark:#2f2f2f;--scrim-hero:rgba(0,0,0,.64);--play-fill:#2e2e2e80;--play-line:#fff9;--backdrop:#1d1d1d99;--backdrop-media:#000000d9;--print-ink:#000;--print-tint:#eee;--draft-bg:#fff8e6;--draft-line:#d69e2e;--draft-ink:#8a5a00;--radius-none:0;--radius-soft:16px;--radius-round:50%;--shadow-banner:0 12px 60px #1f1f1f22;--shadow-toast:0 4px 30px #0002;--shadow-launcher:0 4px 24px #0002;--shadow-picked:inset 0 0 0 1px var(--dark);--shadow-focus:0 0 0 7px var(--white);--opacity-disabled:.6;--dur-fast:.2s;--dur-medium:.35s;--dur-slow:.5s;--ease-standard:ease;--video-width:min(420px,calc((100svh - var(--header-height) - var(--space-heading)) * 720 / 1280));--case-lead-ratio:4/3;--pair-ratio:4/3;--case-lead-width:min(560px,calc((100svh - 240px) * var(--case-lead-ratio)));--hero-wide-height:max(560px,calc(100svh - var(--header-height)));--hero-plate:600px;--hero-peek:160px;--stripe:12px;--divider-width:1080px;--divider-height:720px;--band-fade:24px;--col-ratio:357/1300;--col-out:96px;--colonnade-h:300px;--colonnade-out:36px;--decor-opacity:.15;--z-decor:-1}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-height) + var(--gap-tile));scroll-padding-bottom:var(--bar-height)}html:has(.compare-launcher:not([hidden])){scroll-padding-bottom:var(--bar-height-launcher)}html:has(.compare-launcher:not([hidden])) .site-footer{padding-bottom:var(--bar-height-launcher)}html:has(.cookie-banner:not([hidden])){scroll-padding-bottom:var(--bar-height-banner)}body{margin:0;background:var(--paper);color:var(--ink);font:400 var(--fs-body)/var(--lh-text) var(--body);-webkit-font-smoothing:antialiased}body.menu-open{overflow:hidden}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,select,summary{touch-action:manipulation}button{cursor:pointer}button:disabled,input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;opacity:var(--opacity-disabled)}.submit-button:disabled{cursor:wait}img{max-width:100%;display:block}main img{border-radius:var(--radius-soft)}figure{margin:0}svg{flex-shrink:0}ul,ol{padding-left:1.2rem}p{margin:0 0 1.2em}strong,b{font-weight:700}h1,h2,h3,h4{margin:0 0 12px;font-family:var(--display);font-weight:700;line-height:var(--lh-title);letter-spacing:var(--ls-title)}h1,h2,h3,h4,h5,h6{text-transform:uppercase}h1{font-size:var(--fs-h1);margin-bottom:24px}h1,h2{line-height:var(--lh-heading);letter-spacing:var(--ls-heading)}h2{font-size:var(--fs-h2);margin-bottom:.7em}h3{font-size:var(--fs-h4)}h1 em,h2 em{font-style:normal;color:var(--ink)}a:hover{color:var(--accent)}:focus-visible{outline:3px solid var(--ink);outline-offset:2px;box-shadow:var(--shadow-focus)}::selection{background:var(--line)}button.text-button{background:none;border:0;padding:0;color:inherit;text-decoration:underline;text-underline-offset:4px}button.text-button:hover{color:var(--accent)}[hidden]{display:none!important}.container{width:min(var(--container),calc(100% - 96px));margin-inline:auto}.eyebrow{display:flex;align-items:center;gap:16px;font-size:var(--fs-caption);font-weight:400;letter-spacing:var(--ls-caps);text-transform:uppercase;line-height:1.6;color:var(--muted)}.eyebrow>span:first-child{font-variant-numeric:tabular-nums}.small-line{width:32px;height:1px;background:currentColor}.lead{font-size:var(--fs-lead);max-width:var(--measure);color:var(--ink)}.fine-print{font-size:var(--fs-caption);color:var(--muted)}.button{display:inline-flex;justify-content:center;align-items:center;gap:28px;min-height:54px;padding:15px 23px;background:var(--dark);color:var(--white);border:1px solid var(--dark);border-radius:var(--radius-soft);font-size:var(--fs-caption);font-weight:700;line-height:1.4;transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard)}.button:hover{background:var(--accent);border-color:var(--accent);color:var(--white)}/* One filled button per first screen (UX-02): the header «Бесплатный замер» on desktop, the bottom bar on phones; hero buttons are outline. The direction hero and the 404 button keep class="button" in their markup (tests/catalog-copy.test.mjs, scripts/build.mjs) and take the outline look here. */.button-secondary,.product-hero .hero-actions>.button,.not-found>.button{background:transparent;color:var(--ink);border-color:var(--ink)}.button-secondary:hover,.product-hero .hero-actions>.button:hover,.not-found>.button:hover{background:var(--ink);border-color:var(--ink);color:var(--white)}.button-small{min-height:42px;padding:10px 15px;font-size:var(--fs-caption)}.text-link{display:inline-flex;align-items:center;gap:20px;background:none;border:0;border-bottom:1px solid var(--line);padding:9px 0;font-weight:600;font-size:var(--fs-caption);color:var(--ink);cursor:pointer}.text-link:hover{color:var(--accent);border-color:var(--accent)}.skip-link{position:absolute;z-index:var(--z-skip);left:20px;top:-200px;background:var(--dark);color:var(--white);padding:14px}.skip-link:focus{top:20px}.topline{background:var(--dark);color:var(--topline-ink);font-size:var(--fs-caption);letter-spacing:.04em}.topline .container{display:flex;justify-content:space-between;align-items:center;padding-block:8px}.topline a:hover{color:var(--white)}.site-header{position:sticky;top:0;z-index:var(--z-header);background:var(--paper);border-bottom:1px solid var(--line)}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;height:88px}.brand{width:150px;flex-shrink:0}.brand img{width:150px;height:auto}.desktop-nav{display:flex;gap:25px;margin-left:22px}.desktop-nav a{position:relative;font-size:var(--fs-caption);font-weight:500;padding:20px 0}.desktop-nav a[aria-current]:after{content:'';position:absolute;bottom:12px;left:0;right:0;height:1px;background:var(--accent)}.header-phone{font-size:14px;font-weight:600;white-space:nowrap;margin-left:auto}.header-cta{display:flex;align-items:center;gap:20px;font-size:var(--fs-caption);border:1px solid var(--line);border-radius:var(--radius-soft);padding:12px 16px}.header-cta:hover{border-color:var(--accent)}.menu-toggle{display:none;background:none;border:0;padding:12px;width:48px;height:48px}.menu-toggle span{display:block;width:24px;height:1.5px;background:var(--ink);margin:6px 0;transition:transform var(--dur-fast) var(--ease-standard)}.menu-toggle:hover span{background:var(--accent)}.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.8px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.8px) rotate(-45deg)}.mobile-nav{padding:20px 24px 40px;border-top:1px solid var(--line);max-height:calc(100dvh - 104px);overflow:auto}.mobile-nav a{display:flex;align-items:center;justify-content:space-between;font-size:var(--fs-body);min-height:44px;padding:12px 0;border-bottom:1px solid var(--line)}.mobile-nav-heading{margin:20px 0 0;font-size:var(--fs-caption);font-weight:600;letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--muted)}/* M013 T002: the home first screen is one visualization across the whole window under a dark card with the eyebrow, H1, text and buttons; the figure and the card share one grid cell, so the image is as tall as the card's row, and the proof points follow below. The card's place follows the approved mockup (reports/design-mockup-M013): from 701px a --hero-plate card centred in a first screen as tall as the window under the header (--hero-wide-height), on phones the card under a --hero-peek strip of the image. */.hero{display:grid;padding:0 0 var(--space-block)}.hero-photo,.hero-grid{grid-area:1/1}.hero-grid{display:flex;position:relative;z-index:var(--z-over-media)}.hero-copy{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;width:100%;max-width:var(--hero-plate);padding:var(--gap-col);background:var(--scrim-hero);border:1px solid var(--muted-dark);border-radius:var(--radius-soft);color:var(--paper)}.hero-copy>.eyebrow{color:var(--muted-dark)}.hero h1{margin:24px 0}.hero-copy h1 em{color:var(--paper)}.hero-copy>p{font-size:var(--fs-lead);color:var(--paper);max-width:var(--measure)}.hero-copy .button-secondary{color:var(--paper);border-color:var(--muted-dark)}.hero-actions{display:flex;align-items:center;gap:12px;margin-top:32px;flex-wrap:wrap}.hero-actions .button{padding-inline:18px;gap:18px}.hero-home-facts{grid-area:2/1;padding-top:var(--gap-row)}.hero-facts{border-top:1px solid var(--line);padding-top:24px;width:100%;font-size:var(--fs-small);color:var(--muted)}.hero-facts span{display:flex;gap:10px;align-items:baseline}.hero-facts b{font-weight:700;font-size:var(--fs-h4);color:var(--ink)}.hero-photo{position:relative;overflow:hidden;background:var(--media-dark)}.hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;border-radius:var(--radius-none)}@media(min-width:701px){.hero-grid{align-items:center;min-height:var(--hero-wide-height);padding-block:var(--gap-row)}}.section{padding-block:var(--space-section)}.section-topless{padding-top:0}.section-heading{position:relative;margin-bottom:var(--space-heading)}.section-heading>.eyebrow{margin:0 0 var(--gap-tile);white-space:nowrap}.section-heading h2{max-width:790px;margin-bottom:16px}.section-heading>div>:last-child{margin-bottom:0}/* M013 T005 (item 6): the heading of a section stands at the left edge of the text column; from 701px its eyebrow (no number) stands vertically left of it, in the page margin, its top level with the heading, and hangs down; on phones it stays above the heading. The sliding section of the flagship and the service panel carry the same eyebrow beside their own heading. The heading of a visualization gallery (web/visualizations.mjs) stands in the middle of the text column with the eyebrow horizontal above it, on every page with that gallery, as the approved mockup T009 sets it (owner 2026-10-17 09:02:32, M013 T007). */@media(min-width:701px){.section-heading>.eyebrow,.sliding-copy>.eyebrow:first-child,.service-panel>div>.eyebrow:first-child{position:absolute;top:0;right:100%;margin:0 var(--gap-field) 0 0;white-space:nowrap;writing-mode:vertical-rl;transform:rotate(180deg)}.sliding-copy,.service-panel>div{position:relative}.visualization-section .section-heading{text-align:center}.visualization-section .section-heading h2,.visualization-section .section-heading .section-description{margin-inline:auto}.visualization-section .section-heading>.eyebrow{position:static;writing-mode:horizontal-tb;transform:none;justify-content:center;margin:0 0 var(--gap-tile)}}.section-description{max-width:var(--measure);color:var(--ink);font-size:var(--fs-body)}.category-links{display:flex;gap:34px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;margin-bottom:35px}.category-links a{font-size:var(--fs-caption);display:flex;align-items:center;justify-content:space-between;gap:24px;flex:1}.category-links a+a{border-left:1px solid var(--line);padding-left:30px}.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-row) var(--gap-col)}.product-card{min-width:0}.card-photo{display:block;position:relative;aspect-ratio:1.32;overflow:hidden;background:var(--tint-photo);border-radius:var(--radius-soft)}.card-photo img{width:100%;height:100%;object-fit:cover;transition:transform var(--dur-slow) var(--ease-standard)}.card-photo:hover img{transform:scale(1.035)}.product-grid+.fine-print{margin-top:32px}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}/* The product hero follows the image's real proportions (width/height from the file): landscape images are shown whole, portrait video frames are cropped to 4:5. */.product-hero figure.hero-portrait>img{aspect-ratio:4/5}@media(min-width:1001px){.product-hero figure.hero-portrait{width:min(100%,calc((100svh - 240px) * .8));justify-self:end}}/* Phones (UX-01): the photo stands above the text and takes at most about a third of the space between the sticky header and the bottom bar, so the H1 under it (up to three lines, after the crumbs, caption and eyebrow) stays in the first screen from 360×780 up. */@media(max-width:700px){.product-hero figure{order:-1}.product-hero figure>img{max-height:calc((100svh - var(--header-height) - var(--bar-height)) * .35)}}.card-content{padding:24px 0 0}.card-content .eyebrow{margin-bottom:12px}.card-content p{font-size:var(--fs-small);color:var(--ink)}.card-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;border-top:1px solid var(--line);padding-top:14px;font-size:var(--fs-caption);font-weight:500;min-height:50px}.compare-check{display:flex;align-items:center;gap:6px;font-weight:600;white-space:nowrap;cursor:pointer;min-height:24px;border:1px solid var(--ink);border-radius:var(--radius-soft);padding:6px 10px;background:var(--white);transition:border-color var(--dur-fast) var(--ease-standard)}.compare-check input{width:14px;height:14px;accent-color:var(--dark);margin:0}.section-bottom{margin-top:var(--space-heading);display:flex;align-items:center;justify-content:space-between;gap:24px}.budget-section{background:var(--dark);color:var(--paper)}.budget-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-split)}.budget-grid h2{margin-top:24px}.budget-grid p{font-size:var(--fs-body);max-width:var(--measure);color:var(--muted-dark)}.budget-grid p.fine-print{font-size:var(--fs-caption)}.budget-section .eyebrow,.budget-section .fine-print{color:var(--muted-dark)}.budget-section .button{margin-top:18px;background:var(--paper);color:var(--dark);border-color:var(--paper)}.budget-section .button:hover{background:var(--hover-dark)}.budget-examples{display:flex;flex-direction:column;justify-content:center}.budget-examples>div{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:30px 0;border-bottom:1px solid var(--line-dark)}.budget-examples>div:first-child{border-top:1px solid var(--line-dark)}.budget-examples>div>span{font-size:var(--fs-h4);font-weight:400;line-height:1.5}.budget-examples small{display:block;font-size:var(--fs-small);color:var(--muted-dark)}.budget-examples strong{font-family:var(--display);font-size:var(--fs-h3);font-weight:700;white-space:nowrap;letter-spacing:var(--ls-heading)}.budget-examples>.fine-print{margin-top:20px}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-row) var(--gap-col)}.project-image{display:block;position:relative;aspect-ratio:.84;overflow:hidden;background:var(--band);border-radius:var(--radius-soft)}.project-image img{width:100%;height:100%;object-fit:cover}.project-card .eyebrow{margin-bottom:12px}.process-section{background:var(--tint)}.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap-row) var(--gap-col);list-style:none;padding:0;margin:0}.steps li{border-top:1px solid var(--line-strong);padding-top:24px}.step-number{font-size:var(--fs-caption);color:var(--accent);display:block;margin-bottom:12px}.steps p{font-size:var(--fs-small);color:var(--ink)}.faq-list{margin-left:var(--label-offset)}.faq-list details{border-top:1px solid var(--line)}.faq-list details:last-child{border-bottom:1px solid var(--line)}.faq-list summary{display:flex;gap:24px;justify-content:space-between;align-items:center;list-style:none;cursor:pointer;font-size:var(--fs-body);font-weight:500;padding:24px 0}.faq-list summary::-webkit-details-marker{display:none}.faq-list details[open] summary svg{transform:rotate(180deg)}.faq-list details>div{padding:0 32px 24px 0;font-size:var(--fs-small);color:var(--ink)}.cta-section{background:var(--band);padding:var(--space-block) 0}.cta-inner{display:flex;justify-content:space-between;align-items:center;gap:var(--gap-split)}.cta-inner h2{margin-top:24px}.cta-inner p{font-size:var(--fs-body);color:var(--ink);max-width:var(--measure)}.cta-inner>.button{flex-shrink:0}.site-footer{background:var(--dark);color:var(--footer-ink);padding-top:72px}.footer-top{display:grid;grid-template-columns:1.1fr 1fr .8fr 1.1fr;gap:42px;padding-bottom:64px}.footer-top>div{display:flex;flex-direction:column;align-items:flex-start;gap:12px;font-size:14px}.footer-top .eyebrow{color:var(--footer-eyebrow);margin-bottom:14px;font-size:var(--fs-caption)}.footer-top a:hover{color:var(--white)}.footer-brand{font-family:var(--display);font-size:var(--fs-h1);line-height:1.2;display:flex;flex-direction:column;letter-spacing:var(--ls-heading)}.footer-brand span{font-size:14px;letter-spacing:.02em}.footer-top p{font-size:14px;color:var(--footer-text);margin-top:12px}.footer-phone{font-size:17px;white-space:nowrap}.footer-bottom{display:flex;gap:26px;align-items:center;justify-content:space-between;padding:24px 0;border-top:1px solid var(--footer-line);font-size:14px;color:var(--footer-muted)}.footer-bottom .text-button{font-size:14px}.mobile-actions{display:none}.page-intro{padding-top:32px;padding-bottom:var(--space-block)}.breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:12px;font-size:var(--fs-caption);color:var(--muted);margin-bottom:var(--space-heading)}.breadcrumbs a{text-decoration:underline;text-underline-offset:3px}.page-intro>.eyebrow{margin-bottom:24px}.page-intro h1{max-width:1000px}.page-intro .lead{margin-bottom:0}.catalog-tools{display:flex;gap:var(--gap-col);margin-top:32px}.product-intro{padding-top:32px;padding-bottom:var(--space-block)}.product-hero{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-split);align-items:center}.product-hero h1{margin-top:24px;overflow-wrap:anywhere}.product-hero figure>img{width:100%;height:auto;object-fit:cover}.product-hero figcaption{font-size:var(--fs-caption);color:var(--muted);margin-top:12px}/* Phones held landscape (backlog 1, 667×375): a third of ~240px would cut the photo to a strip, so it keeps its own proportions (width follows the height) and fits whole between the sticky header and the bottom bar; left-aligned so the «Визуализация» badge stays on it. */@media(max-width:700px) and (orientation:landscape){.product-hero figure>img{width:auto;max-width:100%;max-height:calc(100svh - var(--header-height) - var(--bar-height) - var(--gap-tile))}}.price-note{border-top:1px solid var(--line);padding-top:24px;margin-top:32px}.price-note>span{display:block;font-size:var(--fs-caption);color:var(--muted);text-transform:uppercase;letter-spacing:var(--ls-caps);font-weight:600}.price-note strong{display:block;font-weight:700;font-size:var(--fs-lead);margin-block:8px}.price-note p{font-size:var(--fs-small);color:var(--ink)}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-row) var(--gap-col)}.feature-grid>div{border-top:1px solid var(--line);padding-top:calc(var(--gap-row) / 2)}.feature-grid p{color:var(--ink);font-size:var(--fs-small)}.use-cases{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.use-cases span{border:1px solid var(--ink);border-radius:var(--radius-soft);padding:10px 15px;font-size:var(--fs-caption)}.specification-section{background:var(--band)}.split{display:grid;grid-template-columns:1fr 1.3fr;gap:var(--gap-split)}.split h2{margin-top:24px}.split p{font-size:var(--fs-body);max-width:var(--measure);color:var(--ink)}.specs{margin:0}.specs>div{display:grid;grid-template-columns:150px 1fr;gap:24px;border-top:1px solid var(--line-strong);padding:20px 0}.specs dt{font-size:var(--fs-small);color:var(--muted)}.specs dd{font-size:var(--fs-small);margin:0}.important-note{padding:24px;background:var(--tint-strong);margin-top:24px;font-size:var(--fs-small)}.important-note strong{font-weight:700}.important-note li+li{margin-top:10px}.options-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-row) var(--gap-col)}.options-grid article{border-top:1px solid var(--line);padding-top:24px}.options-grid .eyebrow{margin-bottom:12px}.options-grid p{font-size:var(--fs-small);color:var(--ink)}.compare-picker{display:flex;flex-wrap:wrap;gap:10px}.compare-picker label{cursor:pointer;border:1px solid var(--ink);border-radius:var(--radius-soft);padding:10px 14px;font-size:var(--fs-caption);display:flex;gap:10px;align-items:center}.compare-picker input{accent-color:var(--dark);width:16px;height:16px}.compare-hint{font-size:var(--fs-caption);color:var(--muted);margin:16px 0 24px}.table-scroll{overflow-x:auto}.compare-table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--ink);border-radius:var(--radius-soft);min-width:600px;text-align:left}.compare-table th,.compare-table td{border:0;border-top:1px solid var(--line);border-left:1px solid var(--line);vertical-align:top;font-size:var(--fs-small);min-width:190px}.compare-table th{font-weight:500;background:var(--tint)}.compare-table thead th{font-size:var(--fs-small)}.compare-table tbody th{width:170px;min-width:140px;font-size:var(--fs-small);color:var(--muted);background:transparent}.project-detail{display:grid;grid-template-columns:1.35fr 1fr;gap:70px;align-items:start}.project-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.project-gallery img{width:100%;height:auto}.project-detail aside{position:sticky;top:130px}.project-detail aside h2{margin-top:20px;font-size:26px}.project-detail aside p{font-size:var(--fs-caption);color:var(--ink)}.project-detail aside .button{display:flex;margin-top:16px}.fact-list{padding:0;list-style:none;font-size:var(--fs-caption);margin-block:30px}.fact-list li{padding:15px 0;border-top:1px solid var(--line)}.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-row) var(--gap-col)}.guide-grid article{border-top:1px solid var(--line);padding:24px 0}.guide-grid h2{font-size:var(--fs-h4);line-height:var(--lh-title);letter-spacing:var(--ls-title);margin-bottom:12px}.guide-grid .eyebrow{margin-bottom:12px}.guide-grid p{color:var(--ink);font-size:var(--fs-small)}.article{padding-bottom:var(--space-section)}.prose h2{font-size:var(--fs-h3);margin-top:var(--space-heading);line-height:var(--lh-title);letter-spacing:var(--ls-title)}.prose>section:first-child>h2{margin-top:0}.prose p,.prose ul{max-width:var(--measure)}.prose a:not(.button){text-decoration:underline;text-underline-offset:4px}.prose li+li{margin-top:10px}.prose .faq-list{margin:var(--space-heading) 0}.related-links{display:flex;flex-wrap:wrap;gap:var(--gap-tile)}.related-links a{display:flex;align-items:center;gap:15px;padding:14px;border:1px solid var(--ink);border-radius:var(--radius-soft);font-size:var(--fs-caption)}.editorial-image{width:100%;height:100%;object-fit:cover;min-height:370px}.editorial-note{padding:32px;background:var(--tint);margin:32px 0;font-size:var(--fs-small)}.editorial-note a{text-decoration:underline}.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.contact-grid>a{border:1px solid var(--ink);border-radius:var(--radius-soft);padding:30px;display:flex;flex-direction:column;gap:25px}.contact-grid strong{font-family:var(--display);font-size:var(--fs-h4);font-weight:700;letter-spacing:var(--ls-title);line-height:var(--lh-title)}.contact-grid svg{align-self:flex-end}.contact-note{padding:var(--space-heading) 0;max-width:var(--measure)}.contact-note p{font-size:var(--fs-body);color:var(--ink)}.estimate-layout{display:grid;grid-template-columns:1.35fr 1fr;gap:var(--gap-split);align-items:start}fieldset{min-width:0}.form-panel{border:1px solid var(--ink);border-radius:var(--radius-soft);padding:32px;margin:0 0 32px}.form-panel legend{font-family:var(--display);font-size:var(--fs-h4);padding:0 12px;letter-spacing:var(--ls-title);line-height:var(--lh-title)}.form-panel legend>span{font-family:var(--body);font-size:var(--fs-caption);color:var(--accent);margin-right:10px}.form-panel label:not(.checkbox-row),.operator-login label,.operator-toolbar label{display:flex;flex-direction:column;gap:8px;font-size:var(--fs-small);font-weight:500;margin-bottom:20px}.form-panel input:not([type=checkbox]),.form-panel select,.operator-login input,.operator-toolbar select,.operator-card select{width:100%;min-width:0;border:1px solid var(--ink);border-radius:var(--radius-soft);background:transparent;padding:13px 12px;min-height:49px;color:var(--ink);font-size:var(--fs-small)}.form-panel input::placeholder{color:var(--placeholder)}.form-panel input:disabled{background:var(--band);color:var(--muted)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}.checkbox-row{display:flex;align-items:flex-start;gap:11px;font-size:var(--fs-small);font-weight:400;margin:4px 0 20px;cursor:pointer;min-height:24px}.checkbox-row input{width:18px;height:18px;margin:2px 0 0;flex-shrink:0;accent-color:var(--dark)}.faq-list summary:hover,.compare-check:hover,.checkbox-row:hover{color:var(--accent)}.consent-label{font-size:var(--fs-small)}.consent-label a{text-decoration:underline}.estimate-summary{position:sticky;top:115px;background:var(--tint);padding:32px}.estimate-summary h2{font-size:var(--fs-h3);line-height:var(--lh-title);letter-spacing:var(--ls-title)}.estimate-area{font-size:26px;font-weight:400;margin-top:35px}.estimate-area small{display:block;font-size:var(--fs-caption);color:var(--muted)}.estimate-price{font-family:var(--display);font-size:var(--fs-h1);line-height:1.5;font-weight:400;margin-top:20px;letter-spacing:var(--ls-heading)}.estimate-summary>p{font-size:var(--fs-small);color:var(--ink);margin-top:12px}.estimate-summary hr{border:0;border-top:1px solid var(--line-strong);margin:24px 0}.estimate-summary>strong{font-size:var(--fs-caption);font-weight:700}.estimate-summary ul{font-size:var(--fs-small);margin-top:14px}.summary-actions{display:grid;justify-items:start;gap:4px;margin:25px 0}.whatsapp-link{font-size:var(--fs-caption);text-decoration:underline;text-underline-offset:4px;display:block;padding-block:12px}.preview-note{font-size:var(--fs-caption);background:var(--band);padding:12px;color:var(--muted)}.honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.submit-button{width:100%;margin-block:15px}.submit-button+.fine-print{margin-top:16px}#form-status:not(:empty){display:flex;align-items:flex-start;gap:var(--gap-field);font-size:var(--fs-small);border:1px solid var(--line-status);border-radius:var(--radius-soft);background:var(--tint);padding:18px;margin-top:18px}#form-status p{margin:0}#form-status a{font-weight:600;text-decoration:underline}#form-status.sending-message{border-style:dashed}#form-status.success-message{border-color:var(--ink);background:var(--paper)}#form-status.error-message{border-color:var(--ink);background:var(--band)}.status-icon{flex:none;display:inline-grid;place-items:center;width:1.6em;height:1.6em;border:1px solid currentColor;border-radius:var(--radius-round);font-weight:600;line-height:1}.sending-message .status-icon{border-style:dashed}.error-message .status-icon{border-radius:var(--radius-none);border-color:var(--ink);background:var(--ink);color:var(--white)}.field-flag{font-size:var(--fs-caption);font-weight:400;color:var(--muted)}.form-panel .field{margin-bottom:var(--space-field)}.form-panel .field>label{margin-bottom:0}.field-error{font-size:var(--fs-small);font-weight:600;color:var(--ink);margin:var(--gap-field) 0 0}.form-panel input[aria-invalid=true]:not([type=checkbox]){border-color:var(--ink)}.submit-price{font-size:var(--fs-small);margin:var(--space-field) 0 0}.submit-price:not(.is-shown){visibility:hidden}.submit-price strong{font-weight:700}.operator-login{max-width:500px}.operator-login input{margin-bottom:10px}.operator-toolbar{display:flex;align-items:center;gap:22px}.operator-toolbar label{min-width:230px}.operator-summary{display:flex;flex-wrap:wrap;gap:12px;margin:25px 0}.operator-summary>*{border:1px solid var(--line);padding:15px;font-size:var(--fs-caption)}.operator-card{border:1px solid var(--line);padding:28px;margin:20px 0}.operator-card h2,.operator-card h3{font-size:20px}.operator-card p{font-size:var(--fs-caption);margin-bottom:8px}.operator-card dl{display:grid;grid-template-columns:180px 1fr;gap:8px 22px;font-size:var(--fs-caption)}.operator-card dd{margin:0;overflow-wrap:anywhere}.operator-card select{max-width:260px;margin:15px 16px 15px 0}.operator-card button{background:var(--dark);color:var(--white);border:1px solid var(--dark);padding:12px 20px;font-size:var(--fs-caption)}.cookie-banner{position:fixed;z-index:var(--z-cookie);bottom:20px;left:24px;width:min(490px,calc(100% - 48px));background:var(--paper);border:1px solid var(--ink);border-radius:var(--radius-soft);box-shadow:var(--shadow-banner);padding:23px}.cookie-banner strong{font-family:var(--display);font-size:var(--fs-small);font-weight:700;letter-spacing:var(--ls-title)}.cookie-banner p{font-size:var(--fs-caption);color:var(--ink);line-height:1.8;margin:12px 0 18px}.cookie-banner p a{text-decoration:underline}.cookie-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.cookie-actions .text-button{font-size:var(--fs-caption);padding:9px}.dialog{background:var(--paper);color:var(--ink);border:1px solid var(--ink);border-radius:var(--radius-soft);padding:38px;width:min(540px,calc(100% - 32px));max-height:calc(100dvh - 40px)}.dialog::backdrop{background:var(--backdrop);backdrop-filter:blur(3px)}.dialog .eyebrow{margin-top:10px}.dialog h2{font-size:var(--fs-h3);margin-top:16px;line-height:var(--lh-title);letter-spacing:var(--ls-title)}.dialog>p{font-size:var(--fs-small);color:var(--ink)}.dialog-close{position:absolute;right:12px;top:8px;line-height:1;width:40px;height:40px;border:0;background:none;color:var(--ink);font-size:28px}.consent-option{display:flex;justify-content:space-between;gap:24px;border-top:1px solid var(--line);padding:19px 0;cursor:pointer}.consent-option strong{font-size:var(--fs-caption);display:block;font-weight:700}.consent-option small{font-size:var(--fs-caption);color:var(--muted);display:block}.consent-option input{width:20px;height:20px;accent-color:var(--dark);flex-shrink:0}.dialog>.button{width:100%;margin-top:18px}.dialog>.fine-print{margin-top:18px}.toast{position:fixed;z-index:var(--z-toast);bottom:24px;left:50%;transform:translateX(-50%);max-width:calc(100% - 40px);background:var(--ink);color:var(--white);font-size:var(--fs-caption);padding:15px 25px;box-shadow:var(--shadow-toast)}
@media(max-width:1200px){.container{width:calc(100% - 64px)}.desktop-nav{gap:17px;margin-left:0}.header-inner{gap:18px}.header-phone{font-size:var(--fs-caption)}.brand,.brand img{width:125px}.header-cta{gap:12px}.hero-actions{gap:10px}.hero-actions .button{font-size:var(--fs-caption);padding-inline:14px;gap:12px}.budget-grid{gap:60px}.footer-top{gap:25px}.footer-phone{font-size:var(--fs-small)}.product-hero{gap:35px}.estimate-layout{gap:30px}.estimate-summary{padding:25px}.estimate-price{font-size:var(--fs-h1)}.contact-grid>a{padding:22px}.split{gap:55px}}
@media(max-width:1000px){.desktop-nav{display:none}.menu-toggle{display:block}.header-phone{font-size:var(--fs-caption)}.header-inner{height:76px}.hero h1{font-size:var(--fs-h1)}.section{padding-block:70px}.section-topless{padding-top:0}.section-heading h2{font-size:var(--fs-h2)}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap-col) var(--gap-tile)}.budget-grid{gap:38px}.project-grid{gap:20px}.project-card h3{font-size:var(--fs-h4)}.steps{grid-template-columns:repeat(2,1fr);gap:35px}.footer-top{grid-template-columns:1fr 1fr;gap:40px}.cta-inner h2{font-size:var(--fs-h2)}.product-hero{grid-template-columns:1fr 1fr;gap:30px;align-items:start}.product-hero h1{font-size:var(--fs-h1)}.product-hero .hero-actions .button{width:100%}.product-hero .hero-actions .text-link{margin-top:5px}.feature-grid h3,.feature-grid h2{font-size:var(--fs-h4)}.feature-grid{gap:var(--gap-col)}.split{grid-template-columns:1fr 1.35fr;gap:35px}.specs>div{grid-template-columns:120px 1fr;gap:18px}.options-grid{gap:24px}.options-grid h3{font-size:var(--fs-h4)}.project-detail{gap:35px;grid-template-columns:1fr 1fr}.project-gallery{grid-template-columns:1fr}.guide-grid{grid-template-columns:1fr;gap:15px}.guide-grid article{display:grid;grid-template-columns:1fr 2fr;column-gap:32px}.guide-grid article>h2{margin-top:0;grid-column:2}.guide-grid article>p,.guide-grid article>.text-link{grid-column:2}.guide-grid article>.text-link{justify-self:start}.estimate-layout{grid-template-columns:1fr}.estimate-summary{position:static;grid-row:1;padding:28px}.estimate-summary .estimate-area{float:right;font-size:var(--fs-h3);margin:0 0 15px 20px}.estimate-price{font-size:var(--fs-h1);margin-top:15px}.estimate-summary>.fine-print{max-width:650px}.summary-actions{display:flex;gap:25px;flex-wrap:wrap;margin:18px 0}.estimate-layout{gap:36px}.contact-grid{grid-template-columns:1fr}.contact-grid>a{display:grid;grid-template-columns:1.2fr 1fr 20px;align-items:center;gap:20px;padding:30px}.contact-grid svg{align-self:center}}
@media(max-width:700px){:root{--container:100%;--fs-h3:22px;--fs-lead:19px;--fs-small:15px;--fs-caption:14px;--header-height:69px;--bar-height:calc(55px + max(10px, env(safe-area-inset-bottom, 0px)));--bar-height-launcher:calc(var(--bar-height) + 68px);--bar-height-banner:280px;--thead-height:136px;--space-section:48px;--space-block:32px;--space-heading:24px;--space-colonnade:148px;--gap-split:32px;--gap-col:24px;--gap-row:32px;--divider-height:480px;--band-fade:16px;--colonnade-h:168px;--colonnade-out:20px;--decor-opacity:.1}.container{width:calc(100% - 40px)}.topline .container{padding-block:7px}.topline a{display:none}.header-inner{height:68px;gap:8px}.brand,.brand img{width:119px}.header-phone{display:none}.header-cta{display:none}.menu-toggle{width:44px;padding:8px;flex-shrink:0}.mobile-nav{max-height:calc(100dvh - 121px - 55px - max(10px,env(safe-area-inset-bottom)))}.hero-grid{flex-direction:column;padding:var(--hero-peek) 0 var(--gap-tile)}.hero-copy{padding:var(--gap-tile)}.hero-copy>.eyebrow{font-size:var(--fs-caption);gap:10px}.small-line{width:20px}.hero h1{font-size:var(--fs-h1);line-height:1.3;letter-spacing:-.055em;margin:var(--gap-tile) 0}.hero-copy>p{line-height:1.9}.hero-copy p br{display:none}.hero-actions{width:100%;gap:10px;margin-top:7px}.hero-actions .button{font-size:var(--fs-caption);padding:13px 12px;gap:10px;min-height:49px}.hero-actions>.button{flex:1}.hero-facts{padding-top:17px}.hero-copy .hero-actions{margin-top:var(--gap-tile)}.section{padding-block:var(--space-section)}.section-topless{padding-top:0}.section-heading h2{font-size:var(--fs-h2);line-height:1.4;letter-spacing:-.045em}.section-description{line-height:1.9}.eyebrow{gap:12px}.category-links{flex-direction:column;gap:0;padding:0;margin-bottom:28px}.category-links a{padding:15px 0;font-size:var(--fs-caption)}.category-links a+a{border-left:0;padding-left:0;border-top:1px solid var(--line)}.product-grid{grid-template-columns:1fr;gap:var(--gap-col)}.card-photo{aspect-ratio:1.4}.card-content h3{font-size:var(--fs-h4)}.card-content p{line-height:1.9}.card-content .eyebrow{font-size:var(--fs-caption)}.section-bottom{margin-top:var(--space-heading);gap:18px;align-items:flex-start;flex-wrap:wrap}.button{min-height:50px;padding:14px 19px;gap:23px}.section-bottom .text-link{font-size:var(--fs-caption)}.budget-grid{grid-template-columns:1fr;gap:32px}.budget-grid h2{font-size:var(--fs-h2);line-height:1.35}.budget-grid .fine-print{font-size:var(--fs-caption)}.budget-examples>div{padding:22px 0}.project-grid{grid-template-columns:1fr;gap:33px}.project-image{aspect-ratio:1;max-height:500px}.project-card h3{font-size:var(--fs-h4)}.project-card .eyebrow{font-size:var(--fs-caption)}.project-image img{object-position:center 43%}.steps{grid-template-columns:1fr 1fr;gap:27px 24px}.steps h3{font-size:var(--fs-small);line-height:1.5}.steps p{line-height:1.85}.step-number{margin-bottom:20px}.faq-list{margin-left:0}.faq-list summary{padding-block:21px;line-height:1.8}.faq-list details>div{padding-right:20px}.cta-section{padding:var(--space-block) 0}.cta-inner{flex-direction:column;align-items:flex-start;gap:15px}.cta-inner h2{font-size:var(--fs-h2);line-height:1.4}.cta-inner>.button{width:100%}.site-footer{padding-top:46px;padding-bottom:var(--bar-height)}html:has(.compare-launcher:not([hidden])) .site-footer{padding-bottom:var(--bar-height-launcher)}html:has(.cookie-banner:not([hidden])) .site-footer{padding-bottom:var(--bar-height-banner)}.footer-top{grid-template-columns:1fr 1fr;gap:36px 24px;padding-bottom:35px}.footer-top>div:first-child{grid-column:1/-1}.footer-top>div:last-child{grid-column:1/-1}.footer-top>div{font-size:var(--fs-small);gap:11px}.footer-top .eyebrow{font-size:var(--fs-caption);margin-bottom:6px}.footer-brand{font-size:var(--fs-h1)}.footer-top p{font-size:var(--fs-small);margin-bottom:0}.footer-phone{font-size:var(--fs-small)}.footer-bottom{display:grid;grid-template-columns:1fr 1fr;gap:15px;font-size:var(--fs-caption);padding:22px 0}.footer-bottom .text-button{font-size:var(--fs-caption);text-align:left}.mobile-actions{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:var(--z-mobile-bar);background:var(--paper);border-top:1px solid var(--line);padding:10px 16px max(10px,env(safe-area-inset-bottom));gap:12px}.mobile-actions a{display:flex;align-items:center;justify-content:center;gap:16px;min-height:44px;border-radius:var(--radius-soft);font-size:var(--fs-caption);font-weight:700}.mobile-actions a:first-child{flex:1.5;background:var(--dark);color:var(--white)}.mobile-actions a:last-child{flex:1;border:1px solid var(--ink)}.cookie-banner{bottom:calc(var(--bar-height) + var(--gap-tile));left:12px;width:calc(100% - 24px);padding:17px}.cookie-banner strong{font-size:var(--fs-small)}.cookie-banner p{font-size:var(--fs-caption);margin-block:8px 12px;line-height:1.7}.cookie-actions{gap:8px}.cookie-actions .button{min-height:39px;padding:9px 10px;font-size:var(--fs-caption);flex:1;white-space:nowrap}.cookie-actions .text-button{font-size:var(--fs-caption);padding:7px 4px}.dialog{padding:26px}.consent-option{padding:16px 0}.consent-option small{font-size:var(--fs-caption)}.toast{bottom:80px;font-size:var(--fs-caption);width:max-content}.page-intro{padding-top:22px;padding-bottom:var(--space-block)}.breadcrumbs{gap:8px;margin-bottom:var(--space-heading)}.page-intro>.eyebrow{margin-bottom:20px}.page-intro h1{font-size:var(--fs-h1);line-height:1.4;overflow-wrap:anywhere}.page-intro .lead{font-size:var(--fs-lead);margin-top:22px;line-height:1.9}.catalog-tools{gap:20px;flex-wrap:wrap;margin-top:20px}.catalog-tools .text-link{font-size:var(--fs-caption)}.product-intro{padding-top:22px;padding-bottom:0}.product-hero{grid-template-columns:1fr;gap:30px}.product-hero h1{font-size:var(--fs-h1);margin-top:20px;line-height:1.35}.product-hero .lead{font-size:var(--fs-lead);line-height:1.85}.product-hero .hero-actions{display:flex}.product-hero .hero-actions .button{width:auto}.product-hero .hero-actions .text-link{margin:0;padding:13px}.feature-grid{grid-template-columns:1fr;gap:calc(var(--gap-row) / 2)}.feature-grid h3,.feature-grid h2{font-size:var(--fs-h4)}.use-cases{gap:8px;margin-top:10px}.use-cases span{padding:8px 11px}.split{grid-template-columns:1fr;gap:27px}.split h2{font-size:var(--fs-h2);margin-top:16px}.specs>div{grid-template-columns:110px 1fr;gap:15px;padding:17px 0}.important-note{padding:22px}.options-grid{grid-template-columns:1fr;gap:22px}.options-grid .eyebrow{margin-bottom:15px}.options-grid h3{font-size:var(--fs-h4)}.compare-picker{gap:8px}.compare-picker label{padding:9px 10px}.compare-picker input{width:16px;height:16px}.compare-table th,.compare-table td{min-width:160px}.compare-table tbody th{min-width:110px}.project-detail{grid-template-columns:1fr;gap:30px}.project-gallery{grid-template-columns:1fr 1fr;gap:12px}.project-detail aside{position:static}.project-detail aside h2{font-size:var(--fs-h3)}.project-detail aside p,.fact-list{font-size:var(--fs-caption)}.guide-grid article{display:block}.guide-grid h2{margin-top:20px}.article{padding-bottom:50px}.article h1{font-size:var(--fs-h1)}.prose{font-size:var(--fs-body);line-height:1.95}.prose h2{margin-top:35px}.editorial-image{min-height:280px;aspect-ratio:1.2}.editorial-note{padding:25px}.contact-grid>a{display:flex;gap:18px;align-items:flex-start;padding:25px}.contact-grid svg{align-self:flex-end}.contact-note{padding:25px 0}.estimate-summary{padding:23px}.estimate-price{font-size:var(--fs-h1);clear:both}.estimate-summary .estimate-area{float:none;font-size:var(--fs-h3);margin-top:25px}.estimate-summary .summary-actions{flex-direction:column;align-items:flex-start;gap:3px}.estimate-summary .summary-actions button{font-size:var(--fs-caption)}.estimate-summary .whatsapp-link{font-size:var(--fs-caption)}.form-panel{padding:20px 16px}.form-row{grid-template-columns:1fr;gap:13px}.form-panel input:not([type=checkbox]),.form-panel select{font-size:var(--fs-lead);padding:11px 9px}.form-panel label:not(.checkbox-row){font-size:var(--fs-small)}.form-panel .fine-print{font-size:var(--fs-caption)}.form-panel .submit-button{font-size:var(--fs-caption)}.operator-toolbar{flex-wrap:wrap;gap:15px}.operator-card{padding:18px}.operator-card dl{grid-template-columns:100px 1fr;font-size:var(--fs-caption)}.operator-card h2,.operator-card h3{font-size:var(--fs-h4)}.operator-card select{max-width:100%;font-size:var(--fs-lead)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
@media print{.site-header,.topline,.site-footer,.mobile-actions,.cookie-banner,.dialog,.summary-actions,.whatsapp-link,.form-panel:nth-child(2),.skip-link{display:none!important}body{background:var(--white);color:var(--print-ink);font-size:11pt}.container{width:100%}.page-intro{padding:20px 0}.page-intro h1{font-size:24pt}.estimate-layout{display:block}.estimate-summary{position:static;page-break-inside:avoid;background:var(--print-tint)}.estimate-summary ul,.estimate-summary>strong,.estimate-summary hr{display:block}.section{padding:20px 0}.breadcrumbs{display:none}a:after{content:none!important}.estimate-layout>.estimate-summary{margin-top:25px}}.compare-launcher{position:fixed;bottom:24px;right:24px;background:var(--dark);color:var(--white);z-index:var(--z-compare);padding:15px 22px;font-size:var(--fs-caption)}.compare-launcher:not(:focus-visible){box-shadow:var(--shadow-launcher)}.compare-launcher:hover{color:var(--white);background:var(--accent)}.compare-launcher[hidden]{display:none}.operator-card{padding:24px;border:1px solid var(--line);margin-top:20px}.operator-card-header{display:flex;align-items:start;justify-content:space-between;gap:20px}.operator-details{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 30px}.operator-details dt{font-size:var(--fs-caption);color:var(--muted);margin-top:12px}.operator-details dd{margin:4px 0;overflow-wrap:anywhere}.operator-actions{display:flex;gap:14px;align-items:end;margin-top:24px}.operator-actions select{padding:12px}.operator-phone{font-size:18px}.operator-empty{padding:30px;background:var(--tint)}.operator-more{margin-top:24px}.operator-card h2{font-size:23px}@media(max-width:700px){.compare-launcher{bottom:calc(var(--bar-height) + var(--gap-tile));right:16px;padding:12px 16px}.operator-details{grid-template-columns:1fr}.operator-card-header{flex-direction:column}}.portfolio-filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}.portfolio-filter{display:flex;align-items:center;gap:14px;background:transparent;border:1px solid var(--ink);border-radius:var(--radius-soft);padding:12px 17px;color:var(--ink);font-size:var(--fs-caption);min-height:46px}.portfolio-filter span{font-size:var(--fs-caption);opacity:.8}.portfolio-filter[aria-pressed=true]{background:var(--dark);border-color:var(--dark);color:var(--white)}.video-dialog-close:hover,.portfolio-filter:hover:not([aria-pressed=true]),.compare-picker label:hover,.compare-check:hover{border-color:var(--accent)}.portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-row) var(--gap-col)}.portfolio-cover{display:block;aspect-ratio:4/5;background:var(--media-dark);position:relative;overflow:hidden;border-radius:var(--radius-soft)}.portfolio-cover img{width:100%;height:100%;object-fit:cover;transition:transform var(--dur-medium) var(--ease-standard)}.portfolio-cover:hover img{transform:scale(1.035)}.portfolio-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:62px;height:62px;display:grid;place-items:center;border:1px solid var(--play-line);border-radius:var(--radius-round);background:var(--play-fill);color:var(--white);z-index:var(--z-over-media);backdrop-filter:blur(5px)}.portfolio-card>.eyebrow{margin:24px 0 12px}.portfolio-card>p{font-size:var(--fs-small);color:var(--ink);max-width:38em}.video-dialog{padding:0;border:0;width:min(1060px,calc(100vw - 64px));max-height:calc(100dvh - 64px);overflow:auto;background:var(--paper);color:var(--ink)}.video-dialog[open]{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}.video-dialog::backdrop{background:var(--backdrop-media);backdrop-filter:blur(5px)}.video-stage{background:var(--dark);display:grid;place-items:center;min-height:480px}.video-stage video{display:block;width:100%;max-height:calc(100dvh - 64px);object-fit:contain}.video-dialog-close{position:absolute;right:12px;top:12px;width:44px;height:44px;border:1px solid var(--ink);border-radius:var(--radius-soft);background:var(--paper);font-size:29px;line-height:1;z-index:var(--z-dialog-close)}.video-dialog-details{padding:75px 35px 40px;align-self:center}.video-dialog-details h2{font-size:var(--fs-h3);margin-top:16px;line-height:var(--lh-title);letter-spacing:var(--ls-title)}.video-dialog-details>p{font-size:var(--fs-small)}.video-dialog-details .button{margin-top:16px}.portfolio-count{margin-bottom:24px}@media(max-width:1000px){.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap-col) var(--gap-tile)}.video-dialog-details{padding:60px 24px 25px}}@media(max-width:700px){.portfolio-grid{grid-template-columns:1fr;gap:var(--gap-col)}.portfolio-cover{aspect-ratio:4/4.4}.portfolio-card h3{font-size:var(--fs-h3)}.portfolio-filter{padding:11px 13px;gap:9px}.video-dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}.video-dialog[open]{display:block}.video-stage{min-height:0}.video-stage video{height:auto;max-height:61dvh}.video-dialog-details{padding:25px 22px}.video-dialog-details h2{margin-top:12px}.video-dialog-details .eyebrow{font-size:var(--fs-caption)}.video-dialog-close{position:fixed;right:22px;top:22px}.video-dialog-details .button{margin-top:4px}}@media print{.video-dialog,.portfolio-filters{display:none!important}}.individual-price{font-family:var(--display);font-size:var(--fs-h3);line-height:1.4;overflow-wrap:normal}.project-options{margin-top:24px;border-top:1px solid var(--line);padding-top:24px}.field-label{display:block;font-size:var(--fs-small);margin-bottom:12px;font-weight:600}.estimate-options{font-size:var(--fs-small);color:var(--muted)}.flagship-note{border-left:3px solid var(--accent);padding:14px 20px;margin-top:26px;font-size:var(--fs-caption);line-height:1.8;background:var(--tint)}@media(max-width:700px){.hero-home h1{font-size:var(--fs-h1);letter-spacing:-.055em}.individual-price{font-size:var(--fs-h3)}.project-options .field-label{font-size:var(--fs-small)}}/* Owner-provided architectural visualizations, kept distinct from built projects. */.visualization-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-row) var(--gap-col)}@media(min-width:701px){.visualization-grid-pair{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Tablet: a third product card sits centred under the first two — on every page, including the home teaser. */
@media(min-width:701px) and (max-width:1000px){.product-grid .product-card:last-child:nth-child(3){grid-column:1/-1;justify-self:center;width:calc(50% - var(--gap-tile) / 2)}}.visualization-card{min-width:0}.visualization-link{display:flex;flex-direction:column;height:100%;color:var(--ink)}.visualization-cover{aspect-ratio:3/2;overflow:hidden;background:var(--band);border-radius:var(--radius-soft)}.visualization-cover img{width:100%;height:100%;object-fit:cover}.visualization-cover-portrait img{object-fit:contain}.visualization-caption{flex:1;display:flex;flex-direction:column;align-items:flex-start;padding:24px 0 16px;border-bottom:1px solid var(--line)}.visualization-caption h3{overflow-wrap:anywhere}.visualization-action{align-self:stretch;margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:var(--fs-caption);font-weight:500;color:var(--muted)}.visualization-action>span{font-size:19px;line-height:1}.visualization-link:hover .visualization-action{color:var(--accent)}.visualization-more{margin-top:var(--space-heading)}.visualization-more>summary{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-height:52px;padding:14px 20px;border:1px solid var(--ink);border-radius:var(--radius-soft);list-style:none;cursor:pointer;font-size:var(--fs-caption);font-weight:600}.visualization-more>summary::-webkit-details-marker{display:none}.visualization-more>summary:hover{color:var(--accent);border-color:var(--accent)}.visualization-more[open]>summary svg{transform:rotate(180deg)}.visualization-more>.visualization-grid{margin-top:var(--gap-row)}@media(max-width:1000px){.visualization-grid{gap:var(--gap-col) var(--gap-tile)}.visualization-caption h3{font-size:var(--fs-h4)}}@media(max-width:700px){.visualization-grid{grid-template-columns:1fr;gap:var(--gap-col)}.visualization-caption{padding-top:17px}.visualization-caption h3{font-size:var(--fs-h4)}.visualization-more{margin-top:26px}.visualization-more>summary{width:100%;min-height:52px}.visualization-more>.visualization-grid{margin-top:28px}}@media print{.visualization-more>summary{display:none}.visualization-card{break-inside:avoid}}
/* == home == */
/* Desktop: the 4:5 video frame is shown whole, as tall as the first screen allows; tablets and phones keep the square crop. The caption stays left of the watermark at the bottom centre. */
.hero-proof{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.hero-proof span{display:grid;align-content:start;gap:4px;line-height:1.5}.hero-proof b{white-space:nowrap}.why-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap-row) var(--gap-col)}.why-grid>div{border-top:1px solid var(--line);padding-top:24px}.why-grid p{font-size:var(--fs-small);color:var(--ink);margin:0}.home-directory{display:grid;grid-template-columns:2fr 1fr 1fr;gap:var(--gap-col);margin-top:var(--space-block)}.home-directory ul{list-style:none;padding:0;margin:14px 0 0;border-top:1px solid var(--line)}.home-directory>div:first-child ul{columns:2;column-gap:var(--gap-col)}.home-directory li{break-inside:avoid;border-bottom:1px solid var(--line)}.home-directory li a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;font-size:var(--fs-small);line-height:1.5}.budget-actions{display:flex;align-items:center;gap:32px;flex-wrap:wrap;margin-top:32px}.budget-section .budget-actions .button{margin-top:0}.budget-section .text-link{color:var(--paper);border-color:var(--muted-dark)}.budget-section .text-link:hover{color:var(--hover-dark);border-color:var(--hover-dark)}
@media(max-width:1000px){.why-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-directory{grid-template-columns:1fr 1fr}.home-directory>div:first-child{grid-column:1/-1}}
@media(max-width:700px){.hero-proof{grid-template-columns:1fr 1fr;gap:14px}.why-grid{grid-template-columns:1fr;gap:23px}.home-directory{grid-template-columns:1fr;margin-top:40px}.home-directory>div:first-child ul{columns:1}}/* == product == *//* Terms strip: the conditions and the service page links, one under the other. */
.terms-links{display:grid;justify-items:start;gap:2px}/* LCP tie-break (D-06): on /catalog/ both this card's photo and the next card's photo (data-category="bioklimaticheskie-pergoly") are eager (D-05) and render at the identical .card-photo box size — Chromium's LCP-size heuristic reads them as exactly tied and, empirically, keeps whichever finishes painting last in that frame, which is not reliably this (first) card. Unlike transform (paint-only, see the next rule), width/height change the ![]()
's own layout box, which is what that heuristic reads — a 6% bump (clipped by the same overflow:hidden .card-photo) makes this card's declared size strictly the larger one and settles the tie for good (UX-08 gap found while implementing D-05/D-06). The card frame itself is clean (media/frames/flagship-card.webp, cut above the «ALUM PERGOLA» watermark), so the bump needs no top anchor (M002 T007 removed U-02). */.product-card[data-category="sdvizhnye-bioklimaticheskie-pergoly"] .card-photo img{width:106%;height:106%;max-width:none;margin-left:-3%}/* Catalogue: groups first (UX-08/D-01), then "О каталоге" (one column, --measure wide, the label-left layout comes free from .catalog-group) below them, before the fine print. */.catalog-intro{max-width:var(--measure)}.catalog-intro p{font-size:var(--fs-body);color:var(--ink)}.catalog-intro p+p{margin-top:var(--gap-tile)}.catalog-group+.catalog-group{margin-top:var(--space-block);padding-top:var(--space-heading);border-top:1px solid var(--line)}.catalog-group-heading h2{margin-bottom:16px}.catalog-group-heading p{font-size:var(--fs-body);color:var(--ink);max-width:360px;margin:0}.catalog-group+.fine-print{margin-top:var(--space-heading)}
@media(min-width:1001px){.catalog-group{display:grid;grid-template-columns:var(--label-cols);gap:var(--label-gap);align-items:start}.catalog-group-heading{position:sticky;top:130px}.catalog-group .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-group .product-card:last-child:nth-child(odd){grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap-col);align-items:start}.catalog-group .product-card:last-child:nth-child(odd) .card-content{padding-top:0}.catalog-group .product-card:last-child:nth-child(odd)>.photo-caption{grid-column:1;margin:0}.catalog-group .product-card:last-child:nth-child(odd)>.card-content{grid-column:2;grid-row:1/span 2}.project-grid>.project-card:only-child{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto auto 1fr auto;column-gap:var(--gap-col)}.project-grid>.project-card:only-child>.project-image{grid-column:1;grid-row:1/span 3}.project-grid>.project-card:only-child>.photo-caption{grid-column:1;grid-row:4}.project-grid>.project-card:only-child>:not(.project-image,.photo-caption){grid-column:2/-1;align-self:start}}
@media(max-width:1000px){.catalog-group-heading{margin-bottom:28px}}@media(max-width:700px){.catalog-group-heading{margin-bottom:var(--gap-tile)}}/* Product page: scope note, flagship section with small portrait media (never upscaled), summary, types, pairing (desktop columns follow the option grid, sized by data-pairs), terms, measurement checks, reading. */.scope-note{margin:24px 0 0;padding:16px 20px;border-left:3px solid var(--accent);background:var(--tint);font-size:var(--fs-small)}.scope-note strong{font-weight:700}.sliding-section{background:var(--band)}.sliding-copy>.eyebrow{margin-bottom:24px}.sliding-copy>p{font-size:var(--fs-body);color:var(--ink);max-width:var(--measure)}.sliding-modes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap-col);margin:32px 0;max-width:var(--measure)}.sliding-modes>div{border-top:1px solid var(--line-strong);padding-top:24px}.sliding-modes strong{display:block;font-weight:700;font-size:var(--fs-body);margin-bottom:8px}.sliding-modes p{font-size:var(--fs-small);color:var(--ink);margin:0}.sliding-media{display:grid;grid-template-columns:repeat(2,minmax(0,200px));gap:24px;align-items:start}.sliding-tile{display:flex;flex-direction:column;gap:8px;color:var(--ink)}.sliding-thumb{position:relative;display:block;aspect-ratio:9/16;overflow:hidden;background:var(--media-dark);margin-bottom:6px}.sliding-thumb img{width:100%;height:100%;object-fit:cover}.sliding-tile strong{font-size:var(--fs-small);font-weight:700;line-height:1.5}.sliding-tile-note{font-size:var(--fs-caption);color:var(--muted)}.sliding-tile:hover strong{color:var(--accent)}
@media(min-width:1001px){.sliding-layout{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--gap-split);align-items:center}}@media(max-width:1000px){.sliding-media{margin-top:40px}}.product-summary{display:grid;grid-template-columns:1fr 1.3fr;gap:var(--gap-split);margin-top:var(--space-block);padding-top:var(--space-heading);border-top:1px solid var(--line)}.product-summary h3{font-size:var(--fs-h4);margin-bottom:16px}.product-summary .use-cases{margin-top:0}.product-summary .fine-print{margin-top:14px}.type-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-row) var(--gap-col)}.type-grid article{border-top:1px solid var(--line);padding-top:24px}.type-grid h2{font-size:var(--fs-h4);line-height:var(--lh-title);margin-bottom:12px;letter-spacing:var(--ls-title)}.type-grid p{font-size:var(--fs-small);color:var(--ink)}.option-links{display:flex;flex-wrap:wrap;gap:4px var(--gap-col);margin:4px 0 0}.section-heading+.product-pairing{margin-top:0;padding-top:0;border-top:0}.product-pairing{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--gap-split);margin-top:var(--space-block);padding-top:var(--space-heading);border-top:1px solid var(--line)}.product-pairing h3{font-size:var(--fs-h4);margin-bottom:16px}.pair-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-col)}.pair-card{display:flex;flex-direction:column;gap:6px;color:var(--ink)}.pair-photo{position:relative;display:block;aspect-ratio:3/2;overflow:hidden;background:var(--tint-photo);margin-bottom:8px;border-radius:var(--radius-soft)}.pair-photo img{width:100%;height:100%;object-fit:cover;transition:transform var(--dur-slow) var(--ease-standard)}.pair-card:hover img{transform:scale(1.035)}.pair-card strong{font-weight:700;font-size:var(--fs-small)}.pair-card small{font-size:var(--fs-caption);color:var(--muted)}.pair-card:hover strong{color:var(--accent)}.alt-list{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}.alt-list li{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:16px 0;border-bottom:1px solid var(--line)}.alt-list span{font-size:var(--fs-small);color:var(--muted)}.alt-list .text-link{border-bottom:0;padding:4px 0}.terms-strip{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--gap-split);margin-top:var(--space-block);padding-top:var(--space-heading);border-top:1px solid var(--line-strong)}.terms-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-col);margin:0}.terms-list dt{font-size:var(--fs-caption);font-weight:600;letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--accent);margin-bottom:8px}.terms-list dd{margin:0;font-size:var(--fs-body)}.calendar-note{font-size:var(--fs-caption);color:var(--muted)}.calendar-note strong{color:var(--ink);font-weight:700}.measure-checks{padding:32px;background:var(--band);font-size:var(--fs-small)}.measure-checks h3{font-size:var(--fs-h4);margin-bottom:16px}.measure-checks p{color:var(--ink);margin-bottom:14px}.measure-checks ul{margin:0;padding-left:1.1rem}.measure-checks li+li{margin-top:10px}.measure-checks strong{font-weight:700}.reading-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--gap-row) var(--gap-col)}.reading-grid article{display:flex;flex-direction:column;align-items:flex-start;border-top:1px solid var(--line);padding-top:24px}.reading-grid h3{margin:12px 0}.reading-grid p{font-size:var(--fs-small);color:var(--ink)}.reading-grid .text-link{margin-top:auto}.cta-actions{display:flex;flex-direction:column;align-items:flex-end;gap:16px;flex-shrink:0}
@media(min-width:1001px){.product-pairing{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-col)}.product-pairing>div:first-child{grid-column:span 2}.product-pairing>div:only-child{grid-column:1/-1}.product-pairing[data-pairs="1"]>div:first-child:not(:only-child){grid-column:span 1}.product-pairing[data-pairs="1"]>div+div{grid-column:span 2}.product-pairing[data-pairs="2"] .pair-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap-col)}.product-pairing[data-pairs="1"] .pair-grid{grid-template-columns:minmax(0,1fr)}.product-pairing[data-pairs="1"] .alt-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gap-col)}.product-steps .steps{grid-template-columns:repeat(3,minmax(0,1fr))}.faq-layout{display:grid;grid-template-columns:var(--label-cols);gap:var(--label-gap);align-items:start}.faq-layout>.faq-list{margin-left:0}}
@media(max-width:1000px){.product-summary,.product-pairing,.terms-strip{grid-template-columns:1fr;gap:36px}.type-grid{grid-template-columns:1fr;gap:24px}.measure-checks{margin-bottom:36px}}
@media(max-width:700px){.pair-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.terms-list{grid-template-columns:1fr;gap:20px}.cta-actions{align-items:stretch;width:100%}.cta-actions .button{width:100%}}/* == projects == *//* Case page: the Instagram source is a quiet link under the closing CTA button. */
.cta-actions .case-source{color:var(--muted);border-bottom-color:transparent;font-weight:500}.cta-actions .case-source:hover{color:var(--accent);border-color:var(--accent)}
@media(min-width:701px){.project-image{aspect-ratio:4/5}}.project-card>p{font-size:var(--fs-small);color:var(--ink);margin:0;max-width:34em}.portfolio-object a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}.portfolio-object a:hover{color:var(--accent)}.portfolio-card:target .portfolio-cover:not(:focus-visible){outline:2px solid var(--accent);outline-offset:6px}/* Case page: hero with the lead frame, story steps with the systems panel, then the object's video and frames. The lead frame is a 4:3 window above the video watermark (--case-lead-ratio, M003 T007); --case-lead-width keeps it inside the first screen. */.case-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--gap-split);align-items:center}.case-hero h1{margin-top:24px;overflow-wrap:anywhere}.case-nobr,.nobr{white-space:nowrap}.case-hero .hero-actions{gap:16px var(--gap-col)}.case-lead{justify-self:end;width:min(100%,var(--case-lead-width))}.case-lead img,.case-frame img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}.case-lead img{aspect-ratio:var(--case-lead-ratio)}.case-lead figcaption,.case-frame figcaption{font-size:var(--fs-caption);color:var(--muted);margin-top:12px}.case-story{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:var(--gap-split);align-items:start}.case-steps>div{display:grid;grid-template-columns:190px minmax(0,1fr);gap:var(--gap-col);border-top:1px solid var(--line);padding:32px 0}.case-steps h2{font-size:var(--fs-h4);line-height:var(--lh-title);margin:0;display:flex;align-items:baseline;gap:14px;letter-spacing:var(--ls-title)}.case-steps h2 span{font:700 var(--fs-caption)/1.6 var(--body);letter-spacing:var(--ls-caps);color:var(--muted)}.case-steps p{font-size:var(--fs-body);margin:0;max-width:var(--measure)}.case-details{margin:0;display:grid}.case-details>div{display:grid;grid-template-columns:130px minmax(0,1fr);gap:20px;padding:12px 0;border-top:1px solid var(--line);align-items:baseline}.case-details>div:first-child{border-top:0;padding-top:4px}.case-details dt{font-size:var(--fs-caption);color:var(--muted)}.case-details dd{margin:0;font-size:var(--fs-small)}.case-systems{position:sticky;top:130px;background:var(--tint);padding:32px}.case-systems h2{font-size:var(--fs-h4);margin-bottom:16px;line-height:var(--lh-title);letter-spacing:var(--ls-title)}.case-systems ul{list-style:none;padding:0;margin:0 0 18px}.case-systems a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 18px;align-items:center;padding:16px 0;border-top:1px solid var(--line-strong)}.case-systems strong{font-size:var(--fs-body);font-weight:700}.case-systems a span{grid-column:1;font-size:var(--fs-small);color:var(--muted)}.case-systems a svg{grid-column:2;grid-row:1/3}.case-systems .fine-print{margin:0}.case-draft-frames{display:grid;grid-template-columns:repeat(4,minmax(0,160px));gap:12px}.case-draft-frames img{width:100%;height:auto}
@media(max-width:1000px){.case-hero,.case-story{grid-template-columns:1fr;gap:40px}.case-lead{justify-self:start;width:min(100%,520px)}.case-systems{position:static}}@media(min-width:1001px){.portfolio-grid.case-media-2{grid-template-columns:repeat(2,minmax(0,1fr));width:calc((200% - 26px) / 3);margin-left:auto}}@media(max-width:700px){.case-steps>div{grid-template-columns:1fr;gap:14px}.case-details>div{grid-template-columns:1fr;gap:2px}}/* == solutions == *//* Scenario pages: hero with the first video (4:5, never upscaled), systems with reasons, practical topics, the plan under the steps; hub cards follow .project-grid. */
/* == video pages (/projects/video//, web/pages/videos.mjs) == *//* The player keeps the file's 720×1280 ratio (width/height attributes of