:root {
  color-scheme: dark;
  --bg: #07090c;
  --panel: #101318;
  --text: #f7f7f7;
  --muted: #c4c7cd;
  --red: #ed071c;
  --red2: #ff2635;
  --line: rgba(255,255,255,.18);
  --content-width: 90rem;
  --gutter: clamp(.875rem, 3vw, 3rem);
  --header-height: 5.5rem;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-height) + 1rem); scrollbar-gutter: stable; }
body { margin: 0; background: #090b0f; color: var(--text); font: 1rem/1.5 Inter, "Segoe UI", Arial, sans-serif; }
button, a, input, select, textarea { font: inherit; }
button, a { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
img { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { min-width: 0; }
:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
h1, h2, h3, p, strong, small, label, pre { overflow-wrap: anywhere; }
.topbar-inner, .hero-inner, .section-inner, .benefits-inner, .footer-inner {
  width: min(var(--content-width), calc(100% - var(--gutter) * 2));
  margin-inline: auto;
  padding-inline: env(safe-area-inset-left, 0px) env(safe-area-inset-right, 0px);
}
.topbar { position: sticky; top: 0; z-index: 30; background: linear-gradient(180deg, rgba(7,9,12,.97), rgba(7,9,12,.9)); border-bottom: 1px solid rgba(255,255,255,.08); backdrop-filter: blur(12px); padding-top: env(safe-area-inset-top, 0px); }
.topbar-inner { min-height: 5.5rem; padding-block: 1rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1.25rem; }
.brand { display: flex; align-items: center; gap: .625rem; min-width: 0; max-width: 100%; }
.brand img { width: clamp(12rem, 24vw, 20.625rem); max-width: 100%; }
.ink-drops { display: flex; flex: none; gap: 3px; }
.ink-drops i { width: 9px; height: 13px; border-radius: 80% 80% 80% 20%; transform: rotate(45deg); box-shadow: 0 0 10px currentColor; }
.ink-drops i:nth-child(1) { background: #00c8ff; color: #00c8ff; }
.ink-drops i:nth-child(2) { background: #ff00b8; color: #ff00b8; }
.ink-drops i:nth-child(3) { background: #ffd21c; color: #ffd21c; }
.ink-drops i:nth-child(4) { background: #151515; color: #444; }
.top-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; min-width: 0; max-width: 100%; }
.language-wrap { position: relative; flex: none; max-width: 100%; }
.language-btn, .chrome-btn { border: 1px solid rgba(255,255,255,.34); color: #fff; background: linear-gradient(180deg, rgba(25,28,33,.96), rgba(5,7,10,.96)); box-shadow: inset 0 1px 0 #fff3, 0 0 0 1px #0009, 0 0 22px #ff001438; border-radius: 999px; min-height: 48px; padding: .625rem 1.125rem; display: inline-flex; align-items: center; justify-content: center; gap: .5625rem; text-decoration: none; max-width: 100%; text-align: center; }
.chrome-btn > span { min-width: 0; overflow-wrap: anywhere; }
.portfolio-btn { box-shadow: inset 0 1px 0 #fff4, 0 0 0 1px #000b, 0 0 10px #d90016, 0 0 22px #ff0014a6; }
.book-icon { font-size: 1.5rem; line-height: 1; flex: none; }
.chev, .portfolio-btn > b { flex: none; }
.language-menu { display: none; position: absolute; right: 0; top: calc(100% + .625rem); width: 15rem; max-width: calc(100vw - var(--gutter) * 2); max-height: calc(var(--visible-height, 100dvh) - var(--header-height) - 2rem); overflow-y: auto; padding: .5rem; background: #0b0e12; border: 1px solid #fff3; border-radius: 1rem; box-shadow: 0 20px 50px #000; }
.language-menu.open { display: grid; }
.language-menu button { min-height: 44px; border: 0; background: transparent; color: #fff; padding: .6875rem .75rem; border-radius: .6875rem; text-align: left; overflow-wrap: anywhere; }
.language-menu button[aria-checked="true"] { background: #ffffff12; }
.hero { position: relative; isolation: isolate; overflow: hidden; background: #11151a; }
.hero-bg { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.hero-bg picture, .hero-bg img { display: block; width: 100%; height: 100%; }
.hero-bg img { object-fit: cover; object-position: 60% top; filter: saturate(.92) contrast(1.03); }
.hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #030508ec 0%, #030508bc 42%, #03050830 78%), linear-gradient(0deg, #030508ce, transparent 65%); }
.hero-inner { position: relative; padding-block: clamp(3rem, 6vw, 6rem); }
.location { display: flex; align-items: center; gap: .75rem; font-size: 1.125rem; margin-bottom: 1.25rem; }
.location .ua-flag { font-size: 1.875rem; line-height: 1; }
.location > span:nth-child(2) { width: 1px; height: 30px; background: #fff8; flex: none; }
.hero h1 { margin: 0; max-width: 52rem; font-size: clamp(2.125rem, calc(1rem + 4.5vw), 5.875rem); line-height: 1.08; letter-spacing: -.035em; text-shadow: 0 3px 10px #000; font-weight: 900; }
.hero h1 > span, .hero h1 > em { display: block; }
.hero h1 em { font-style: normal; font-weight: 600; font-size: .82em; }
.red-line { height: 4px; width: min(170px, 100%); margin-block: 1.5rem; background: linear-gradient(90deg, #ff1124, #ff112400); box-shadow: 0 0 12px #ff071f; }
.red-line.wide { width: min(260px, 100%); margin: .75rem 0 1.75rem; }
.lead { max-width: 40rem; font-size: clamp(1.0625rem, calc(.95rem + .4vw), 1.25rem); line-height: 1.55; color: #f0f1f3; text-shadow: 0 2px 8px #000; margin-block: 1.25rem; }
.quote-btn { border: 1px solid #ff5965; background: linear-gradient(180deg, #f31322, #98020d); color: #fff; border-radius: 999px; min-height: 68px; padding: 1rem 1.5rem; margin-top: 1.5rem; display: flex; align-items: center; gap: clamp(.625rem, 2vw, 1.125rem); justify-content: space-between; width: min(34rem, 100%); font-size: clamp(1.125rem, 2vw, 1.5rem); line-height: 1.3; font-weight: 800; box-shadow: inset 0 2px 4px #ffffff59, inset 0 -8px 16px #0004, 0 0 0 3px #100, 0 0 18px #ff001b, 0 0 42px #ff001b6b; transition: transform .2s, filter .2s; }
.quote-btn > [data-i18n] { min-width: 0; overflow-wrap: anywhere; }
.quote-btn > b, .calc-icon { flex: none; }
.calc-icon { font-size: 1.75rem; line-height: 1; }
.service-stack { width: min(47.5rem, 100%); margin-top: 1.75rem; display: grid; gap: .875rem; }
.service-row { display: grid; grid-template-columns: 56px minmax(0,1fr) 54px; gap: 12px; align-items: center; min-height: 88px; padding: 12px 14px 12px 20px; color: #fff; text-decoration: none; text-align: left; border: 1px solid #ffffff85; border-radius: 999px; background: linear-gradient(180deg, #1e2126f5, #040508f5); box-shadow: inset 0 1px 0 #ffffff42, inset 0 -9px 18px #000b, 0 0 0 2px #000c, 0 0 12px #ff0014a6; position: relative; overflow: hidden; }
.service-row::before { content: ""; position: absolute; right: 65px; bottom: -28px; width: 200px; height: 75px; border-top: 2px solid #ffffff61; border-radius: 50%; transform: rotate(-7deg); filter: drop-shadow(0 0 8px #e10017); pointer-events: none; }
.svc-icon { font-size: 30px; text-align: center; line-height: 1; }
.svc-icon.cmyk { font-size: 0; }
.svc-icon.cmyk::before { content: "● ● ●"; font-size: 20px; background: linear-gradient(90deg, #00c8ff 0 31%, #ff00b8 31% 64%, #ffd21c 64%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.service-row strong { min-width: 0; font-size: clamp(1rem, 2.3vw, 1.5625rem); line-height: 1.35; z-index: 1; }
.round-arrow { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; border: 1px solid #ffffff73; background: radial-gradient(circle at 35% 28%, #2e3238, #07080b 70%); box-shadow: inset 0 1px 3px #fff4, 0 0 12px #f10a1b; font-size: 30px; z-index: 1; }
.services-section { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(3rem, 5vw, 5.25rem); background: #12151a; }
.metal-bg { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, #080a0eb8, #080a0eeb), url("assets/hero-abstract.webp") center/cover no-repeat; opacity: .95; pointer-events: none; }
.section-kicker { color: #ff1c30; letter-spacing: .3em; font-size: .875rem; font-weight: 800; line-height: 1.5; }
.services-section h2, .portfolio h2 { font-size: clamp(2rem, calc(1.2rem + 3vw), 4.125rem); line-height: 1.12; letter-spacing: -.025em; margin: .5rem 0 0; }
.service-cards { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: clamp(.875rem, 1.5vw, 1.25rem); }
.card { position: relative; isolation: isolate; min-width: 0; border: 1px solid #bfc8d078; border-radius: 22px; overflow: hidden; background: linear-gradient(155deg, #e0e9f00c, #141a224d 42%, #070b106b); box-shadow: inset 0 1px 0 #ffffff40, inset 0 -1px 0 #000a, 0 8px 16px #0003; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); display: flex; flex-direction: column; }
.card::before, .card::after, .card-arrow::before { content: ""; position: absolute; pointer-events: none; border-radius: inherit; -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; }
.card::before { z-index: 2; inset: 0; padding: 3px; background: conic-gradient(from 22deg, #14171b, #edf1f4 6%, #5b636b 10%, #12161a 18%, #dce3e9 28%, #090c10 35%, #8b959f 44%, #f8fbff 50%, #11151a 57%, #030608 65%, #cbd3da 76%, #ffffff 81%, #252c33 86%, #8f9ba7 93%, #14171b); }
.card::after { z-index: 2; inset: 5px; border-radius: 17px; padding: 1px; background: linear-gradient(145deg, #fff8, #fff0 24%, #05080bbb 48%, #fff0 65%, #fff5); }
.card img { width: 100%; aspect-ratio: 1.55; object-fit: cover; filter: saturate(.92) contrast(1.05); }
/* Move titles up; preserve card height by reserving the former badge space near the action. */
.card > div:not(.sheet-visual) { padding: 1.25rem 1.25rem 6.8125rem; flex: 1; min-width: 0; }
.card h3 { font-size: clamp(1.25rem, 2vw, 1.5rem); line-height: 1.25; margin: .3125rem 0 .5rem; }
.card p { margin: 0; color: #c7cad0; font-size: 1rem; line-height: 1.55; }
.card h3, .card p { text-shadow: 0 1px 3px #000a; }
.card-arrow { position: absolute; right: 16px; bottom: 16px; width: 46px; height: 46px; border-radius: 50%; border: 1px solid #d7dfe766; background: linear-gradient(145deg, #e3eaf016, #05090d4d); color: #fff; font-size: 24px; box-shadow: inset 0 1px 2px #fff5, inset 0 -2px 3px #0009, 0 3px 7px #0005; }
.card-arrow::before { inset: 0; padding: 2px; background: conic-gradient(from 40deg, #151a1f, #f4f7fb 15%, #35404a 26%, #05080b 40%, #b8c4cd 56%, #fff 62%, #1e262e 76%, #78858f 90%, #151a1f); }
.sheet-visual { width: 100%; aspect-ratio: 1.55; position: relative; background: linear-gradient(145deg, #dce4ec, #15191f 40%, #090b0e 60%); overflow: hidden; }
.sheet-visual i { position: absolute; width: 68%; height: 26%; left: 16%; border: 2px solid #ffffffb8; background: #ffffff21; box-shadow: 0 0 16px #ffffff40; transform: skewY(-7deg); }
.sheet-visual i:nth-child(1) { top: 22%; }
.sheet-visual i:nth-child(2) { top: 36%; }
.sheet-visual i:nth-child(3) { top: 50%; }
.benefits { background: linear-gradient(180deg, #15181d, #0b0d11); border-block: 1px solid #fff2; }
.benefits-inner { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); }
.benefits-inner > div { min-width: 0; padding: 1.5rem 1rem; display: grid; grid-template-columns: 36px minmax(0,1fr); column-gap: .5rem; border-right: 1px solid #fff2; }
.benefits-inner > div:last-child { border-right: 0; }
.benefits b { grid-row: 1 / 3; font-size: 32px; line-height: 1.2; color: #fff; }
.benefits strong { font-size: 1rem; line-height: 1.4; }
.benefits small { color: #b8bdc6; font-size: .875rem; line-height: 1.5; margin-top: .25rem; }
.portfolio { padding-block: clamp(3rem, 5vw, 4.625rem); background: #080a0e; }
.portfolio-inner { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1.5rem 2rem; }
.portfolio-inner > div { flex: 1 1 36rem; min-width: 0; }
.portfolio p { max-width: 45rem; color: #bfc4cc; font-size: 1.125rem; line-height: 1.6; }
.portfolio-link { flex: 0 1 auto; }
.footer { background: #050608; border-top: 1px solid #fff2; color: #adb3bb; padding-block: 2rem calc(2rem + env(safe-area-inset-bottom, 0px)); }
.footer-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.25rem; }
.footer img { width: 240px; }
.footer span { font-size: .875rem; }
html.dialog-open { overflow: hidden; }
.modal { position: fixed; inset: calc(var(--viewport-top, 0px) + max(.75rem, env(safe-area-inset-top, 0px))) 0 auto; border: 0; background: transparent; padding: 0; margin: 0 auto; width: min(45rem, calc(100% - 1.5rem)); max-height: calc(var(--visible-height, 100vh) - 1.5rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); max-height: calc(var(--visible-height, 100dvh) - 1.5rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); overflow: auto; overscroll-behavior: contain; border-radius: 24px; color: #fff; }
.modal::backdrop { background: #000c; backdrop-filter: blur(6px); }
.modal-card { position: relative; margin: 0; min-width: 0; background: linear-gradient(180deg, #15191f, #080a0d); color: #fff; border: 1px solid #fff3; border-radius: 24px; padding: clamp(1rem, 3vw, 1.75rem); }
.modal-card h3 { font-size: clamp(1.375rem, calc(1rem + 1.5vw), 1.875rem); line-height: 1.25; margin: .5rem 0 1.25rem; padding-right: 3rem; }
.modal-card > .section-kicker { padding-right: 3rem; }
.close { position: absolute; right: 12px; top: 12px; width: 44px; height: 44px; border-radius: 50%; border: 1px solid #fff5; background: #090b0f; color: #fff; font-size: 28px; line-height: 1; }
.modal-card label { min-width: 0; display: grid; gap: .4375rem; color: #c8ccd2; margin: .75rem 0; font-size: 1rem; }
.modal-card input, .modal-card select, .modal-card textarea { width: 100%; max-width: 100%; min-height: 48px; border: 1px solid #fff3; background: #090b0f; color: #fff; border-radius: 14px; padding: .8125rem .875rem; font-size: 1rem; line-height: 1.4; }
.modal-card textarea { resize: vertical; }
.modal-card input::placeholder, .modal-card textarea::placeholder { color: #a3a9b3; opacity: 1; }
.modal-card select:disabled { color: #8f969f; opacity: .7; }
.modal-card :is(input,select,textarea):focus { border-color: #f42839; outline: 2px solid #f42839; outline-offset: 1px; }
.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; }
.modal-submit { width: 100%; min-height: 60px; font-size: 1.125rem; margin-top: 1.125rem; }
.file-label small, .result-card > small { font-size: .875rem; color: #b1b7c0; }
.file-label input[type="file"] { padding: .625rem; overflow: hidden; }
.file-label input::file-selector-button { border: 1px solid #fff4; border-radius: 8px; background: #242932; color: #fff; min-height: 36px; padding: .375rem .625rem; margin-right: .5rem; font: inherit; }
.result-card pre { white-space: pre-wrap; word-break: break-word; font-size: .9375rem; line-height: 1.6; background: #050608; border: 1px solid #fff2; border-radius: 14px; padding: .875rem; max-height: 45vh; overflow: auto; color: #e7e9ec; }
.result-card .chrome-btn { margin-top: .875rem; }
@media (hover: hover) and (pointer: fine) {
  .quote-btn:hover { transform: translateY(-1px); filter: brightness(1.08); }
  .language-menu button:hover { background: #ffffff12; }
  .service-row:hover, .chrome-btn:hover, .card-arrow:hover { border-color: #fff; }
}
@media (max-width: 1199px) {
  .service-cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .benefits-inner { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .benefits-inner > div { border-bottom: 1px solid #fff2; }
  .benefits-inner > div:nth-child(3n) { border-right: 0; }
}
@media (max-width: 800px) {
  .brand img { width: 230px; }
  .ink-drops { display: none; }
  .benefits-inner { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .benefits-inner > div:nth-child(3n) { border-right: 1px solid #fff2; }
  .benefits-inner > div:nth-child(2n), .benefits-inner > div:last-child { border-right: 0; }
  .benefits-inner > div:last-child { grid-column: 1 / -1; }
}
@media (max-width: 639px) {
  .topbar-inner { padding-block: .75rem; gap: .75rem; }
  .brand { width: 100%; }
  .brand img { width: clamp(200px, 50vw, 270px); }
  .top-actions { width: 100%; flex-wrap: wrap; gap: .75rem; }
  .portfolio-btn { flex: 1 1 10rem; min-width: 0; }
  .language-btn { padding-inline: .75rem; }
  .language-menu { left: 0; right: auto; }
  .hero-bg img { object-position: 80% top; }
  .hero-bg::after { background: linear-gradient(180deg, #03050859, #030508c9 38%, #030508f5 100%); }
  .hero-inner { padding-top: clamp(5rem, 18vw, 7rem); padding-bottom: 3rem; }
  .hero h1 { font-size: clamp(2.125rem, 9vw, 3.5rem); }
  .quote-btn { width: 100%; min-height: 64px; padding-inline: 1rem; }
  .service-row { grid-template-columns: 38px minmax(0,1fr) 44px; gap: 8px; min-height: 76px; padding: 12px; }
  .svc-icon { font-size: 26px; }
  .svc-icon.cmyk::before { font-size: 14px; }
  .service-row strong { font-size: clamp(1rem, 3.9vw, 1.3125rem); }
  .round-arrow { width: 44px; height: 44px; font-size: 26px; }
  .service-row::before { right: 50px; }
  .service-cards { grid-template-columns: minmax(0,1fr); }
  .portfolio-link { width: 100%; }
  .form-grid { grid-template-columns: minmax(0,1fr); gap: 0; }
  .footer-inner { flex-direction: column; align-items: flex-start; }
}
@media (min-width: 480px) and (max-width: 639px) {
  .card { display: grid; grid-template-columns: 40% minmax(0,1fr); }
  .card img, .sheet-visual { height: 100%; aspect-ratio: auto; object-fit: cover; }
}
@media (max-width: 479px) {
  .benefits-inner { grid-template-columns: minmax(0,1fr); }
  .benefits-inner > div, .benefits-inner > div:nth-child(3n) { border-right: 0; }
  .benefits-inner > div:last-child { grid-column: auto; }
  .benefits-inner > div { padding-inline: .25rem; }
}
@media (max-width: 359px) {
  .service-row { grid-template-columns: 30px minmax(0,1fr) 40px; gap: 6px; padding-inline: 10px; }
  .round-arrow { width: 40px; height: 40px; }
  .portfolio-btn { padding-inline: .75rem; }
  .portfolio-btn .book-icon { display: none; }
}
@media (max-height: 500px) {
  .topbar { position: relative; }
  html { scroll-padding-top: 1rem; }
  .language-menu { max-height: calc(var(--visible-height, 100dvh) - var(--header-height) - 1rem); }
  .hero-inner { padding-top: 2.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* Approved industrial chrome: live HTML labels over transparent, stretchable skins. */
:root { --gutter: clamp(1rem, 3.5vw, 3rem); }
html { scroll-padding-top: 1rem; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.topbar { position: absolute; inset: 0 0 auto; width: 100%; background: none; border: 0; backdrop-filter: none; padding-top: env(safe-area-inset-top,0px); }
.topbar-inner { position: relative; display: block; min-height: 0; height: 0; padding: 0; }
.brand { position: absolute; left: 0; top: clamp(6rem, 13vw, 10rem); display: block; width: clamp(210px, 32vw, 390px); max-width: 65%; }
.brand > img:first-child { width: 100%; height: auto; filter: drop-shadow(0 3px 2px #000b); }
.brand .ink-drops { position: absolute; display: block; width: clamp(70px, 8vw, 104px); height: auto; top: -30px; left: 47%; margin: 0; filter: drop-shadow(0 2px 2px #0009); }
.brand-techno .ink-drops { left: 44%; }
.top-actions { position: absolute; right: 0; top: clamp(1.25rem, 4vw, 2.5rem); width: auto; flex-wrap: nowrap; }
.hero { background: #767e8b; }
.hero-bg img { object-position: 55% top; filter: none; }
.hero-bg::after { background: linear-gradient(90deg,#080d1759 0%,#080d1721 45%,transparent 80%),linear-gradient(0deg,#080d1733,transparent 40%); }
.hero-inner { padding-top: clamp(14rem, 22vw, 19rem); padding-bottom: 3rem; }
.location { position: relative; z-index: 5; min-height: 38px; margin-bottom: 1rem; gap: 12px; font-size: 1.125rem; font-weight: 400; text-shadow: 0 2px 4px #000c; }
.location strong { font-weight: 400; }
.location > span:nth-child(2) { height: 32px; }
.language-wrap { width: 60px; height: 38px; }
.language-btn { position: absolute; top: -3px; left: -3px; padding: 0; min-height: 44px; width: 64px; border: 0; border-radius: 6px; background: transparent; box-shadow: none; gap: 0; }
.language-btn .flag { display: block; width: 54px; font-size: 36px; line-height: 1; }
.wave-flag { width: 54px; height: auto; max-height: 38px; object-fit: contain; filter: drop-shadow(0 2px 2px #0008); }
.language-btn .chev { position: absolute; right: -4px; bottom: -1px; font-size: 14px; text-shadow: 0 1px 2px #000; }
.language-menu { left: 0; right: auto; z-index: 50; max-height: min(340px,calc(var(--visible-height,100dvh) - 180px)); box-shadow: 0 12px 28px #000b; }
.hero h1 { max-width: 52rem; font-weight: 900; line-height: 1.02; letter-spacing: -.035em; text-shadow: 0 2px 0 #fff2,0 5px 3px #000c,0 8px 14px #0009; }
.hero h1 em { font-size: .84em; font-weight: 400; text-shadow: 0 1px 0 #fff6,0 3px 2px #000,0 7px 8px #0009; }
.lead { color: #f4f5f6; line-height: 1.45; text-shadow: 0 1px 2px #000,0 2px 8px #000c; max-width: 44rem; }
.red-line { height: 2px; width: min(330px,70%); margin-block: 1.125rem; background: linear-gradient(90deg,#fff7,#ff0a1e 16%,#ff0a1e85 65%,transparent); box-shadow: 0 0 9px #ff1120; }
.shelled { position: relative; isolation: isolate; border: 0; background: transparent; box-shadow: none; overflow: visible; border-radius: 999px; }
.button-skin { position: absolute; inset: 0; z-index: -1; pointer-events: none; border-style: solid; border-color: transparent; border-image-repeat: stretch; filter: drop-shadow(0 0 3px #ef061c) drop-shadow(0 3px 3px #0009); }
.quote-btn { --button-height: clamp(56px,7vw,86px); min-height: var(--button-height); width: min(44rem,95%); padding: 12px 30px; margin-top: 18px; gap: 14px; font-size: clamp(1rem,2.4vw,1.65rem); line-height: 1.2; text-align: left; }
.quote-btn .button-skin { border-image-source: url('assets/chrome-quote.webp'); border-image-slice: 24 115 24 115 fill; border-width: calc(var(--button-height) * .119) calc(var(--button-height) * .57); }
.quote-btn > [data-i18n] { flex: 1; }
.calc-icon { width: clamp(26px,4vw,38px); height: auto; flex: none; filter: drop-shadow(0 1px 1px #0008); }
.arrow-icon { display: block; width: 26px; height: 26px; max-width: none; }
.quote-btn > b .arrow-icon { width: 28px; height: 28px; }
.service-stack { width: min(47.5rem,100%); gap: 10px; margin-top: 16px; }
.service-row { --button-height: clamp(56px,8vw,94px); min-height: var(--button-height); grid-template-columns: 46px minmax(0,1fr) 65px; gap: 12px; padding: 10px 14px 10px 32px; }
.service-row .button-skin { border-image-source: url('assets/chrome-service.webp'); border-image-slice: 30 270 30 125 fill; border-width: calc(var(--button-height) * .135) calc(var(--button-height) * 1.21) calc(var(--button-height) * .135) calc(var(--button-height) * .56); }
.service-row::before { display: none; }
.svc-icon { display: block; width: 44px; height: 44px; object-fit: contain; filter: drop-shadow(0 1px 2px #000a); }
.svc-icon.uv-icon { width: 48px; height: 40px; }
.service-row strong { font-size: clamp(1rem,2.45vw,1.65rem); line-height: 1.25; font-weight: 750; text-shadow: 0 2px 3px #000; }
.round-arrow { position: absolute; right: calc(var(--button-height) * .3); top: 50%; transform: translateY(-50%); width: calc(var(--button-height) * .43); height: calc(var(--button-height) * .43); border: 0; box-shadow: none; background: none; }
.round-arrow .arrow-icon { width: 100%; height: 100%; filter: drop-shadow(0 1px 2px #000); }
.chrome-btn.shelled { --button-height: 54px; min-height: var(--button-height); padding: 10px 28px; font-weight: 650; gap: 10px; }
.chrome-btn.shelled .button-skin { border-image-source: url('assets/chrome-portfolio.webp'); border-image-slice: 24 120 24 120 fill; border-width: calc(var(--button-height) * .119) calc(var(--button-height) * .595); }
.portfolio-btn .book-icon { display: block; width: 25px; height: 25px; font-size: 0; }
.portfolio-btn { flex: none; }
.portfolio-btn .arrow-icon { width: 23px; height: 23px; }
.services-section { background: #535d70; padding-top: 2rem; }
.metal-bg { opacity: 1; background: linear-gradient(180deg,#0c122622,#0c12264d),url('assets/metal-surface.webp') center top/cover; }
.section-kicker { text-shadow: 0 1px 3px #000; }
.services-section h2 { text-shadow: 0 3px 2px #000b,0 5px 10px #0007; }
.modal-submit { --button-height: 60px; width: 100%; font-size: 1.125rem; }
@media (max-width:900px) {
  .hero-bg img { object-position: center top; }
  .hero-bg::after { background: linear-gradient(180deg,transparent 0%,#0509110c 20%,#05091136 62%,#05091116 100%); }
}
@media (max-width:639px) {
  .topbar-inner { width: calc(100% - var(--gutter) * 2); min-height: 0; height: 0; padding: 0; }
  .brand { top: 96px; width: clamp(210px,54vw,310px); max-width: 70%; }
  .brand > img:first-child { width: 100%; }
  .brand .ink-drops { display: block; width: 70px; top: -24px; }
  .top-actions { top: 26px; width: auto; gap: 0; }
  .portfolio-btn { --button-height: 44px !important; flex: none; font-size: .875rem; gap: 6px !important; padding: 8px 16px !important; }
  .portfolio-btn .book-icon { width: 20px; height: 20px; }
  .portfolio-btn .arrow-icon { width: 18px; height: 18px; }
  .hero-inner { padding-top: 166px; padding-bottom: 28px; }
  .location { min-height: 32px; margin-bottom: 14px; font-size: 1rem; gap: 10px; }
  .language-wrap { width: 44px; height: 32px; }
  .language-btn { width: 50px; top: -6px; left: -3px; }
  .language-btn .flag { width: 44px; font-size: 32px; }
  .wave-flag { width: 44px; max-height: 32px; }
  .location > span:nth-child(2) { height: 27px; }
  .hero h1 { font-size: clamp(2rem,9vw,3.5rem); line-height: 1.0; }
  .lead { font-size: 1rem; margin-block: 12px; line-height: 1.4; }
  .red-line { margin-block: 14px; }
  .quote-btn { min-height: var(--button-height); width: 95%; padding: 10px 22px; margin-top: 14px; gap: 10px; font-size: clamp(1rem,4.45vw,1.25rem); }
  .quote-btn > b .arrow-icon { width: 22px; height: 22px; }
  .calc-icon { width: 25px; }
  .service-row { grid-template-columns: 31px minmax(0,1fr) 45px; gap: 7px; padding: 8px 12px 8px 20px; }
  .service-row strong { font-size: clamp(1rem,4.3vw,1.25rem); }
  .svc-icon { width: 31px; height: 32px; }
  .svc-icon.uv-icon { width: 35px; height: 32px; }
  .services-section { padding-top: 24px; }
  .services-section h2 { font-size: clamp(1.875rem,7vw,2.75rem); }
  .portfolio-link { width: 100%; }
  .modal-submit { width: 100%; }
}
@media(max-width:359px) {
  .brand { top: 92px; width: 200px; }
  .hero-inner { padding-top: 156px; }
  .portfolio-btn .book-icon { display: block; }
  .service-row { grid-template-columns: 28px minmax(0,1fr) 38px; gap: 6px; padding-left: 17px; padding-right: 8px; }
  .svc-icon { width: 28px; }
  .svc-icon.uv-icon { width: 30px; }
  .quote-btn { padding-inline: 18px; gap: 8px; }
}
@media(max-height:500px) and (min-width:640px) { .hero-inner { padding-top: 14rem; } }

.card-arrow { display:grid; place-items:center; }
.card-arrow .arrow-icon { width:24px; height:24px; }
.benefits b img { width:32px; height:32px; }

/* On wide screens the service choices sit beside the introduction. */
@media (min-width:1000px) {
 .hero-inner { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:clamp(2rem,4vw,4rem); padding-top:clamp(14rem,17vw,17rem); }
 .hero-inner > .location { grid-column:1; grid-row:1; }
 .hero h1 { grid-column:1; grid-row:2; font-size:clamp(2.75rem,5vw,4.75rem); }
 .hero-inner > .red-line { grid-column:1; grid-row:3; }
 .hero-inner > .lead { grid-column:1; grid-row:4; }
 .hero .quote-btn { grid-column:1; grid-row:5; --button-height:clamp(64px,4.6vw,76px); width:100%; font-size:clamp(1rem,1.8vw,1.65rem); }
 .hero .service-stack { grid-column:2; grid-row:2 / 6; align-self:center; width:100%; margin-top:0; }
 .hero .service-row { --button-height:clamp(64px,5.5vw,88px); grid-template-columns: 42px minmax(0,1fr) 58px; gap:10px; padding-inline:24px 12px; }
 .hero .service-row strong { font-size:clamp(1rem,1.9vw,1.55rem); }
}
.metal-bg { background:linear-gradient(180deg,#0c122616,#283347ef 550px),url('assets/metal-surface.webp') center top / 100% auto repeat-y; }

/* Localised file controls: the browser's language does not determine their text. */
.file-label { display:grid; gap:7px; margin:12px 0; }
.modal-card .file-label > label { margin:0; }
.file-picker { position:relative; display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.file-pick { min-height:44px; max-width:100%; padding:9px 14px; color:#fff; background:#242932; border:1px solid #fff5; border-radius:10px; overflow-wrap:anywhere; }
.file-picker .file-input { position:absolute; width:1px; height:1px; min-height:0; padding:0; border:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
#fileName { flex-basis:100%; min-width:0; overflow-wrap:anywhere; color:#c8ccd2; font-size:1rem; }
#clearFile[hidden] { display:none; }

/* PROFI-STYLE v4 — approved quiet workshop and compact navigation. */
:root { --header-height: 0px; --gutter: clamp(1.125rem, 3vw, 3rem); }
html { scroll-padding-top: 1.25rem; }
.topbar { position: relative; inset: auto; z-index: 20; isolation: isolate; background: #343a41; padding: 0; }
.topbar::before { content: ""; position: absolute; z-index: -1; inset: 0 0 -3.5rem; pointer-events: none; background: linear-gradient(180deg,#0c1014c7 0%,#191f26b3 48%,#343a4126 100%),url('assets/metal-surface.webp') center 35%/cover; -webkit-mask-image: linear-gradient(180deg,#000 0%,#000 48%,transparent 100%); mask-image: linear-gradient(180deg,#000 0%,#000 48%,transparent 100%); }
.topbar-inner { display: block; height: auto; min-height: 0; padding-block: clamp(1.375rem,3.5vw,2.75rem) .875rem; }
.brand { position: static; display: block; width: min(54rem,100%); max-width: 100%; }
.brand > img:first-child { width: 100%; filter: brightness(1.18) saturate(1.08) drop-shadow(0 -1px 0 #ffe9e973) drop-shadow(0 0 2px #05070bf2) drop-shadow(0 4px 3px #000c); }
.brand-tagline { margin: .5rem 0 0; font-size: clamp(.8125rem,3.7vw,1.8125rem); font-weight: 400; line-height: 1.4; letter-spacing: -.02em; white-space: nowrap; overflow-wrap: normal; text-shadow: 0 2px 3px #000; }
.hero { background: #343a41; overflow: visible; }
.hero-bg { inset: 0; overflow: hidden; }
.hero-bg img { filter: saturate(.65) contrast(.86); object-fit: cover; object-position: center 45%; opacity: .73; }
.hero-bg::after { background: linear-gradient(180deg,#343a4140,transparent 25%,#343a4140 65%,#343a41 100%); }
.hero-inner { display: block; position: relative; padding-top: 1rem; padding-bottom: 2.75rem; }
.hero-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; position: relative; z-index: 5; }
.site-nav { position: relative; flex: 0 1 10rem; min-width: 0; }
.chrome-btn.menu-toggle { --button-height: 48px; width: 100%; min-height: 48px; padding: .625rem 1.0625rem; gap: .6875rem; font-size: 1rem; }
.menu-toggle [data-i18n] { flex: 1; }
.menu-toggle .button-skin, .service-row .button-skin, .portfolio-link .button-skin { filter: grayscale(1) drop-shadow(0 3px 3px #0008); }
.menu-icon { width: 21px; height: 21px; flex: none; }
.menu-chevron { width: 18px; height: 18px; flex: none; transition: transform .18s; }
.menu-toggle[aria-expanded="true"] .menu-chevron { transform: rotate(180deg); }
.site-menu { position: absolute; top: calc(100% + .625rem); left: 0; width: 17rem; max-width: calc(100vw - var(--gutter) * 2); padding: .5rem; background: #101317f5; border: 1px solid #bfc3c766; border-radius: 1rem; box-shadow: 0 14px 35px #0009; }
.site-menu:not([hidden]) { display: grid; }
.site-menu a, .site-menu button { display: flex; align-items: center; color: #fff; text-decoration: none; background: none; border: none; border-radius: .625rem; min-height: 48px; padding: .625rem .875rem; text-align: left; font-size: 1rem; }
.site-menu :is(a,button):hover, .site-menu :is(a,button):focus-visible { background: #ffffff13; }
.location { display: flex; align-items: center; gap: .6875rem; position: static; min-height: 48px; margin: 0; font-size: clamp(.9375rem,3.8vw,1.25rem); white-space: nowrap; }
.location strong { font-weight: 400; overflow-wrap: normal; }
.location > .location-divider { display: block; width: 1px; height: 30px; background: #ffffffb0; }
.language-wrap { width: 44px; height: 40px; }
.language-btn { position: static; width: 44px; height: 44px; min-height: 44px; padding: 0; gap: 0; }
.language-btn .flag { width: 42px; font-size: 31px; }
.wave-flag { width: 42px; max-height: 34px; }
.language-btn .chev { right: -2px; bottom: -2px; }
.language-menu { left: auto; right: 0; top: calc(100% + .625rem); max-height: min(340px,calc(var(--visible-height,100dvh) - 160px)); }
.hero-copy { padding-top: clamp(8rem,31vw,16rem); }
.lead { margin: 0; max-width: 44rem; font-size: clamp(1rem,3.7vw,1.375rem); line-height: 1.5; color: #fff; text-shadow: 0 1px 2px #000,0 2px 8px #000b; }
.quote-btn { --button-height: clamp(56px,7vw,78px); width: 100%; margin-top: 1.375rem; padding: 12px 25px; gap: 12px; font-size: clamp(1rem,4.3vw,1.5rem); }
.quote-btn .button-skin { filter: drop-shadow(0 0 2px #e50920) drop-shadow(0 4px 4px #0009); }
.quote-btn .calc-icon { width: clamp(24px,4vw,34px); }
.quote-btn > b .arrow-icon { width: 25px; height: 25px; }
.service-stack { width: 100%; gap: .75rem; margin-top: 1.375rem; }
.service-row { --button-height: clamp(56px,8vw,82px); grid-template-columns: 31px minmax(0,1fr) 35px; gap: 8px; padding: 8px 12px 8px 20px; }
.service-row strong { font-size: clamp(1rem,4.1vw,1.4375rem); line-height: 1.25; }
.svc-icon { width: 31px; height: 34px; }
.svc-icon.uv-icon { width: 34px; height: 31px; }
.services-section { background: #343a41; padding-top: 2.75rem; }
.metal-bg { opacity: .55; background: linear-gradient(180deg,#343a41,#24292fbb),url('assets/metal-surface.webp') center/cover; }
.card > img { filter: saturate(.6) brightness(.8); }
.card > img.service-photo { filter: saturate(.8) contrast(1.02) brightness(.96); }
.catalog-section { padding-block: 3rem; background: #1b2026; }
.contacts-section { padding-block: 3rem; background: #14181e; }
.catalog-section h2, .contacts-section h2 { margin: .5rem 0 0; font-size: clamp(1.875rem,4vw,3.5rem); line-height: 1.15; }
.section-intro { color: #cdd1d6; max-width: 44rem; line-height: 1.6; margin-block: 1rem 1.5rem; }
.catalog-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .875rem; }
.catalog-item { display: flex; align-items: center; justify-content: space-between; gap: .75rem; border: 1px solid #ffffff38; border-radius: 1rem; background: linear-gradient(180deg,#3b4148,#20252b); color: #fff; min-height: 66px; padding: 1rem; font-weight: 600; text-align: left; }
.catalog-item img { width: 25px; height: 25px; flex: none; }
.catalog-item:hover { background: #424950; }
.contacts-inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem 3rem; }
.contacts-inner > div { min-width: 0; }
.contact-links { display: grid; gap: .75rem; min-width: 16rem; }
.contact-link { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 48px; padding: .75rem 1rem; color: #fff; text-decoration: none; border: 1px solid #ffffff45; border-radius: .875rem; background: linear-gradient(180deg,#333940,#1a1f25); }
.contact-link img { flex: none; }
.contact-link:hover { border-color: #fff; }
.client-card p { color: #cdd1d6; }
.client-card .contact-link { margin-top: 1.5rem; }
.portfolio-link .button-skin { filter: grayscale(1) drop-shadow(0 3px 3px #0008); }
.modal-submit { --button-height: 60px; width: 100%; font-size: 1.125rem; }
@media (max-width:900px) {
  .hero-bg picture { height: auto; padding-top: .5rem; }
  .hero-bg img { height: auto; object-fit: contain; }
  .hero-bg::after { background: linear-gradient(180deg,#343a411a,transparent 18%,#343a4170 38%,#343a41c0 55%,#343a41 85%); }
  .catalog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .contacts-inner { display: block; }
  .contact-links { max-width: 28rem; }
}
@media (min-width:1000px) {
  .hero-inner { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 0 clamp(2rem,5vw,5rem); padding-top: 1.5rem; padding-bottom: 3.5rem; }
  .hero-toolbar { grid-column: 1/-1; grid-row: 1; justify-content: flex-start; gap: 2rem; }
  .hero-toolbar .site-nav { flex-basis: 11rem; }
  .hero-copy { grid-column: 1; grid-row: 2; padding-top: clamp(5rem,9vw,9rem); padding-bottom: 1rem; }
  .hero-copy .quote-btn { width: 100%; }
  .service-stack { grid-column: 2; grid-row: 2; align-self: end; margin-top: clamp(5rem,9vw,9rem); margin-bottom: 1rem; gap: 1rem; }
  .service-row { --button-height: clamp(64px,5.7vw,82px); grid-template-columns: 38px minmax(0,1fr) 42px; gap: 10px; padding-left: 25px; }
  .service-row strong { font-size: clamp(1rem,1.5vw,1.4375rem); }
  .svc-icon { width: 38px; height: 38px; }
  .svc-icon.uv-icon { width: 40px; height: 38px; }
}
@media (max-width:359px) {
  :root { --gutter: .875rem; }
  .hero-toolbar { gap: .75rem; }
  .site-nav { flex-basis: 8.5rem; }
  .chrome-btn.menu-toggle { padding-inline: .875rem; gap: .5rem; }
  .location { gap: .4375rem; font-size: .875rem; }
  .language-wrap, .language-btn { width: 36px; }
  .language-btn .flag, .wave-flag { width: 34px; }
  .quote-btn { padding-inline: 20px; gap: 8px; }
  .service-row { grid-template-columns: 28px minmax(0,1fr) 28px; gap: 6px; padding-left: 17px; }
  .service-row strong { font-size: 1rem; }
  .catalog-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion:reduce) {
  .menu-chevron { transition: none; }
}

/* v4.1: the header and all four service buttons share the actual first viewport. */
:root {
  --landing-height: 100vh;
  --brand-height: 6rem;
  --landing-pad-top: 12px;
  --landing-pad-bottom: max(18px,env(safe-area-inset-bottom,0px));
  --landing-gap: 14px;
}
@supports (height:100svh) { :root { --landing-height: 100svh; } }
.topbar { padding-top: env(safe-area-inset-top,0px); }
.hero-inner {
  height: max(0px,calc(var(--landing-height) - var(--brand-height)));
  min-height: 0;
  padding-top: var(--landing-pad-top);
  padding-bottom: var(--landing-pad-bottom);
  display: grid;
  grid-template-columns: minmax(0,1fr);
  grid-template-rows: auto minmax(0,1fr) auto auto;
  gap: 0;
}
.hero-toolbar { grid-column: 1; grid-row: 1; }
.hero-copy { grid-column: 1; grid-row: 3; padding: 0; margin: 0; min-width: 0; }
.hero-copy .quote-btn { margin-top: var(--landing-gap); --button-height: clamp(54px,7vw,72px); }
.service-stack { grid-column: 1; grid-row: 4; align-self: end; margin: var(--landing-gap) 0 0; gap: clamp(8px,1.2vh,12px); }
.service-row { --button-height: clamp(54px,7.5vw,76px); min-height: var(--button-height); }
.hero-description-btn { display: none; }
.site-menu .about-menu-item { display: none; }
@media (min-width:1000px) {
  .hero-inner { grid-template-columns: minmax(0,1fr) minmax(0,1fr); grid-template-rows: auto minmax(0,1fr) auto; column-gap: clamp(2rem,5vw,5rem); }
  .hero-toolbar { grid-column: 1/-1; grid-row: 1; }
  .hero-copy { grid-column: 1; grid-row: 3; padding: 0; align-self: end; }
  .service-stack { grid-column: 2; grid-row: 3; margin: 0; gap: clamp(10px,1.5vh,16px); }
  .service-row { --button-height: clamp(60px,5.5vw,82px); }
}
.landing-compact { --landing-pad-top: 8px; --landing-pad-bottom: max(12px,env(safe-area-inset-bottom,0px)); --landing-gap: 10px; }
.landing-compact .topbar-inner { padding-block: 12px 8px; }
.landing-compact .brand { width: min(42rem,100%); }
.landing-compact .brand-tagline { margin-top: 4px; font-size: clamp(13px,3.7vw,22px); }
.landing-compact .hero-toolbar, .landing-compact .location { min-height: 44px; }
.landing-compact .chrome-btn.menu-toggle { --button-height: 44px; min-height: 44px; }
.landing-compact .lead { font-size: 16px; line-height: 1.4; }
.landing-compact .hero-copy .quote-btn { --button-height: 52px; min-height: 52px; padding-block: 9px; font-size: clamp(16px,4.3vw,20px); }
.landing-compact .service-stack { gap: 8px; }
.landing-compact .service-row { --button-height: 52px; min-height: 52px; padding-block: 7px; }
.landing-compact .service-row strong { font-size: clamp(16px,3.7vw,20px); }
.landing-compact .svc-icon { width: 28px; height: 28px; }
.landing-compact .svc-icon.uv-icon { width: 30px; height: 28px; }
.landing-tiles .hero-copy .lead { display: none; }
.landing-tiles .hero-description-btn { display: inline-flex; align-items: center; min-height: 32px; border: 0; padding: 0; background: transparent; color: #fff; font-size: 14px; text-decoration: underline; text-underline-offset: 3px; }
.landing-tiles .site-menu .about-menu-item { display: flex; }
.landing-tiles .hero-copy .quote-btn { margin-top: 4px; }
.landing-tiles .service-stack { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.landing-tiles .service-row { --button-height: 64px; min-height: 64px; grid-template-columns: minmax(0,1fr) 24px; grid-template-rows: 22px auto; gap: 2px 6px; padding: 8px 16px; text-align: center; }
.landing-tiles .service-row .svc-icon { grid-column: 1; grid-row: 1; width: 22px; height: 22px; justify-self: center; }
.landing-tiles .service-row strong { grid-column: 1/-1; grid-row: 2; font-size: 14px; line-height: 1.2; }
.landing-tiles .service-row .round-arrow { position: static; grid-column: 2; grid-row: 1; transform: none; width: 20px; height: 20px; justify-self: end; }
@media (min-width:600px) {
  .landing-tiles .hero-inner { grid-template-columns: minmax(0,1fr) minmax(0,1fr); grid-template-rows: auto minmax(0,1fr) auto; column-gap: 24px; }
  .landing-tiles .hero-toolbar { grid-column: 1/-1; grid-row: 1; }
  .landing-tiles .hero-copy { grid-column: 1; grid-row: 3; align-self: end; }
  .landing-tiles .service-stack { grid-column: 2; grid-row: 3; margin-top: 0; }
}
.landing-mini { --landing-pad-top: 4px; --landing-pad-bottom: max(8px,env(safe-area-inset-bottom,0px)); --landing-gap: 6px; }
.landing-mini .topbar-inner { padding-block: 6px 4px; }
.landing-mini .brand { width: min(30rem,100%); }
.landing-mini .brand-tagline { font-size: clamp(12px,3.5vw,16px); }
.landing-mini .hero-description-btn { display: none; }
.landing-mini .hero-copy .quote-btn { --button-height: 44px; min-height: 44px; margin-top: 0; padding-block: 6px; }
.landing-mini .service-row { --button-height: 56px; min-height: 56px; padding-block: 5px; }
.landing-mini .service-stack { gap: 6px; }
@media (min-width:720px) {
  .landing-mini .hero-inner { grid-template-columns: minmax(0,1fr); grid-template-rows: auto minmax(0,1fr) auto auto; }
  .landing-mini .hero-copy { grid-column: 1; grid-row: 3; width: min(34rem,100%); justify-self: center; }
  .landing-mini .service-stack { grid-column: 1; grid-row: 4; grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 6px; }
  .landing-mini .hero-copy .quote-btn { width: 100%; }
}