/*!
 * QMAN PRO - Website design and development
 * Author: Frey Gabor
 * Designer: Frey Gabor
 * Developer: Frey Gabor
 * Official developer website: https://freygabor.com/
 * Copyright (c) 2026 Frey Gabor. All rights reserved.
 * Applies to the custom website implementation and original development assets.
 * Client branding, supplied content/media and third-party assets retain their own rights.
 */
:root {
  --red:#e41919;
  --red-hover:#bf1414;
  --ink:#1a1a1a;
  --muted:#64676b;
  --line:#e3e4e6;
  --paper:#f5f6f7;
  --pink:#fff3f2;
  --white:#fff;
  --radius:12px;
  --font:Arial,Helvetica,sans-serif;
}

* {
  box-sizing:border-box;
}

html {
  font-size:17px;
  scroll-behavior:smooth;
  scroll-padding-top:108px;
}

body {
  margin:0;
  color:var(--ink);
  background:var(--white);
  font-family:var(--font);
  font-size:1rem;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

a {
  color:inherit;
  text-decoration:none;
}

button,input {
  font:inherit;
}

button {
  cursor:pointer;
}

button:disabled {
  cursor:not-allowed;
}

img {
  max-width:100%;
  display:block;
}

svg {
  width:24px;
  height:24px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
  flex-shrink:0;
}

h1,h2,h3,p {
  margin-top:0;
}

h1,h2,h3 {
  line-height:1.1;
  letter-spacing:-.045em;
}

h2 {
  font-size:clamp(2.2rem,4.1vw,3.6rem);
  font-weight:750;
  margin-bottom:24px;
}

h3 {
  font-size:1.4rem;
  letter-spacing:-.025em;
}

p {
  margin-bottom:22px;
}

::selection {
  background:var(--red);
  color:white;
}

:focus-visible {
  outline:3px solid var(--red);
  outline-offset:5px;
}

button:focus-visible {
  outline-offset:3px;
}

.container {
  width:min(1600px,calc(100% - 96px));
  margin-inline:auto;
}

.section {
  padding-block:104px;
}

.section-anchor {
  scroll-margin-top:20px;
}

.eyebrow {
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--red);
  margin-bottom:24px;
  display:flex;
  align-items:center;
  gap:10px;
}

.eyebrow>span {
  width:22px;
  height:2px;
  background:var(--red);
}

.muted {
  color:var(--muted);
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:13px 25px;
  background:var(--red);
  border:1px solid var(--red);
  border-radius:6px;
  color:white;
  font-size:.9375rem;
  font-weight:700;
  line-height:1.4;
  transition:background .18s,transform .18s,border-color .18s;
}

.button:hover {
  background:var(--red-hover);
  border-color:var(--red-hover);
  transform:translateY(-2px);
}

.button-secondary {
  background:white;
  color:var(--ink);
  border-color:#d1d3d6;
}

.button-secondary:hover {
  background:var(--paper);
  border-color:var(--ink);
}

.button-dark {
  background:var(--ink);
  border-color:var(--ink);
}

.button-dark:hover {
  background:#363636;
  border-color:#363636;
}

.button-small {
  min-height:44px;
  padding:10px 19px;
  font-size:.875rem;
}

.button-group {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.text-link {
  display:inline-block;
  font-weight:700;
  border-bottom:1px solid var(--ink);
  padding-bottom:4px;
}

.text-link:hover {
  color:var(--red);
  border-color:var(--red);
}

.skip-link {
  position:fixed;
  left:20px;
  top:-100px;
  z-index:100;
  background:var(--ink);
  color:white;
  padding:12px 20px;
}

.skip-link:focus {
  top:12px;
}

.announcement {
  background:var(--paper);
  border-bottom:1px solid var(--line);
  font-size:.75rem;
  color:var(--muted);
}

.announcement-inner {
  display:flex;
  justify-content:space-between;
  padding-block:8px;
  letter-spacing:.025em;
}

.announcement strong {
  color:var(--ink);
  font-weight:600;
}

.site-header {
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(255,255,255,.97);
  border-bottom:1px solid var(--line);
}

.header-inner {
  min-height:92px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.brand {
  display:flex;
  align-items:center;
  gap:12px;
  font-size:1.55rem;
  font-weight:900;
  letter-spacing:-.065em;
  font-style:italic;
  line-height:1;
}

.brand b {
  color:var(--red);
}

.brand small {
  display:block;
  margin-top:8px;
  font-size:.56rem;
  font-style:normal;
  font-weight:600;
  letter-spacing:.13em;
}

.q-mark {
  width:34px;
  height:34px;
  border:7px solid #a6a7a9;
  border-left-color:#55575a;
  border-bottom-color:#2b2c2e;
  border-radius:50%;
  position:relative;
  flex-shrink:0;
  margin-right:3px;
}

.q-mark:after {
  content:'';
  position:absolute;
  right:-9px;
  bottom:-4px;
  width:17px;
  height:7px;
  background:var(--red);
  transform:rotate(45deg);
}

.main-nav {
  display:flex;
  align-items:center;
  gap:29px;
  font-size:.875rem;
  font-weight:600;
}

.main-nav>a:not(.button):hover,.main-nav>a[aria-current=true]:not(.button) {
  color:var(--red);
}

.menu-toggle {
  display:none;
}

.hero {
  padding-top:50px;
  background:linear-gradient(180deg,#fff 0%,#fafafa 100%);
}

.hero-grid {
  display:grid;
  grid-template-columns:1fr 1.02fr;
  gap:42px;
  align-items:center;
}

.hero-copy {
  padding-block:26px;
}

.hero h1 {
  font-size:clamp(3rem,5.4vw,4.8rem);
  font-weight:750;
  letter-spacing:-.06em;
  line-height:1.04;
  margin:0 0 26px;
}

.hero h1 em {
  font-style:normal;
  color:var(--red);
}

.hero-description {
  font-size:1.125rem;
  line-height:1.75;
  max-width:470px;
  color:var(--muted);
  margin-bottom:30px;
}

.hero-assurances {
  display:flex;
  flex-wrap:wrap;
  gap:19px;
  margin-top:28px;
  font-size:.8rem;
  color:var(--muted);
}

.hero-assurances span {
  display:flex;
  gap:7px;
  align-items:center;
}

.hero-assurances svg {
  width:15px;
  height:15px;
  color:var(--red);
  stroke-width:2;
}

.hero-visual {
  position:relative;
  height:510px;
  border-radius:12px;
  overflow:hidden;
  background:#dbd6d0;
}

.hero-image {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:55% center;
}

.image-label {
  position:absolute;
  top:23px;
  left:23px;
  color:white;
  font-size:.625rem;
  font-weight:600;
  letter-spacing:.16em;
  display:flex;
  align-items:center;
  gap:8px;
  background:rgba(26,26,26,.65);
  padding:8px 11px;
  border-radius:3px;
}

.label-square {
  height:6px;
  width:6px;
  background:var(--red);
}

.photo-caption {
  position:absolute;
  bottom:20px;
  left:20px;
  right:20px;
  background:white;
  border-radius:8px;
  padding:19px;
  display:flex;
  align-items:center;
  gap:16px;
  box-shadow:0 6px 30px #0000000d;
}

.caption-icon {
  height:44px;
  width:44px;
  background:var(--pink);
  border-radius:50%;
  display:grid;
  place-items:center;
  color:var(--red);
  flex-shrink:0;
}

.photo-caption strong {
  display:block;
  font-size:1rem;
  margin-bottom:2px;
}

.photo-caption div>span {
  font-size:.75rem;
  color:var(--muted);
}

.specification-strip {
  display:grid;
  grid-template-columns:1.25fr .8fr .8fr 1fr;
  margin-top:47px;
  border-top:1px solid var(--line);
  padding-block:27px 31px;
  align-items:center;
  gap:26px;
}

.specification-strip>div+div {
  border-left:1px solid var(--line);
  padding-left:32px;
}

.spec-intro {
  display:flex;
  align-items:center;
  gap:15px;
  font-size:.8rem;
  color:var(--muted);
  line-height:1.6;
}

.spec-intro strong {
  color:var(--ink);
  font-weight:600;
}

.spec-intro svg {
  color:var(--red);
  width:28px;
  height:28px;
}

.specification-strip>div>strong {
  font-size:1.6rem;
  letter-spacing:-.035em;
  line-height:1.2;
}

.specification-strip>div>strong span {
  font-size:.875rem;
  font-weight:500;
  letter-spacing:0;
}

.specification-strip small {
  display:block;
  color:var(--muted);
  font-size:.75rem;
  margin-top:5px;
}

.spec-note {
  font-size:.8rem;
  color:var(--muted);
}

.spec-note strong {
  font-size:.8rem!important;
  font-weight:600;
  color:var(--ink);
  letter-spacing:0!important;
}

@media(min-width:1500px) {
  .hero-grid {
    gap:70px;
  }
  .hero-visual {
    height:555px;
  }
}

@media(max-width:1050px) {
  .container {
    width:calc(100% - 56px);
  }
  .main-nav {
    gap:18px;
  }
  .hero-grid {
    gap:26px;
  }
  .hero h1 {
    font-size:3.7rem;
  }
  .hero-visual {
    height:490px;
  }
  .hero .eyebrow {
    font-size:.65rem;
  }
  .hero-assurances {
    gap:12px;
  }
  .specification-strip {
    gap:16px;
  }
  .specification-strip>div+div {
    padding-left:20px;
  }
}

@media(max-width:960px) {
  html {
    scroll-padding-top:88px;
  }
  .container {
    width:calc(100% - 40px);
  }
  .announcement-inner {
    justify-content:center;
  }
  .announcement-inner>span:last-child {
    display:none;
  }
  .header-inner {
    min-height:76px;
  }
  .brand {
    font-size:1.35rem;
  }
  .brand small {
    font-size:.5rem;
  }
  .q-mark {
    width:29px;
    height:29px;
    border-width:6px;
  }
  .menu-toggle {
    display:flex;
    align-items:center;
    gap:9px;
    min-height:44px;
    padding:8px 3px;
    background:none;
    border:0;
    font-size:.875rem;
    font-weight:600;
  }
  .menu-icon,.menu-icon:before,.menu-icon:after {
    display:block;
    width:19px;
    height:2px;
    background:var(--ink);
    position:relative;
  }
  .menu-icon:before,.menu-icon:after {
    content:'';
    position:absolute;
  }
  .menu-icon:before {
    top:-6px;
  }
  .menu-icon:after {
    top:6px;
  }
  .main-nav {
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:100%;
    background:white;
    flex-direction:column;
    align-items:stretch;
    padding:18px 20px 24px;
    gap:0;
    box-shadow:0 14px 20px #0000000c;
    border-top:1px solid var(--line);
  }
  .main-nav.is-open {
    display:flex;
  }
  .main-nav>a {
    padding:13px;
  }
  .main-nav>.button {
    margin-top:10px;
  }
  .hero {
    padding-top:22px;
  }
  .hero-grid {
    grid-template-columns:1fr;
    gap:28px;
  }
  .hero-copy {
    padding-block:16px 0;
  }
  .hero h1 {
    font-size:clamp(2.8rem,8.5vw,4.5rem);
    max-width:650px;
    margin-bottom:22px;
  }
  .hero .eyebrow {
    font-size:.6875rem;
    margin-bottom:20px;
  }
  .hero-description {
    max-width:620px;
    font-size:1.0625rem;
    margin-bottom:24px;
  }
  .hero-assurances {
    margin-top:20px;
    gap:20px;
  }
  .hero-visual {
    height:430px;
  }
  .specification-strip {
    grid-template-columns:1fr 1fr;
    margin-top:30px;
    gap:23px;
    padding-block:24px;
  }
  .specification-strip>div+div {
    border:0;
    padding:0;
  }
  .specification-strip>div:nth-child(2n) {
    border-left:1px solid var(--line);
    padding-left:24px;
  }
  .specification-strip>.spec-intro {
    font-size:.75rem;
  }
  .section {
    padding-block:68px;
  }
  h2 {
    font-size:2.65rem;
  }
}

@media(max-width:420px) {
  .container {
    width:calc(100% - 36px);
  }
  .hero .button-group {
    gap:10px;
  }
  .hero .button {
    padding:13px 15px;
    font-size:.875rem;
  }
  .hero-visual {
    height:350px;
  }
  .photo-caption {
    left:12px;
    right:12px;
    bottom:12px;
    padding:14px;
    gap:11px;
  }
  .photo-caption div>span {
    font-size:.7rem;
  }
  .photo-caption strong {
    font-size:.9rem;
  }
  .caption-icon {
    width:37px;
    height:37px;
  }
  .spec-intro svg {
    display:none;
  }
  .hero-assurances {
    font-size:.75rem;
    gap:14px;
  }
  h2 {
    font-size:2.3rem;
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*:before,*:after {
    animation:none!important;
    transition:none!important;
  }
}

.section-heading {
  display:grid;
  grid-template-columns:1.25fr 1fr;
  gap:80px;
  align-items:end;
  margin-bottom:46px;
}

.section-heading h2 {
  margin-bottom:0;
}

.section-heading>p {
  color:var(--muted);
  max-width:410px;
  justify-self:end;
  margin-bottom:5px;
  font-size:1.0625rem;
  line-height:1.8;
}

.benefits-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
}

.benefit {
  position:relative;
  padding:29px 27px 32px;
}

.benefit+.benefit {
  border-left:1px solid var(--line);
}

.feature-icon {
  display:inline-grid;
  place-items:center;
  height:48px;
  width:48px;
  background:var(--pink);
  border-radius:8px;
  color:var(--red);
  margin-bottom:35px;
}

.feature-icon svg {
  height:26px;
  width:26px;
}

.feature-number {
  position:absolute;
  right:26px;
  top:37px;
  font-size:.75rem;
  font-weight:500;
  color:#73777c;
}

.benefit h3 {
  font-size:1.18rem;
  letter-spacing:-.035em;
  margin-bottom:14px;
}

.benefit p {
  font-size:1rem;
  line-height:1.75;
  color:var(--muted);
  margin:0;
}

.principle-note {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:27px;
  color:var(--muted);
  font-size:.875rem;
}

.principle-note p {
  margin:0;
}

.principle-note strong {
  color:var(--ink);
  font-weight:600;
}

.principle-note svg {
  width:19px;
  height:19px;
  color:var(--red);
}

.options-section {
  background:var(--paper);
}

.option-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}

.option-card {
  background:white;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:31px;
  display:flex;
  flex-direction:column;
}

.option-card.featured {
  border-color:#ebc0bd;
  box-shadow:inset 0 3px 0 var(--red);
  background:white;
}

.option-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:31px;
  color:var(--red);
}

.option-top span {
  font-size:.625rem;
  letter-spacing:.12em;
  font-weight:700;
}

.option-top svg {
  width:29px;
  height:29px;
}

.option-card h3 {
  font-size:1.65rem;
  line-height:1.16;
  min-height:62px;
  margin-bottom:20px;
}

.option-card>p {
  font-size:1rem;
  color:var(--muted);
  line-height:1.75;
}

.check-list {
  list-style:none;
  padding:0;
  margin:6px 0 30px;
  font-size:.8125rem;
  line-height:1.6;
}

.check-list li {
  position:relative;
  padding:9px 0 9px 21px;
  border-bottom:1px solid #ededed;
}

.check-list li:before {
  content:'✓';
  position:absolute;
  left:0;
  color:var(--red);
  font-weight:700;
}

.option-card .button {
  margin-top:auto;
  font-size:.875rem;
  padding-inline:15px;
}

.options-note {
  color:var(--muted);
  font-size:.8125rem;
  line-height:1.7;
  max-width:770px;
  text-align:center;
  margin:27px auto 0;
}

.process-grid {
  list-style:none;
  padding:0;
  margin:50px 0 0;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:36px;
}

.process-grid li {
  position:relative;
  border-top:1px solid var(--line);
  padding-top:29px;
}

.process-grid li:before {
  content:'';
  width:9px;
  height:9px;
  background:var(--red);
  border:4px solid white;
  box-sizing:content-box;
  position:absolute;
  top:-9px;
  left:0;
}

.process-grid li>span {
  font-size:.75rem;
  font-weight:600;
  color:var(--red);
}

.process-grid h3 {
  font-size:1.35rem;
  margin:19px 0 13px;
}

.process-grid p {
  font-size:1rem;
  color:var(--muted);
  margin:0;
}

.checker-section {
  background:#f4f5f6;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.checker-layout {
  display:grid;
  grid-template-columns:.9fr 1fr;
  gap:100px;
  align-items:center;
}

.checker-copy h2 {
  font-size:clamp(2.8rem,4.5vw,4rem);
}

.checker-copy h2 em {
  font-style:normal;
  color:var(--red);
}

.checker-copy>p:not(.eyebrow) {
  color:var(--muted);
  max-width:400px;
}

.checker-reassurance {
  display:flex;
  gap:12px;
  margin-top:31px;
  align-items:center;
  font-size:.8125rem;
}

.checker-reassurance p {
  margin:0;
}

.checker-reassurance svg {
  color:var(--red);
  width:22px;
}

.checker-reassurance strong {
  font-weight:500;
  color:var(--muted);
}

.checker-copy>.checker-note {
  font-size:.75rem;
  margin-top:27px;
  line-height:1.8;
  max-width:340px;
}

.checker-panel {
  padding:37px;
  background:white;
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:0 12px 35px #1a1a1a06;
  min-height:450px;
}

.quiz-top {
  display:flex;
  justify-content:space-between;
  font-size:.75rem;
  color:var(--muted);
}

.quiz-top span:first-child {
  color:var(--red);
  font-weight:700;
}

.progress-steps {
  display:flex;
  gap:6px;
  margin-top:13px;
  margin-bottom:29px;
}

.progress-steps span {
  flex:1;
  height:3px;
  background:var(--line);
}

.progress-steps span.current {
  background:var(--red);
}

fieldset {
  border:0;
  padding:0;
  margin:0;
  min-width:0;
}

legend {
  font-size:1.55rem;
  line-height:1.25;
  font-weight:700;
  letter-spacing:-.03em;
  margin-bottom:9px;
  width:100%;
  padding:0;
}

legend:focus {
  outline:none;
}

.question-hint {
  color:var(--muted);
  font-size:.8125rem;
  margin-bottom:23px;
}

.choices {
  display:grid;
  gap:10px;
}

.choice {
  display:flex;
  gap:12px;
  align-items:center;
  cursor:pointer;
  border:1px solid #dedfe1;
  border-radius:6px;
  padding:15px 17px;
  min-height:55px;
  font-size:.9375rem;
  line-height:1.4;
  transition:border-color .2s,background .2s;
}

.choice:hover {
  border-color:#9b9b9b;
}

.choice:has(input:checked) {
  background:var(--pink);
  border-color:var(--red);
}

.choice input {
  appearance:none;
  -webkit-appearance:none;
  width:18px;
  height:18px;
  border:1.5px solid #bfc1c5;
  border-radius:50%;
  margin:0;
  flex-shrink:0;
}

.choice input:checked {
  border:5px solid var(--red);
  background:white;
}

.quiz-actions {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:30px;
  padding-top:23px;
  border-top:1px solid var(--line);
}

.quiz-actions .button {
  min-width:136px;
  min-height:46px;
}

.button:disabled {
  background:#f1f2f3;
  color:#71757b;
  border-color:#f1f2f3;
  transform:none;
}

.back-button {
  background:none;
  border:0;
  padding:10px 0;
  color:var(--muted);
  font-size:.875rem;
  text-decoration:underline;
  text-underline-offset:4px;
}

.back-button:hover {
  color:var(--ink);
}

.result-icon {
  color:var(--red);
  display:grid;
  place-items:center;
  width:45px;
  height:45px;
  border-radius:50%;
  background:var(--pink);
  margin-bottom:22px;
}

.checker-panel .eyebrow {
  margin-bottom:14px;
  font-size:.65rem;
}

#result-title {
  font-size:1.65rem;
  line-height:1.25;
  margin-bottom:15px;
}

#result-description {
  font-size:.875rem;
  color:var(--muted);
}

.result-summary {
  font-size:.8125rem;
  padding:16px 18px;
  background:var(--paper);
  border-radius:6px;
  display:grid;
  grid-template-columns:70px 1fr;
  gap:7px 10px;
}

.result-summary dt {
  color:var(--muted);
}

.result-summary dd {
  margin:0;
  font-weight:600;
}

.result-note {
  font-size:.75rem;
  color:var(--muted);
  margin:18px 0;
}

.result-actions {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.result-actions .button {
  padding:12px 15px;
  min-height:46px;
  font-size:.8125rem;
  gap:8px;
}

.result-actions svg {
  width:16px;
  height:16px;
}

.result-bottom {
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
  margin-top:12px;
}

#copy-status {
  font-size:.75rem;
  color:var(--muted);
}

.story-grid {
  display:grid;
  grid-template-columns:.9fr 1fr;
  gap:100px;
  align-items:center;
}

.brochure-visual {
  background:var(--paper);
  border-radius:var(--radius);
  padding:25px;
}

.brochure-image-link {
  display:block;
  border-radius:6px;
  overflow:hidden;
  box-shadow:0 10px 25px #0000000a;
}

.brochure-image-link img {
  width:100%;
  height:auto;
  transition:transform .25s;
}

.brochure-image-link:hover img {
  transform:scale(1.015);
}

.brochure-caption {
  display:flex;
  justify-content:space-between;
  gap:12px;
  font-size:.625rem;
  font-weight:600;
  letter-spacing:.07em;
  padding-top:17px;
  color:var(--muted);
}

.story-copy h2 {
  font-size:clamp(2.2rem,3.7vw,3.2rem);
  line-height:1.13;
}

.story-copy>p:not(.eyebrow) {
  color:var(--muted);
  font-size:1rem;
}

.story-copy>p strong {
  font-weight:600;
  color:var(--ink);
}

blockquote {
  margin:28px 0;
  padding-left:22px;
  border-left:3px solid var(--red);
  font-size:1.35rem;
  line-height:1.5;
  letter-spacing:-.02em;
}

cite {
  display:block;
  font-size:.8125rem;
  font-style:normal;
  letter-spacing:0;
  margin-top:17px;
  font-weight:600;
}

cite span {
  display:block;
  font-size:.6875rem;
  color:var(--muted);
  font-weight:400;
  margin-top:2px;
}

.story-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-top:32px;
  padding-top:26px;
  border-top:1px solid var(--line);
}

.experience {
  display:flex;
  gap:13px;
  align-items:center;
}

.experience>strong {
  font-size:2.7rem;
  line-height:1;
  color:var(--red);
  letter-spacing:-.05em;
}

.experience>span {
  font-size:.7rem;
  color:var(--muted);
}

.story-bottom .text-link {
  font-size:.8125rem;
  white-space:nowrap;
}

.faq-section {
  background:#fafafa;
  border-top:1px solid var(--line);
}

.faq-grid {
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:80px;
}

.faq-grid h2 {
  font-size:3rem;
}

.faq-grid>div>p.muted {
  max-width:260px;
}

.faq-grid .text-link {
  font-size:.875rem;
}

.faq-list {
  border-top:1px solid #d9dbde;
}

.faq-list details {
  border-bottom:1px solid #d9dbde;
}

.faq-list summary {
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:23px 0;
  font-size:1rem;
  font-weight:600;
  line-height:1.5;
}

.faq-list summary::-webkit-details-marker {
  display:none;
}

.faq-list summary>span {
  width:16px;
  height:16px;
  position:relative;
  flex-shrink:0;
}

.faq-list summary>span:before,.faq-list summary>span:after {
  content:'';
  height:1.5px;
  width:14px;
  background:var(--red);
  position:absolute;
  left:1px;
  top:7px;
}

.faq-list summary>span:after {
  transform:rotate(90deg);
  transition:transform .2s;
}

.faq-list details[open] summary>span:after {
  transform:rotate(0);
}

.faq-list details>p {
  margin:0 34px 24px 0;
  color:var(--muted);
  font-size:1rem;
  line-height:1.8;
}

.contact-section {
  background:var(--red);
  color:white;
  padding-block:70px;
}

.contact-inner {
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:80px;
  align-items:center;
}

.contact-inner .eyebrow {
  color:white;
  opacity:.86;
  font-size:.6875rem;
  margin-bottom:20px;
}

.contact-inner h2 {
  font-size:clamp(2rem,3.5vw,3.1rem);
  margin-bottom:20px;
}

.contact-inner p:not(.eyebrow) {
  font-size:1rem;
  line-height:1.8;
  color:#fff;
  opacity:.94;
  max-width:610px;
}

.contact-location {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.8125rem;
}

.contact-location svg {
  width:18px;
  height:18px;
}

.contact-action {
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:17px;
}

.contact-action>.button {
  padding:17px 30px;
  min-height:58px;
}

.contact-action>span {
  font-size:.75rem;
  color:#fff;
  opacity:.9;
}

.site-footer {
  padding-top:58px;
  background:white;
}

.footer-main {
  display:grid;
  grid-template-columns:1.1fr 1fr 1fr;
  gap:60px;
  padding-bottom:45px;
}

.footer-main p {
  color:var(--muted);
  font-size:.8125rem;
  line-height:1.8;
  margin:23px 0 0;
}

.footer-main nav {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px 30px;
  font-size:.8125rem;
  align-content:start;
  padding-top:6px;
}

.footer-main nav a:hover {
  color:var(--red);
}

.footer-location {
  font-size:.875rem;
  justify-self:end;
  line-height:1.8;
}

.footer-location strong {
  font-weight:600;
}

.footer-location a {
  display:block;
  color:var(--muted);
  font-size:.8125rem;
  margin-top:13px;
}

.footer-location a:hover {
  color:var(--red);
}

.footer-bottom {
  display:flex;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid var(--line);
  padding-block:21px 24px;
  color:var(--muted);
  font-size:.6875rem;
}

.footer-bottom>a:hover {
  color:var(--red);
}

[hidden] {
  display:none!important;
}

@media(max-width:1050px) {
  .section-heading {
    gap:50px;
  }
  .benefit {
    padding:24px 21px;
  }
  .feature-number {
    right:21px;
  }
  .option-card {
    padding:25px 23px;
  }
  .option-card h3 {
    font-size:1.5rem;
  }
  .check-list {
    font-size:.75rem;
  }
  .checker-layout,.story-grid {
    gap:55px;
  }
  .checker-panel {
    padding:28px;
  }
  .story-bottom {
    flex-wrap:wrap;
  }
  .faq-grid {
    gap:45px;
  }
  .contact-inner {
    gap:50px;
  }
  .footer-main {
    gap:36px;
  }
  .footer-main nav {
    gap:12px 20px;
  }
}

@media(max-width:960px) {
  .section-heading {
    grid-template-columns:1fr;
    gap:20px;
    margin-bottom:32px;
  }
  .section-heading>p {
    justify-self:start;
    max-width:560px;
    font-size:1rem;
  }
  .benefits-grid {
    grid-template-columns:1fr 1fr;
  }
  .benefit {
    padding:26px;
  }
  .benefit:nth-child(3) {
    border-left:0;
  }
  .benefit:nth-child(n+3) {
    border-top:1px solid var(--line);
  }
  .feature-icon {
    margin-bottom:25px;
  }
  .principle-note {
    font-size:.8125rem;
    align-items:flex-start;
  }
  .option-grid {
    grid-template-columns:1fr;
    gap:17px;
  }
  .option-card {
    padding:28px;
  }
  .option-card h3 {
    font-size:1.7rem;
    min-height:0;
  }
  .option-card h3 br {
    display:none;
  }
  .option-card>p {
    max-width:600px;
  }
  .option-top {
    margin-bottom:22px;
  }
  .check-list {
    font-size:.875rem;
  }
  .option-card .button {
    align-self:flex-start;
    min-width:220px;
  }
  .options-note {
    text-align:left;
    font-size:.75rem;
  }
  .process-grid {
    grid-template-columns:1fr 1fr;
    gap:35px;
  }
  .checker-layout,.story-grid,.faq-grid {
    grid-template-columns:1fr;
    gap:35px;
  }
  .checker-copy>p:not(.eyebrow) {
    max-width:560px;
  }
  .checker-copy>.checker-note {
    max-width:100%;
  }
  .checker-copy h2 br {
    display:none;
  }
  .checker-copy h2 {
    font-size:2.6rem;
  }
  .checker-copy h2 em {
    white-space:normal;
  }
  .checker-panel {
    padding:28px;
    min-height:410px;
  }
  .checker-reassurance {
    margin-top:20px;
  }
  .checker-copy>.checker-note {
    margin-bottom:0;
    margin-top:17px;
  }
  .story-grid {
    gap:35px;
  }
  .brochure-visual {
    max-width:430px;
    margin:auto;
  }
  .story-copy h2 {
    font-size:2.65rem;
  }
  .story-bottom {
    flex-wrap:nowrap;
  }
  .faq-grid h2 {
    font-size:2.65rem;
  }
  .faq-grid>div>p.muted {
    max-width:none;
  }
  .contact-inner {
    grid-template-columns:1fr;
    gap:30px;
  }
  .contact-action {
    align-items:flex-start;
    gap:13px;
  }
  .contact-section {
    padding-block:55px;
  }
  .contact-inner h2 {
    font-size:2.3rem;
  }
  .footer-main {
    grid-template-columns:1fr 1fr;
    gap:36px;
  }
  .footer-location {
    justify-self:start;
  }
  .footer-main>div:first-child {
    grid-column:1/-1;
  }
  .footer-bottom {
    flex-wrap:wrap;
    gap:8px 20px;
  }
  .footer-bottom>span:nth-child(2) {
    order:3;
    flex-basis:100%;
  }
  .site-footer {
    padding-top:40px;
  }
}

@media(max-width:480px) {
  .benefits-grid {
    grid-template-columns:1fr;
  }
  .benefit+.benefit {
    border-left:0;
    border-top:1px solid var(--line);
  }
  .benefit {
    padding:25px;
  }
  .feature-icon {
    margin-bottom:20px;
  }
  .benefit h3 {
    font-size:1.25rem;
  }
  .process-grid {
    gap:28px 24px;
  }
  .process-grid h3 {
    font-size:1.18rem;
  }
  .process-grid p {
    font-size:.875rem;
  }
  .checker-panel {
    padding:24px 21px;
  }
  legend {
    font-size:1.4rem;
  }
  .choice {
    font-size:.875rem;
    padding:14px;
  }
  .checker-copy h2 {
    font-size:2.45rem;
  }
  .result-actions {
    flex-direction:column;
  }
  .result-actions>.button {
    width:100%;
  }
  .story-copy h2 {
    font-size:2.3rem;
  }
  .brochure-visual {
    padding:16px;
  }
  .story-bottom {
    gap:12px;
  }
  .experience {
    gap:9px;
  }
  .experience>strong {
    font-size:2.2rem;
  }
  .experience>span {
    font-size:.65rem;
  }
  .story-bottom .text-link {
    font-size:.75rem;
  }
  .faq-grid h2 {
    font-size:2.3rem;
  }
  .faq-list summary {
    font-size:.9375rem;
  }
  .footer-main {
    grid-template-columns:1fr;
    gap:28px;
  }
  .footer-main nav {
    max-width:300px;
  }
  .footer-main>div:first-child {
    grid-column:auto;
  }
  .footer-location {
    font-size:.8125rem;
  }
  .footer-bottom {
    justify-content:flex-start;
  }
}

@media print {
  .announcement,.site-header,.button,.site-footer,.quiz-actions,.contact-section,.skip-link {
    display:none!important;
  }
  .section {
    padding-block:25px;
  }
  .container {
    width:100%;
  }
  .checker-layout {
    display:block;
  }
  .checker-copy {
    display:none;
  }
  .checker-panel {
    border:0;
    box-shadow:none;
  }
  .hero {
    padding-top:0;
  }
  details>p {
    display:block!important;
  }
  body {
    font-size:12pt;
  }
}

#result {
  scroll-margin-top:120px;
}

/* Brand, readability and wider desktop composition. */
@font-face {
  font-family:'Montserrat';
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url('fonts/montserrat-latin.woff2') format('woff2');
}
.hero h1 {
  font-family:'Montserrat','Arial Black',Arial,sans-serif;
  font-size:clamp(3.1rem,6vw,6.4rem);
  font-weight:900;
  letter-spacing:-.03em;
  line-height:1.04;
  margin-bottom:30px;
}
.hero-description { max-width:570px; font-size:1.15rem; }
.hero-assurances { font-size:.875rem; }
.section-heading>p { max-width:500px; }
.announcement { font-size:.8rem; }
.image-label { font-size:.7rem; }
.photo-caption div>span { font-size:.85rem; }
.spec-intro,.spec-note,.specification-strip small { font-size:.85rem; }
.spec-note strong { font-size:.85rem!important; }
.option-top span { font-size:.72rem; }
.check-list { font-size:.88rem; }
.options-note { font-size:.875rem; }
.quiz-top,.checker-copy>.checker-note,.result-note { font-size:.8rem; }
.question-hint,.checker-reassurance { font-size:.875rem; }
.result-summary { font-size:.875rem; }
.brochure-caption,cite span { font-size:.75rem; }
.experience>span { font-size:.8rem; }
.story-bottom .text-link { font-size:.875rem; }
.footer-main p,.footer-main nav,.footer-location a { font-size:.875rem; }
.footer-bottom { font-size:.8rem; align-items:center; flex-wrap:wrap; }
.developer-credit { color:var(--muted); }
.developer-credit strong { color:var(--ink); font-weight:600; }
.developer-credit:hover strong { color:var(--red); }
.story-grid { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); }
.brochure-visual { width:100%; max-width:550px; justify-self:center; }
.story-copy { max-width:720px; }

/* The reference ladder creates a responsive photographic backdrop. */
.options-section {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:#f7f8fa;
  border-block:1px solid var(--line);
}
.options-section>.container { position:relative; z-index:1; }
.options-backdrop { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.options-ladder {
  position:absolute;
  right:-3%;
  top:-4%;
  width:80%;
  height:108%;
  object-fit:cover;
  object-position:50% 43%;
  opacity:.24;
  filter:grayscale(.75);
  mask-image:linear-gradient(90deg,transparent,#000 42%);
}
.options-backdrop:after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(247,248,250,.12),rgba(247,248,250,.5) 70%,#f7f8fa);
}
.options-gridlines {
  position:absolute;
  inset:0;
  opacity:.28;
  background-image:linear-gradient(#c9cbd1 1px,transparent 1px),linear-gradient(90deg,#c9cbd1 1px,transparent 1px);
  background-size:68px 68px;
  mask-image:linear-gradient(90deg,transparent,#000 75%);
}
.options-section .section-heading { margin-bottom:48px; }
.options-section .section-heading>p {
  background:rgba(247,248,250,.84);
  border-left:2px solid var(--red);
  padding:14px 20px;
  border-radius:0 8px 8px 0;
  color:#505358;
}
.option-grid { gap:26px; }
.option-card {
  position:relative;
  padding:36px;
  background:rgba(255,255,255,.96);
  border-color:#d9dce1;
  box-shadow:0 12px 36px rgba(26,26,26,.035);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.option-card.featured {
  background:white;
  box-shadow:inset 0 4px 0 var(--red),0 12px 36px rgba(26,26,26,.04);
}
.option-card:hover,.option-card:focus-within {
  transform:translateY(-7px);
  border-color:var(--red);
  box-shadow:0 20px 46px rgba(80,28,28,.1);
}
.option-card.featured:hover,.option-card.featured:focus-within {
  box-shadow:inset 0 4px 0 var(--red),0 20px 46px rgba(80,28,28,.1);
}
.option-top svg {
  padding:12px;
  box-sizing:content-box;
  background:var(--pink);
  border:1px solid #f7d9d6;
  border-radius:12px;
  transition:transform .25s ease;
}
.option-card:hover .option-top svg { transform:rotate(-5deg); }
.option-card h3 { font-size:1.8rem; }
.option-card .button { min-height:52px; }

/* A brief, non-blocking logo introduction; it also exits without JavaScript. */
.brand-intro {
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  background:white;
  pointer-events:none;
  animation:intro-out .5s cubic-bezier(.4,0,.2,1) 1.2s forwards;
}
.brand-intro-content { width:min(600px,85vw); text-align:center; }
.brand-intro img {
  width:100%;
  height:auto;
  animation:intro-logo 1s cubic-bezier(.16,1,.3,1) both;
}
.brand-intro-line {
  display:block;
  width:110px;
  height:3px;
  margin:26px auto 0;
  background:var(--red);
  transform-origin:left;
  animation:intro-line 1s cubic-bezier(.16,1,.3,1) .1s both;
}
@keyframes intro-logo {
  from { opacity:0; transform:translateY(16px) scale(.96); }
  to { opacity:1; transform:translateY(0) scale(1); }
}
@keyframes intro-line {
  from { transform:scaleX(0); opacity:0; }
  to { transform:scaleX(1); opacity:1; }
}
@keyframes intro-out {
  to { opacity:0; visibility:hidden; }
}

/* Native modal provides keyboard focus management and Escape-to-close. */
body.brochure-open { overflow:hidden; }
.brochure-dialog {
  width:min(1080px,calc(100% - 48px));
  max-width:none;
  max-height:calc(100dvh - 48px);
  padding:0;
  border:0;
  border-radius:14px;
  background:#fff;
  color:var(--ink);
  box-shadow:0 24px 90px #0005;
  overflow:hidden;
}
.brochure-dialog[open] { display:flex; flex-direction:column; }
.brochure-dialog::backdrop { background:rgba(12,14,17,.78); backdrop-filter:blur(5px); }
.brochure-dialog-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:20px 26px;
  border-bottom:1px solid var(--line);
}
.brochure-dialog-header .eyebrow { margin:0 0 5px; font-size:.68rem; }
.brochure-dialog h2 { font-size:1.3rem; margin:0; letter-spacing:-.025em; }
.dialog-close {
  width:44px;
  height:44px;
  flex-shrink:0;
  border:1px solid var(--line);
  border-radius:50%;
  background:var(--paper);
  color:var(--ink);
  font-size:1.7rem;
  display:grid;
  place-items:center;
  line-height:1;
}
.dialog-close:hover { background:var(--pink); color:var(--red); border-color:#f3c4c1; }
.brochure-viewer {
  min-height:0;
  overflow:auto;
  padding:20px;
  background:#eceef0;
  overscroll-behavior:contain;
}
.brochure-viewer img {
  width:min(100%,calc((100dvh - 262px) * .80028));
  aspect-ratio:1122 / 1402;
  max-width:100%;
  max-height:calc(100dvh - 262px);
  height:auto;
  margin:auto;
  box-shadow:0 6px 22px #0002;
}
.brochure-viewer.is-zoomed img {
  width:1122px;
  max-width:none;
  max-height:none;
  margin:0 auto;
}
.brochure-dialog-footer {
  display:flex;
  gap:12px;
  justify-content:space-between;
  padding:16px 26px;
  border-top:1px solid var(--line);
}
.brochure-dialog-footer .button { min-height:44px; font-size:.875rem; }
@media(min-width:1500px) {
  .hero-visual { height:610px; }
  .hero-grid { gap:64px; }
}
@media(max-width:1100px) {
  .option-grid { gap:18px; }
  .option-card { padding:27px; }
  .option-card h3 { font-size:1.55rem; }
  .option-top { gap:12px; }
  .option-top span { font-size:.65rem; }
}
@media(max-width:960px) {
  .hero h1 { font-size:clamp(2.55rem,10vw,4.9rem); }
  .hero .eyebrow { font-size:.7rem; }
  .story-grid { grid-template-columns:1fr; }
  .brochure-visual { max-width:460px; }
  .story-copy { max-width:none; }
  .hero-assurances { font-size:.83rem; gap:18px; }
  .options-ladder { width:130%; height:76%; opacity:.19; top:0; right:-22%; }
  .options-section .section-heading>p { max-width:560px; }
  .option-card { padding:29px; }
  .option-top span { font-size:.75rem; }
  .option-card h3 { font-size:1.7rem; }
  .option-card:hover,.option-card:focus-within { transform:none; }
  .experience>span { font-size:.75rem; }
  .footer-bottom { gap:13px 28px; }
}
@media(max-width:480px) {
  .hero h1 { font-size:clamp(2.4rem,10.3vw,3rem); letter-spacing:-.025em; }
  .photo-caption div>span { font-size:.78rem; }
  .hero-assurances { font-size:.76rem; gap:12px; }
  .spec-intro,.specification-strip>.spec-intro,.spec-note,.specification-strip small { font-size:.79rem; }
  .spec-note strong { font-size:.79rem!important; }
  .story-bottom { flex-wrap:wrap; }
  .story-bottom .text-link { font-size:.875rem; }
  .brochure-caption { font-size:.65rem; }
  .option-card h3 { font-size:1.65rem; }
  .check-list { font-size:.85rem; }
  .brochure-dialog { width:calc(100% - 20px); max-height:calc(100dvh - 28px); border-radius:10px; }
  .brochure-dialog-header { padding:16px; gap:12px; }
  .brochure-dialog h2 { font-size:1.1rem; }
  .brochure-viewer { padding:12px; }
  .brochure-viewer img { max-height:calc(100dvh - 230px); }
  .brochure-dialog-footer { padding:14px; gap:8px; }
  .brochure-dialog-footer .button { font-size:.8rem; padding:11px 13px; }
}
@media(prefers-reduced-motion:reduce) {
  .brand-intro { display:none; }
  .options-ladder { transform:none; }
  .option-card:hover,.option-card:focus-within { transform:none; }
}
@media print {
  .brand-intro,.options-backdrop,.brochure-dialog { display:none!important; }
}

/* Fitting, founder story and film. */
.process-section {
  position:relative;
  overflow:hidden;
  color:#fff;
  background:radial-gradient(ellipse at 95% 0%, #454545 0%, transparent 65%), linear-gradient(120deg,#191919 20%,#252525 100%);
}
.process-section .eyebrow { color:#ff9898; }
.process-section h2,.process-section h3 { color:#fff; }
.process-section .section-heading>p,.process-section .process-grid p { color:#d2d2d2; }
.process-section .process-grid li { border-color:#656565; }
.process-section .process-grid li:before { background:#ff6464; border-color:#252525; }
.process-section .process-grid li>span { color:#ff9898; font-size:.85rem; }
.process-section .process-grid h3 { font-size:1.5rem; }

.story-section { background:white; }
.story-section .story-grid { grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(48px,6vw,100px); }
.founder-visual { position:relative; isolation:isolate; margin:0; width:100%; max-width:640px; aspect-ratio:.88; border-radius:16px; overflow:hidden; background:#191919; box-shadow:0 22px 50px #19191914; }
.founder-portrait { position:absolute; inset:0; overflow:hidden; }
.founder-portrait img { position:absolute; width:181%; max-width:none; height:auto; left:-1%; top:-25%; }
.founder-visual:after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,#191919 0%,#191919 21%,#191919e8 29%,transparent 64%); z-index:1; }
.founder-tag { position:absolute; z-index:2; left:25px; top:25px; padding:10px 13px; color:white; background:#191919e6; border-left:3px solid var(--red); font-size:.65rem; font-weight:700; letter-spacing:.1em; }
.founder-visual figcaption { position:absolute; z-index:2; bottom:34px; left:34px; right:34px; color:white; }
.founder-role { display:block; font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; color:#ff9d9d; margin-bottom:11px; }
.founder-visual figcaption>strong { display:block; font-family:Montserrat,Arial,sans-serif; font-weight:800; font-size:clamp(2.3rem,3.9vw,4.2rem); letter-spacing:-.055em; line-height:1.02; }
.founder-visual figcaption>strong span { color:#f52c2c; }
.founder-company { display:block; font-size:.85rem; margin-top:17px; color:#ddd; }
.founder-corner { position:absolute; width:85px; height:9px; background:var(--red); right:0; bottom:0; z-index:2; }
.story-section .story-copy h2 { font-family:Montserrat,Arial,sans-serif; font-size:clamp(2.3rem,3.85vw,4.2rem); font-weight:800; letter-spacing:-.055em; line-height:1.1; margin:0 0 27px; }
.installer-line { position:relative; display:inline-block; }
.installer-line:after { content:''; position:absolute; bottom:0; left:0; right:0; height:.13em; background:#e4191920; }
.story-copy h2 .home-line { display:block; color:var(--red); font-size:.63em; letter-spacing:-.045em; margin-top:15px; line-height:1.2; }
.story-section .founder-introduction { font-size:1.12rem!important; color:#353535!important; line-height:1.65; }
.story-section .story-copy>p strong { font-weight:700; }
.story-section blockquote { font-size:1.3rem; }
.story-section .experience>span { font-size:.8rem; }
.watch-section { background:#f4f5f5; border-top:1px solid var(--line); }
.watch-introduction { max-width:500px; justify-self:end; }
.watch-introduction>p { color:var(--muted); font-size:1.05rem; line-height:1.8; }
.youtube-link { display:inline-flex; gap:11px; align-items:center; }
.youtube-link svg { width:27px; height:27px; flex-shrink:0; }
.video-frame { aspect-ratio:16/9; min-height:200px; border-radius:14px; overflow:hidden; background:#191919; box-shadow:0 18px 40px #19191914; }
.video-frame iframe { display:block; width:100%; height:100%; min-height:200px; border:0; }
.video-caption { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:19px 0; border-bottom:1px solid #d8dada; font-size:.8rem; color:#666; }
.video-caption>span { display:flex; gap:9px; align-items:center; font-size:.7rem; letter-spacing:.1em; }
.live-dot { width:7px; height:7px; background:var(--red); border-radius:50%; }
.video-caption a { color:var(--ink); text-underline-offset:4px; }
.gallery-invitation { display:flex; justify-content:space-between; gap:24px; align-items:center; padding-top:45px; }
.gallery-invitation h3 { font-size:2rem; letter-spacing:-.035em; margin:0 0 7px; }
.gallery-invitation .eyebrow { margin:0 0 12px; }
.gallery-invitation p:not(.eyebrow) { color:var(--muted); margin:0; }
.gallery-invitation .button { flex-shrink:0; gap:22px; }
.main-nav>a[aria-current=page] { color:var(--red); }

/* Gallery: all images remain available without JavaScript. */
.gallery-hero { padding:35px 0 64px; background:white; border-bottom:1px solid var(--line); }
.gallery-breadcrumb { display:inline-flex; gap:13px; color:var(--muted); font-size:.8rem; text-decoration:none; margin-bottom:45px; }
.gallery-breadcrumb>span:last-child { color:var(--ink); }
.gallery-heading { display:grid; grid-template-columns:1.45fr 1fr; align-items:end; gap:65px; }
.gallery-heading h1 { font-family:Montserrat,Arial,sans-serif; font-size:clamp(2.4rem,4.4vw,4.8rem); font-weight:800; letter-spacing:-.055em; line-height:1.1; margin:0; }
.gallery-heading h1 em { color:var(--red); font-style:normal; }
.gallery-intro { max-width:390px; justify-self:end; }
.gallery-intro>p { color:var(--muted); font-size:1.1rem; line-height:1.75; margin:0 0 22px; }
.gallery-sample-note { font-size:.75rem; color:#7b4d46; display:inline-block; background:#f8e9e5; padding:8px 13px; border-radius:4px; }
.gallery-collection { padding:0 0 55px; }
.gallery-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:35px 0; }
.gallery-filters { display:flex; gap:8px; flex-wrap:wrap; }
.gallery-filter { border:1px solid #dedfe1; border-radius:7px; background:white; color:var(--ink); font:inherit; font-size:.85rem; font-weight:600; min-height:46px; padding:10px 16px; cursor:pointer; transition:background .2s,border-color .2s; }
.gallery-filter span { font-size:.72rem; margin-left:10px; opacity:.65; }
.gallery-filter:hover { border-color:#9d9d9d; background:#f7f7f7; }
.gallery-filter[aria-pressed=true] { background:#191919; color:white; border-color:#191919; }
#gallery-count { font-size:.8rem; color:var(--muted); margin:0; white-space:nowrap; }
.gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:35px 25px; }
.gallery-card { margin:0; min-width:0; }
.gallery-image-link { display:block; position:relative; aspect-ratio:4/3; background:#eeece8; overflow:hidden; border-radius:9px; }
.gallery-image-link img { width:100%; height:100%; object-fit:cover; transition:transform .45s; }
.gallery-image-link:hover img { transform:scale(1.035); }
.gallery-placeholder-tag { position:absolute; top:15px; left:15px; font-size:.65rem; font-weight:600; background:#fffffff0; color:#505050; padding:6px 9px; border-radius:3px; }
.gallery-expand { position:absolute; right:16px; bottom:16px; width:39px; height:39px; display:grid; place-items:center; color:white; background:#191919; border-radius:50%; font-size:1.3rem; transition:background .2s; }
.gallery-image-link:hover .gallery-expand { background:var(--red); }
.gallery-card figcaption { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:17px 2px 0; }
.gallery-category { font-size:.66rem; letter-spacing:.11em; text-transform:uppercase; color:#9b2424; font-weight:700; }
.gallery-card h2 { font-size:1.05rem; letter-spacing:-.02em; margin:6px 0 0; }
.gallery-index { font-size:.85rem; color:#8c8c8c; }
.gallery-end { display:flex; flex-direction:column; align-items:center; gap:12px; padding:65px 0 20px; text-align:center; }
.gallery-end .q-mark { transform:scale(.7); margin-bottom:0; }
.gallery-end p { font-size:1.3rem; margin:0; font-weight:600; letter-spacing:-.025em; }
body.gallery-open { overflow:hidden; }
.gallery-dialog { border:0; border-radius:12px; width:min(1000px,calc(100% - 40px)); max-width:100%; max-height:calc(100dvh - 44px); padding:0; color:var(--ink); background:white; box-shadow:0 24px 90px #0005; }
.gallery-dialog[open] { display:flex; flex-direction:column; }
.gallery-dialog::backdrop { background:#101112db; backdrop-filter:blur(6px); }
.gallery-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 25px; flex-shrink:0; }
.gallery-dialog-header .eyebrow { font-size:.65rem; margin:0 0 5px; display:block; }
.gallery-dialog h2 { font-size:1.3rem; letter-spacing:-.025em; margin:0; }
.gallery-dialog-image { background:#f2f0ec; overflow:auto; min-height:0; display:flex; justify-content:center; }
.gallery-dialog-image img { display:block; width:100%; height:auto; max-height:calc(100dvh - 218px); object-fit:contain; }
.gallery-dialog-footer { display:flex; align-items:center; justify-content:center; gap:25px; padding:14px 20px; flex-shrink:0; }
.gallery-dialog-footer button { display:grid; place-items:center; width:44px; height:44px; border:1px solid #ddd; border-radius:50%; background:white; color:var(--ink); font-size:1.4rem; cursor:pointer; }
.gallery-dialog-footer button:hover { background:#f5f5f5; border-color:#888; }
#gallery-dialog-count { font-size:.8rem; color:var(--muted); text-align:center; min-width:130px; }
@media(min-width:1700px) { .gallery-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media(max-width:1150px) and (min-width:961px) {
  .main-nav { gap:17px; font-size:.8rem; }
  .story-section .story-grid { gap:42px; }
  .story-section .story-copy h2 { font-size:2.5rem; }
  .founder-visual figcaption { left:24px; right:24px; bottom:28px; }
  .gallery-filter { padding:10px 12px; }
}
@media(max-width:960px) {
  .story-section .story-grid { grid-template-columns:1fr; gap:42px; }
  .founder-visual { max-width:600px; justify-self:center; }
  .founder-visual figcaption>strong { font-size:clamp(2.8rem,7vw,4rem); }
  .story-section .story-copy h2 { font-size:clamp(2.4rem,7vw,4rem); }
  .watch-introduction { justify-self:start; }
  .gallery-heading { grid-template-columns:1fr; gap:25px; }
  .gallery-heading h1 { font-size:clamp(2.4rem,6.5vw,3.5rem); }
  .gallery-intro { max-width:560px; justify-self:start; }
  .gallery-hero { padding-bottom:40px; }
  .gallery-toolbar { flex-direction:column; align-items:flex-start; gap:16px; padding:27px 0; }
  .gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px 20px; }
}
@media(max-width:600px) {
  .gallery-invitation { flex-direction:column; align-items:flex-start; }
  .gallery-heading h1 { font-size:clamp(2.1rem,8.9vw,3rem); }
  .gallery-breadcrumb { margin-bottom:28px; }
  .gallery-grid { grid-template-columns:1fr; gap:30px; }
  .gallery-filter { padding:10px 12px; font-size:.8rem; }
  .gallery-filter span { margin-left:6px; }
  .gallery-intro>p { font-size:1rem; }
  .gallery-sample-note { font-size:.7rem; }
  .founder-tag { top:18px; left:18px; font-size:.56rem; }
  .founder-visual figcaption { left:24px; right:24px; bottom:26px; }
  .founder-visual figcaption>strong { font-size:clamp(2.5rem,9vw,3.4rem); }
  .founder-role { font-size:.65rem; margin-bottom:8px; }
  .founder-company { font-size:.72rem; margin-top:12px; }
  .story-section .story-copy h2 { font-size:clamp(2rem,8.8vw,3.2rem); }
  .story-section .founder-introduction { font-size:1.05rem!important; }
  .story-section blockquote { font-size:1.2rem; }
  .video-caption { font-size:.72rem; }
  .video-caption>span { font-size:.62rem; }
  .video-frame { border-radius:8px; }
  .gallery-dialog { width:calc(100% - 20px); max-height:calc(100dvh - 24px); }
  .gallery-dialog-header { padding:16px; }
  .gallery-dialog h2 { font-size:1.1rem; }
  .gallery-dialog-image img { max-height:calc(100dvh - 194px); }
}
@media print { .gallery-dialog,.video-frame { display:none!important; } .gallery-card[hidden] { display:block!important; } }
.video-frame { position:relative; width:100%; min-width:0; }
.video-fallback { width:100%; height:100%; min-height:200px; display:flex; align-items:center; padding:clamp(28px,6vw,100px); background:linear-gradient(90deg,#191919f5 15%,#191919a6 65%,#19191938),url('images/qman-pro-installed-loft-ladder.webp') center/cover; color:white; }
.video-fallback .eyebrow { color:#ffaaaa; }
.video-fallback h3 { font-family:Montserrat,Arial,sans-serif; font-size:clamp(2rem,4.5vw,4.5rem); font-weight:800; letter-spacing:-.05em; line-height:1.08; margin:0 0 22px; }
.video-fallback p { color:#ededed; margin-bottom:25px; }
.video-fallback .button { gap:13px; }
@media(max-width:600px) {
  .video-frame:has(.video-fallback:not([hidden])) { aspect-ratio:auto; min-height:330px; }
  .video-fallback { min-height:330px; }
  .video-fallback .eyebrow { font-size:.58rem; }
  .video-fallback p { font-size:.9rem; }
}

/* Allow space for the Contact page in the shared desktop navigation. */
@media (min-width:961px) { .main-nav { gap:clamp(12px,1.5vw,26px); } }
.main-nav>a[aria-current="page"]:not(.button) { color:var(--red); }