:root {
  --brand-navy: #0a2e5b;
  --brand-navy-900: #061f3f;
  --brand-navy-800: #08284f;
  --brand-blue: #0077e6;
  --brand-blue-100: #e8f3ff;
  --brand-green: #2ba463;
  --brand-green-700: #218450;
  --brand-green-100: #eaf7f0;
  --text-primary: #10243d;
  --text-secondary: #5e6f82;
  --text-soft: #7d8b9a;
  --surface: #ffffff;
  --surface-soft: #f4f7fa;
  --surface-blue: #eef6fd;
  --surface-warm: #f8f7f3;
  --border: #dce5ed;
  --border-strong: #c8d5e0;
  --success: #20834e;
  --danger: #b33636;
  --shadow-sm: 0 3px 16px rgba(7, 37, 70, 0.06);
  --shadow-md: 0 16px 38px rgba(7, 37, 70, 0.1);
  --shadow-lg: 0 28px 70px rgba(7, 37, 70, 0.16);
  --radius-sm: 9px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 26px;
  --container: 1380px;
  --gutter: clamp(18px, 3.6vw, 56px);
  --section-space: clamp(72px, 8.4vw, 120px);
  --font-display: "Montserrat", "Avenir Next", "Century Gothic", "Segoe UI", sans-serif;
  --transition: 220ms cubic-bezier(0.2, 0.75, 0.25, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; text-size-adjust: 100%; }
body { margin: 0; background: var(--surface); color: var(--text-primary); font-family: var(--font-display); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
body.is-locked { overflow: hidden; }
img { display: block; max-width: 100%; }
button, input, select, textarea { color: inherit; font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { border: 0; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { letter-spacing: -0.035em; line-height: 1.08; }
h1 { font-size: clamp(2.45rem, 5vw, 5.2rem); font-weight: 800; }
h2 { font-size: clamp(2rem, 3.2vw, 3.65rem); font-weight: 750; }
h3 { font-size: clamp(1.15rem, 1.4vw, 1.45rem); font-weight: 700; }
::selection { background: var(--brand-blue); color: white; }
:focus-visible { outline: 3px solid rgba(0, 119, 230, 0.42); outline-offset: 3px; }

.container { width: min(100%, var(--container)); margin-inline: auto; padding-inline: var(--gutter); }
.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; }
.skip-link { position: fixed; z-index: 9999; top: 12px; left: 12px; padding: 12px 18px; border-radius: var(--radius-sm); background: white; color: var(--brand-navy); box-shadow: var(--shadow-md); transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.section { padding-block: var(--section-space); }
.section--compact { padding-block: clamp(64px, 6.7vw, 96px); }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; margin-bottom: 18px; color: var(--brand-blue); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.16em; line-height: 1.2; text-transform: uppercase; }
.eyebrow--line::before { width: 42px; height: 2px; background: linear-gradient(90deg, var(--brand-green) 0 48%, var(--brand-blue) 48%); content: ""; }
.eyebrow-link { display: inline-flex; margin-bottom: 16px; color: var(--brand-blue); font-size: 0.75rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }

.button { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 12px 20px; border: 1px solid transparent; border-radius: var(--radius-sm); cursor: pointer; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.04em; line-height: 1.15; text-align: center; transition: transform var(--transition), box-shadow var(--transition), background var(--transition), color var(--transition), border-color var(--transition); }
.button:hover { transform: translateY(-2px); }
.button:disabled { cursor: not-allowed; opacity: 0.7; transform: none; }
.button--large { min-height: 54px; padding-inline: 26px; }
.button--full { width: 100%; }
.button--navy { background: var(--brand-navy); color: white; box-shadow: 0 9px 22px rgba(10, 46, 91, 0.18); }
.button--navy:hover { background: var(--brand-navy-900); box-shadow: 0 13px 30px rgba(10, 46, 91, 0.23); }
.button--green { background: var(--brand-green); color: white; box-shadow: 0 9px 22px rgba(43, 164, 99, 0.2); }
.button--green:hover { background: var(--brand-green-700); box-shadow: 0 13px 30px rgba(43, 164, 99, 0.25); }
.button--white { background: white; color: var(--brand-navy); }
.button--white:hover { background: #eff6fc; }
.button--outline { border-color: var(--border-strong); background: rgba(255, 255, 255, 0.72); color: var(--brand-navy); }
.button--outline:hover { border-color: var(--brand-blue); background: white; }
.button--ghost { background: transparent; color: var(--brand-navy); }
.text-link { display: inline-flex; align-items: center; gap: 8px; color: var(--brand-navy); font-size: 0.82rem; font-weight: 800; transition: color var(--transition), gap var(--transition); }
.text-link:hover { gap: 13px; color: var(--brand-blue); }
.text-link--light { color: white; }
.text-link--center { justify-content: center; }
.icon-button { width: 44px; height: 44px; display: inline-grid; place-items: center; border: 1px solid var(--border); border-radius: var(--radius-sm); background: white; color: var(--brand-navy); cursor: pointer; transition: background var(--transition), border-color var(--transition), color var(--transition); }
.icon-button:hover { border-color: var(--brand-blue); background: var(--surface-blue); color: var(--brand-blue); }

.topbar { height: 35px; background: var(--brand-navy-900); color: rgba(255, 255, 255, 0.82); font-size: 0.69rem; font-weight: 650; letter-spacing: 0.025em; }
.topbar__inner { height: 100%; display: flex; align-items: center; justify-content: space-between; }
.topbar span, .topbar a { display: inline-flex; align-items: center; gap: 7px; }
.topbar a:hover { color: white; }
.topbar__segments { color: rgba(255, 255, 255, 0.58); letter-spacing: 0.08em; text-transform: uppercase; }
.site-header { position: sticky; z-index: 150; top: 0; border-bottom: 1px solid rgba(220, 229, 237, 0.8); background: rgba(255, 255, 255, 0.96); box-shadow: 0 5px 22px rgba(6, 31, 63, 0.04); backdrop-filter: blur(12px); }
.site-header__inner { min-height: 82px; display: flex; align-items: center; gap: clamp(20px, 2vw, 36px); }
.brand { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 11px; }
.brand img { width: 54px; height: 54px; border-radius: 50%; object-fit: cover; }
.brand__wordmark { display: grid; line-height: 1; }
.brand__wordmark strong { color: var(--brand-navy); font-size: 1.08rem; font-weight: 850; letter-spacing: -0.045em; }
.brand__wordmark strong span { color: var(--brand-blue); }
.brand__wordmark small { margin-top: 5px; color: var(--brand-navy); font-size: 0.55rem; font-weight: 700; letter-spacing: 0.29em; }
.brand--inverted .brand__wordmark strong, .brand--inverted .brand__wordmark small { color: white; }
.brand--inverted .brand__wordmark strong span { color: #4eabff; }
.desktop-nav { min-width: 0; flex: 1 1 auto; display: flex; align-items: center; justify-content: center; gap: clamp(12px, 1.5vw, 24px); }
.desktop-nav a { position: relative; padding-block: 30px; color: #31475f; font-size: 0.72rem; font-weight: 700; white-space: nowrap; }
.desktop-nav a::after { position: absolute; right: 0; bottom: 19px; left: 0; height: 2px; background: var(--brand-green); content: ""; transform: scaleX(0); transform-origin: left; transition: transform var(--transition); }
.desktop-nav a:hover, .desktop-nav a.is-active { color: var(--brand-navy); }
.desktop-nav a:hover::after, .desktop-nav a.is-active::after { transform: scaleX(1); }
.header-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
.quote-button { min-height: 44px; display: inline-flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: white; color: var(--brand-navy); cursor: pointer; font-size: 0.7rem; font-weight: 750; }
.quote-button b { min-width: 22px; height: 22px; display: inline-grid; place-items: center; border-radius: 50%; background: var(--brand-blue); color: white; font-size: 0.65rem; }
.header-cta { min-height: 44px; padding-inline: 15px; font-size: 0.67rem; }
.mobile-menu-button { display: none; }

.overlay { position: fixed; z-index: 500; inset: 0; }
.overlay__backdrop { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; background: rgba(4, 24, 49, 0.64); cursor: pointer; }
.search-panel { position: relative; max-height: min(760px, 88vh); overflow-y: auto; background: white; box-shadow: var(--shadow-lg); animation: panel-down 260ms ease both; }
.search-panel__inner { padding-top: 28px; padding-bottom: 36px; }
.search-panel__top, .search-panel__heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.search-panel__label { color: var(--brand-navy); font-size: 0.74rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.search-field { margin-top: 22px; display: flex; align-items: center; gap: 16px; padding: 14px 0 17px; border-bottom: 2px solid var(--brand-navy); }
.search-field input { min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; color: var(--text-primary); font-size: clamp(1.35rem, 2.4vw, 2.2rem); font-weight: 650; }
.search-field input::placeholder { color: #a0aab5; }
.search-panel__content { margin-top: 30px; }
.search-panel__heading h2 { margin-bottom: 0; font-size: 1rem; letter-spacing: -0.01em; }
.search-panel__heading span { color: var(--text-secondary); font-size: 0.78rem; }
.live-results { margin-top: 16px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.live-results a { min-width: 0; display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 10px; border: 1px solid var(--border); border-radius: var(--radius-md); transition: border-color var(--transition), background var(--transition); }
.live-results a:hover { border-color: #8cbdea; background: var(--surface-blue); }
.live-results img { width: 72px; height: 72px; border-radius: 10px; object-fit: cover; }
.live-results span { min-width: 0; display: grid; }
.live-results small { color: var(--brand-blue); font-size: 0.62rem; font-style: normal; font-weight: 800; text-transform: uppercase; }
.live-results strong { overflow: hidden; font-size: 0.86rem; text-overflow: ellipsis; white-space: nowrap; }
.live-results em { color: var(--text-secondary); font-size: 0.68rem; font-style: normal; }
.search-all { margin-top: 18px; display: inline-flex; align-items: center; gap: 8px; color: var(--brand-blue); font-size: 0.78rem; font-weight: 800; }
.search-empty { margin-top: 20px; padding: 34px; border: 1px solid var(--border); background: var(--surface-soft); text-align: center; }
.search-empty h2 { margin-bottom: 10px; font-size: 1.45rem; }
.search-empty p { color: var(--text-secondary); }
.mobile-menu__panel, .quote-drawer__panel, .filter-drawer > aside { position: absolute; z-index: 1; top: 0; right: 0; width: min(92vw, 470px); height: 100%; overflow-y: auto; background: white; box-shadow: var(--shadow-lg); animation: panel-right 260ms ease both; }
.mobile-menu__panel { padding: 22px; }
.mobile-menu__header, .quote-drawer__header, .filter-drawer__header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.mobile-menu nav { margin-top: 28px; border-top: 1px solid var(--border); }
.mobile-menu nav a { min-height: 52px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--border); color: var(--brand-navy); font-size: 0.88rem; font-weight: 700; }
.mobile-menu__categories { margin-block: 26px; }
.mobile-menu__categories > span { color: var(--text-soft); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.mobile-menu__categories div { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px; }
.mobile-menu__categories a { padding: 8px 12px; border: 1px solid var(--border); border-radius: 999px; color: var(--text-secondary); font-size: 0.72rem; font-weight: 700; }
.quote-drawer__panel { display: flex; flex-direction: column; }
.quote-drawer__header { flex: 0 0 auto; padding: 26px; border-bottom: 1px solid var(--border); }
.quote-drawer__header .eyebrow { margin-bottom: 7px; }
.quote-drawer__header h2 { margin-bottom: 0; font-size: 1.65rem; }
.quote-drawer__body { flex: 1 1 auto; padding: 24px; overflow-y: auto; }
.quote-drawer__count { margin-bottom: 16px; color: var(--text-secondary); font-size: 0.75rem; font-weight: 700; }
.quote-mini-list { display: grid; gap: 13px; }
.quote-mini-list article { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; align-items: start; gap: 13px; padding-bottom: 13px; border-bottom: 1px solid var(--border); }
.quote-mini-list img { width: 76px; height: 76px; border-radius: 10px; object-fit: cover; }
.quote-mini-list article > div { min-width: 0; display: grid; gap: 3px; }
.quote-mini-list article > div > a { font-size: 0.8rem; font-weight: 750; line-height: 1.3; }
.quote-mini-list article > div > span { color: var(--text-secondary); font-size: 0.65rem; }
.quote-mini-list article > button { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 8px; background: transparent; color: var(--text-soft); cursor: pointer; }
.quote-mini-list .quantity { margin-top: 7px; }
.quote-drawer__footer { flex: 0 0 auto; display: grid; gap: 8px; padding: 20px 24px 24px; border-top: 1px solid var(--border); background: white; }
.drawer-empty { min-height: 60vh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.drawer-empty > span { width: 70px; height: 70px; display: grid; place-items: center; margin-bottom: 22px; border-radius: 50%; background: var(--surface-blue); color: var(--brand-blue); }
.drawer-empty h3 { margin-bottom: 10px; }
.drawer-empty p { max-width: 300px; color: var(--text-secondary); font-size: 0.86rem; }
.toast { position: fixed; z-index: 800; right: 28px; bottom: 28px; max-width: min(420px, calc(100vw - 36px)); display: flex; align-items: center; gap: 10px; padding: 13px 17px; border-radius: var(--radius-sm); background: var(--brand-navy-900); color: white; box-shadow: var(--shadow-lg); font-size: 0.78rem; font-weight: 700; opacity: 0; pointer-events: none; transform: translateY(12px); transition: opacity var(--transition), transform var(--transition); }
.toast.is-visible { opacity: 1; transform: translateY(0); }

.home-hero { position: relative; overflow: hidden; padding-top: clamp(50px, 6vw, 88px); background: linear-gradient(90deg, rgba(10, 46, 91, 0.035) 1px, transparent 1px) 0 0 / 92px 92px, linear-gradient(180deg, #f8fbfd 0%, #f1f6fa 100%); }
.home-hero::before { position: absolute; width: 680px; height: 680px; border: 80px solid rgba(0, 119, 230, 0.045); border-radius: 50%; top: -340px; right: -180px; content: ""; }
.home-hero__inner { position: relative; min-height: 610px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: center; gap: 22px; }
.home-hero__copy { position: relative; z-index: 2; grid-column: 1 / span 7; padding-bottom: 72px; }
.home-hero__copy h1 { max-width: 820px; margin-bottom: 25px; color: var(--brand-navy-900); font-size: clamp(2.65rem, 5.1vw, 5.35rem); }
.home-hero__copy > p { max-width: 690px; margin-bottom: 30px; color: var(--text-secondary); font-size: clamp(1rem, 1.25vw, 1.16rem); line-height: 1.75; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 11px; }
.home-hero__visual { position: absolute; z-index: 1; top: 0; right: max(var(--gutter), calc((100vw - var(--container)) / 2 + var(--gutter))); bottom: 52px; width: min(48vw, 705px); }
.home-hero__image-frame { position: absolute; inset: 24px 0 38px 0; overflow: hidden; border-radius: 24px 4px 88px 24px; background: #eef3f7; box-shadow: 0 35px 72px rgba(9, 41, 78, 0.2); clip-path: polygon(13% 0, 100% 0, 100% 100%, 0 100%, 0 19%); }
.home-hero__image-frame::after { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(244, 248, 251, 0.7), transparent 30%); content: ""; }
.home-hero__image-frame img { width: 100%; height: 100%; object-fit: cover; object-position: 68% center; }
.hero-segments { position: absolute; z-index: 3; right: -12px; bottom: 18px; display: flex; align-items: center; gap: 2px; padding: 8px; border-radius: 14px 0 14px 14px; background: var(--brand-navy-900); box-shadow: var(--shadow-md); }
.hero-segments span { display: flex; align-items: center; gap: 6px; padding: 9px 12px; border-right: 1px solid rgba(255, 255, 255, 0.14); color: white; font-size: 0.64rem; font-weight: 750; }
.hero-segments span:last-child { border-right: 0; }
.hero-orbit { position: absolute; z-index: 2; display: block; border-radius: 50%; pointer-events: none; }
.hero-orbit--blue { width: 88px; height: 88px; top: 0; left: -34px; border: 13px solid var(--brand-blue); border-right-color: transparent; transform: rotate(-25deg); }
.hero-orbit--green { width: 46px; height: 46px; right: 40px; bottom: 6px; border: 8px solid var(--brand-green); border-left-color: transparent; }
.hero-benefits { position: relative; z-index: 3; display: grid; grid-template-columns: repeat(4, 1fr); padding-top: 0; padding-bottom: 0; background: var(--brand-navy); color: white; }
.hero-benefits::before, .hero-benefits::after { position: absolute; top: 0; bottom: 0; width: max(0px, calc((100vw - var(--container)) / 2)); background: var(--brand-navy); content: ""; }
.hero-benefits::before { right: 100%; }
.hero-benefits::after { left: 100%; }
.hero-benefits span { min-height: 67px; display: flex; align-items: center; justify-content: center; gap: 10px; border-right: 1px solid rgba(255, 255, 255, 0.14); font-size: 0.73rem; font-weight: 700; }
.hero-benefits span:last-child { border-right: 0; }

.section-heading { max-width: 790px; margin-bottom: clamp(38px, 5vw, 64px); }
.section-heading h2 { margin-bottom: 17px; color: var(--brand-navy-900); }
.section-heading p { max-width: 690px; margin-bottom: 0; color: var(--text-secondary); }
.section-heading--row { max-width: none; display: flex; align-items: end; justify-content: space-between; gap: 28px; }
.section-heading--row > div { max-width: 790px; }
.section-heading--center { margin-inline: auto; text-align: center; }
.section-heading--center p { margin-inline: auto; }
.section--audiences { background: white; }
.audience-editorial { display: grid; grid-template-columns: 1.12fr 0.88fr; grid-template-rows: repeat(2, minmax(230px, auto)); gap: 16px; }
.audience-panel { position: relative; overflow: hidden; display: flex; align-items: flex-end; gap: 22px; padding: clamp(28px, 4vw, 52px); border-radius: var(--radius-lg); transition: transform var(--transition), box-shadow var(--transition); }
.audience-panel:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.audience-panel::after { position: absolute; border-radius: 50%; content: ""; }
.audience-panel--home { grid-row: 1 / span 2; min-height: 480px; background: linear-gradient(150deg, #edf7f2 0%, #d9f0e4 100%); color: var(--brand-navy-900); }
.audience-panel--home::after { width: 420px; height: 420px; top: -210px; right: -155px; border: 62px solid rgba(43, 164, 99, 0.12); }
.audience-panel--business { background: var(--brand-navy); color: white; }
.audience-panel--business::after { width: 180px; height: 180px; top: -88px; right: -60px; border: 28px solid rgba(0, 119, 230, 0.25); }
.audience-panel--condo { border: 1px solid var(--border); background: white; color: var(--brand-navy-900); }
.audience-panel--condo::after { width: 120px; height: 120px; right: 30px; bottom: -75px; border: 22px solid rgba(0, 119, 230, 0.09); }
.audience-panel__icon { position: relative; z-index: 1; flex: 0 0 auto; width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 14px; }
.audience-panel > div { position: relative; z-index: 1; max-width: 520px; }
.audience-panel .eyebrow { margin-bottom: 10px; color: currentColor; opacity: 0.72; }
.audience-panel h3 { margin-bottom: 13px; font-size: clamp(1.65rem, 3vw, 3rem); }
.audience-panel p { margin-bottom: 20px; color: currentColor; font-size: 0.9rem; opacity: 0.78; }
.audience-panel em { display: inline-flex; align-items: center; gap: 9px; font-size: 0.76rem; font-style: normal; font-weight: 800; }

.section--categories { border-top: 1px solid var(--border); background: var(--surface-soft); }
.category-mosaic { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: 250px; gap: 14px; }
.category-tile { position: relative; overflow: hidden; display: flex; align-items: flex-end; padding: clamp(22px, 3vw, 36px); border: 1px solid var(--border); border-radius: var(--radius-md); background: white; transition: border-color var(--transition), transform var(--transition), box-shadow var(--transition); }
.category-tile:hover { border-color: #8bbbe7; box-shadow: var(--shadow-md); transform: translateY(-3px); }
.category-tile--1 { grid-column: span 7; grid-row: span 2; background: #e9f4fd; }
.category-tile--2 { grid-column: span 5; background: #eef8f3; }
.category-tile--3 { grid-column: span 5; background: white; }
.category-tile--4, .category-tile--5, .category-tile--6 { grid-column: span 4; }
.category-tile__number { position: absolute; top: 20px; left: 22px; z-index: 2; color: var(--brand-blue); font-size: 0.68rem; font-weight: 850; letter-spacing: 0.12em; }
.category-tile__copy { position: relative; z-index: 2; width: min(64%, 430px); }
.category-tile h3 { margin-bottom: 10px; color: var(--brand-navy-900); font-size: clamp(1.4rem, 2.5vw, 2.45rem); }
.category-tile p { margin-bottom: 17px; color: var(--text-secondary); font-size: 0.78rem; line-height: 1.65; }
.category-tile em { display: inline-flex; align-items: center; gap: 8px; color: var(--brand-navy); font-size: 0.72rem; font-style: normal; font-weight: 800; }
.category-tile img { position: absolute; right: -3%; bottom: -6%; width: 47%; height: 82%; object-fit: cover; object-position: center; mix-blend-mode: multiply; transition: transform 320ms ease; }
.category-tile:hover img { transform: scale(1.035); }

.section--products-home { background: white; }
.product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(14px, 1.5vw, 22px); }
.product-card { min-width: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius-md); background: white; transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition); }
.product-card:hover { border-color: #a7c8e5; box-shadow: var(--shadow-md); transform: translateY(-4px); }
.product-card__image { position: relative; aspect-ratio: 1 / 0.94; overflow: hidden; background: #f6f7f5; }
.product-card__image::after { position: absolute; right: 0; bottom: 0; width: 38%; height: 4px; background: linear-gradient(90deg, var(--brand-green), var(--brand-blue)); content: ""; }
.product-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform 320ms ease; }
.product-card:hover .product-card__image img { transform: scale(1.025); }
.product-card__added { position: absolute; top: 12px; left: 12px; display: inline-flex; align-items: center; gap: 5px; padding: 7px 9px; border-radius: 7px; background: var(--brand-green); color: white; font-size: 0.6rem; font-weight: 800; box-shadow: var(--shadow-sm); }
.product-card__body { flex: 1; display: flex; flex-direction: column; padding: clamp(18px, 2vw, 24px); }
.product-card__category { align-self: flex-start; margin-bottom: 10px; color: var(--brand-blue); font-size: 0.61rem; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase; }
.product-card h3 { margin-bottom: 9px; font-size: clamp(1rem, 1.25vw, 1.24rem); letter-spacing: -0.02em; }
.product-card h3 a:hover { color: var(--brand-blue); }
.product-card__presentation { margin-bottom: 10px; color: var(--text-secondary); font-size: 0.68rem; font-weight: 650; }
.product-card__description { flex: 1; margin-bottom: 19px; color: var(--text-secondary); font-size: 0.73rem; line-height: 1.6; }
.product-card__actions { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 7px; }
.button--quote-card { min-width: 0; padding-inline: 9px; background: var(--brand-navy); color: white; font-size: 0.61rem; }
.button--quote-card.is-added { background: var(--brand-green-700); }
.product-card__link { display: inline-flex; align-items: center; gap: 7px; margin-top: 15px; color: var(--brand-navy); font-size: 0.67rem; font-weight: 800; }
.quantity { width: max-content; height: 47px; display: grid; grid-template-columns: 40px 46px 40px; overflow: hidden; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: white; }
.quantity button { display: grid; place-items: center; background: transparent; color: var(--brand-navy); cursor: pointer; }
.quantity button:hover { background: var(--surface-blue); }
.quantity input { min-width: 0; width: 100%; border: 0; border-right: 1px solid var(--border); border-left: 1px solid var(--border); outline: 0; background: white; text-align: center; -moz-appearance: textfield; }
.quantity input::-webkit-outer-spin-button, .quantity input::-webkit-inner-spin-button { margin: 0; -webkit-appearance: none; }
.quantity--compact { height: 42px; grid-template-columns: 34px 36px 34px; }
.empty-state { grid-column: 1 / -1; min-height: 360px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 48px 24px; border: 1px solid var(--border); background: var(--surface-soft); text-align: center; }
.empty-state__mark { width: 70px; height: 70px; display: grid; place-items: center; margin-bottom: 22px; border-radius: 50%; background: var(--brand-blue-100); color: var(--brand-blue); }
.empty-state h2 { margin-bottom: 12px; font-size: 1.65rem; }
.empty-state p { max-width: 530px; margin-bottom: 24px; color: var(--text-secondary); }

@keyframes panel-down { from { opacity: 0; transform: translateY(-25px); } to { opacity: 1; transform: translateY(0); } }
@keyframes panel-right { from { transform: translateX(35px); opacity: 0; } to { transform: translateX(0); opacity: 1; } }

.b2b-home { position: relative; overflow: hidden; padding-block: clamp(76px, 8vw, 112px); background: var(--brand-navy-900); color: white; }
.b2b-home::after { position: absolute; width: 540px; height: 540px; right: -310px; bottom: -310px; border: 64px solid rgba(0, 119, 230, 0.14); border-radius: 50%; content: ""; }
.b2b-home__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 0.95fr; align-items: center; gap: clamp(46px, 7vw, 108px); }
.b2b-home__copy .eyebrow { color: #63b6ff; }
.b2b-home__copy h2 { max-width: 730px; margin-bottom: 22px; color: white; }
.b2b-home__copy p { max-width: 680px; margin-bottom: 28px; color: rgba(255, 255, 255, 0.7); }
.b2b-home__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; }
.supply-diagram { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.supply-diagram > div { position: relative; min-height: 142px; display: flex; flex-direction: column; justify-content: flex-end; padding: 24px; border: 1px solid rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.055); }
.supply-diagram > div:nth-child(2), .supply-diagram > div:nth-child(3) { background: rgba(0, 119, 230, 0.11); }
.supply-diagram > div > span { width: 42px; height: 42px; display: grid; place-items: center; margin-bottom: 22px; border: 1px solid rgba(255, 255, 255, 0.32); border-radius: 10px; color: #78c5ff; }
.supply-diagram strong { font-size: 0.9rem; }
.supply-diagram__arrow { position: absolute; right: 15px; bottom: 18px; color: rgba(255, 255, 255, 0.28); }

.section--benefits { background: var(--surface-warm); }
.benefits-editorial { display: grid; grid-template-columns: 1.15fr repeat(2, 0.75fr); gap: 1px; background: var(--border); }
.benefits-editorial__intro { grid-row: span 2; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(34px, 5vw, 66px); background: var(--brand-navy); color: white; }
.benefits-editorial__intro .eyebrow { color: #63b6ff; }
.benefits-editorial__intro h2 { margin-bottom: 0; color: white; }
.benefits-editorial article { min-height: 230px; padding: clamp(28px, 3.2vw, 46px); background: white; }
.benefits-editorial article > span { color: var(--brand-green); font-size: 0.68rem; font-weight: 850; letter-spacing: 0.13em; }
.benefits-editorial article h3 { margin: 34px 0 12px; color: var(--brand-navy-900); }
.benefits-editorial article p { margin-bottom: 0; color: var(--text-secondary); font-size: 0.81rem; }

.process-home { background: white; }
.process-timeline { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; }
.process-timeline::before { position: absolute; top: 27px; right: 10%; left: 10%; height: 1px; background: var(--border-strong); content: ""; }
.process-timeline li { position: relative; padding-inline: clamp(10px, 2vw, 24px); text-align: center; }
.process-timeline li > span { position: relative; z-index: 1; width: 56px; height: 56px; display: inline-grid; place-items: center; margin-bottom: 25px; border: 1px solid var(--border-strong); border-radius: 50%; background: white; color: var(--brand-blue); font-size: 0.67rem; font-weight: 850; letter-spacing: 0.08em; }
.process-timeline li:nth-child(3) > span { border-color: var(--brand-green); background: var(--brand-green); color: white; box-shadow: 0 9px 22px rgba(43, 164, 99, 0.2); }
.process-timeline h3 { margin-bottom: 9px; font-size: 1rem; }
.process-timeline p { margin-bottom: 0; color: var(--text-secondary); font-size: 0.72rem; line-height: 1.55; }
.process-timeline--compact li > span { border-color: #afc5d9; }
.process-home__action { margin-top: 48px; text-align: center; }

.special-product { padding-block: clamp(48px, 5vw, 72px); border-block: 1px solid var(--border); background: var(--surface-blue); }
.special-product__inner { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: clamp(24px, 4vw, 54px); }
.special-product__mark { width: 72px; height: 72px; display: grid; place-items: center; border: 1px solid #9cc8ee; border-radius: 18px; background: white; color: var(--brand-blue); }
.special-product .eyebrow { margin-bottom: 9px; }
.special-product h2 { margin-bottom: 12px; font-size: clamp(1.75rem, 2.6vw, 2.75rem); }
.special-product p { max-width: 760px; margin-bottom: 0; color: var(--text-secondary); }
.special-product__actions { display: grid; gap: 14px; justify-items: start; }

.closing-cta { position: relative; overflow: hidden; padding-block: clamp(70px, 7vw, 105px); }
.closing-cta::after { position: absolute; width: 440px; height: 440px; right: -170px; bottom: -320px; border: 54px solid rgba(255, 255, 255, 0.12); border-radius: 50%; content: ""; }
.closing-cta--navy { background: var(--brand-navy); color: white; }
.closing-cta--green { background: #1f8750; color: white; }
.closing-cta--light { border-top: 1px solid var(--border); background: var(--surface-soft); color: var(--brand-navy-900); }
.closing-cta--light::after { border-color: rgba(0, 119, 230, 0.08); }
.closing-cta__inner { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 44px; }
.closing-cta__inner > div { max-width: 820px; }
.closing-cta .eyebrow { color: inherit; opacity: 0.66; }
.closing-cta h2 { margin-bottom: 16px; color: inherit; }
.closing-cta p { max-width: 680px; margin-bottom: 0; color: inherit; opacity: 0.72; }
.closing-cta .button { flex: 0 0 auto; }

.breadcrumbs { min-height: 49px; display: flex; align-items: center; gap: 8px; color: var(--text-secondary); font-size: 0.68rem; }
.breadcrumbs span { display: inline-flex; align-items: center; gap: 8px; }
.breadcrumbs a:hover { color: var(--brand-blue); }
.breadcrumbs em { overflow: hidden; max-width: 330px; color: var(--brand-navy); font-style: normal; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }

.catalog-hero { position: relative; overflow: hidden; padding-block: clamp(52px, 6.2vw, 86px); background: var(--brand-navy); color: white; }
.catalog-hero::after { position: absolute; right: -95px; bottom: -160px; width: 330px; height: 330px; border: 48px solid rgba(0, 119, 230, 0.25); border-radius: 50%; content: ""; }
.catalog-hero__inner { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 50px; }
.catalog-hero__inner > div:first-child { max-width: 880px; }
.catalog-hero .eyebrow { color: #72c1ff; }
.catalog-hero h1 { margin-bottom: 20px; color: white; font-size: clamp(2.4rem, 4.4vw, 4.5rem); }
.catalog-hero p { max-width: 650px; margin-bottom: 0; color: rgba(255, 255, 255, 0.7); }
.catalog-hero__mark { flex: 0 0 auto; width: 100px; height: 100px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 22px; background: rgba(255, 255, 255, 0.07); color: #75c1ff; }
.catalog-section { padding-block: clamp(42px, 5vw, 78px) var(--section-space); }
.category-chips { display: flex; gap: 8px; margin-bottom: 22px; overflow-x: auto; scrollbar-width: none; }
.category-chips::-webkit-scrollbar { display: none; }
.category-chips button { min-height: 40px; flex: 0 0 auto; padding: 9px 16px; border: 1px solid var(--border); border-radius: 999px; background: white; color: var(--text-secondary); cursor: pointer; font-size: 0.7rem; font-weight: 750; }
.category-chips button.is-active { border-color: var(--brand-navy); background: var(--brand-navy); color: white; }
.catalog-toolbar { display: grid; grid-template-columns: minmax(260px, 1fr) auto; align-items: center; gap: 12px; margin-bottom: 34px; padding: 13px; border: 1px solid var(--border); background: var(--surface-soft); }
.catalog-search { min-height: 47px; display: flex; align-items: center; gap: 10px; padding: 0 14px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: white; color: var(--text-secondary); }
.catalog-search input { min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; font-size: 0.8rem; }
.catalog-order { display: flex; align-items: center; gap: 9px; color: var(--text-secondary); font-size: 0.7rem; font-weight: 700; }
.catalog-order select, .select-field select { min-height: 47px; padding: 0 36px 0 13px; border: 1px solid var(--border); border-radius: var(--radius-sm); outline: 0; background: white; font-size: 0.75rem; }
.mobile-filter-button { display: none; }
.catalog-layout { display: grid; grid-template-columns: 248px minmax(0, 1fr); align-items: start; gap: clamp(26px, 3.5vw, 50px); }
.catalog-sidebar { position: sticky; top: 106px; border-top: 3px solid var(--brand-navy); }
.catalog-sidebar__heading { display: flex; align-items: center; justify-content: space-between; padding: 18px 0; border-bottom: 1px solid var(--border); font-size: 0.8rem; }
.catalog-sidebar__heading button { background: transparent; color: var(--brand-blue); cursor: pointer; font-size: 0.65rem; font-weight: 750; }
.filter-fields { display: grid; gap: 0; }
.filter-fields fieldset { display: grid; gap: 10px; margin: 0; padding: 20px 0; border: 0; border-bottom: 1px solid var(--border); }
.filter-fields legend, .select-field > span { margin-bottom: 10px; color: var(--brand-navy); font-size: 0.72rem; font-weight: 800; }
.filter-fields label { display: flex; align-items: center; gap: 9px; color: var(--text-secondary); font-size: 0.71rem; cursor: pointer; }
.filter-fields input { accent-color: var(--brand-blue); }
.filter-fields small { color: var(--text-soft); font-size: 0.62rem; line-height: 1.5; }
.select-field { display: grid !important; gap: 0 !important; padding: 20px 0; border-bottom: 1px solid var(--border); }
.select-field select { width: 100%; }
.catalog-results { min-width: 0; }
.catalog-results__meta { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; color: var(--text-secondary); font-size: 0.7rem; }
.catalog-results__meta strong { color: var(--brand-navy); }
.catalog-results .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.filter-drawer > aside { padding: 24px; }
.filter-drawer__header { padding-bottom: 18px; border-bottom: 1px solid var(--border); }
.filter-drawer__header .eyebrow { margin-bottom: 5px; }
.filter-drawer__header h2 { margin-bottom: 0; font-size: 1.6rem; }
.filter-drawer .filter-fields { margin-bottom: 24px; }

.product-page-section { padding-top: clamp(36px, 4vw, 62px); }
.product-detail { display: grid; grid-template-columns: minmax(0, 1.03fr) minmax(380px, 0.82fr); align-items: start; gap: clamp(40px, 7vw, 100px); }
.product-gallery { min-width: 0; }
.product-gallery__main { aspect-ratio: 1; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius-lg); background: #f6f7f5; }
.product-gallery__main img { width: 100%; height: 100%; object-fit: cover; }
.product-gallery__thumbs { display: flex; gap: 10px; margin-top: 12px; overflow-x: auto; }
.product-gallery__thumbs button { width: 84px; height: 84px; flex: 0 0 auto; padding: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 10px; background: white; cursor: pointer; }
.product-gallery__thumbs button.is-active { border: 2px solid var(--brand-blue); }
.product-gallery__thumbs img { width: 100%; height: 100%; object-fit: cover; }
.product-summary { position: sticky; top: 120px; }
.product-summary h1 { margin-bottom: 18px; color: var(--brand-navy-900); font-size: clamp(2.4rem, 4.3vw, 4.4rem); }
.product-summary__lead { margin-bottom: 26px; color: var(--text-secondary); font-size: 1rem; line-height: 1.7; }
.product-meta { margin: 0 0 27px; border-top: 1px solid var(--border); }
.product-meta > div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 20px; padding-block: 12px; border-bottom: 1px solid var(--border); }
.product-meta dt { color: var(--text-soft); font-size: 0.67rem; font-weight: 700; }
.product-meta dd { margin: 0; color: var(--brand-navy); font-size: 0.71rem; font-weight: 750; text-align: right; }
.product-summary__quote { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: end; gap: 11px; }
.field-label { display: block; margin-bottom: 7px; color: var(--brand-navy); font-size: 0.68rem; font-weight: 800; }
.inline-success { display: flex; align-items: center; gap: 7px; margin: 13px 0 0; color: var(--success); font-size: 0.72rem; font-weight: 750; }
.whatsapp-inline { min-height: 47px; display: flex; align-items: center; justify-content: center; gap: 9px; margin-top: 12px; border: 1px solid #a8dac0; border-radius: var(--radius-sm); color: var(--brand-green-700); font-size: 0.7rem; font-weight: 800; }
.whatsapp-inline:hover { background: var(--brand-green-100); }
.product-help { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 13px; margin-top: 22px; padding: 17px; border-left: 3px solid var(--brand-blue); background: var(--surface-blue); color: var(--brand-navy); }
.product-help p { display: grid; margin-bottom: 0; font-size: 0.72rem; }
.product-help strong { font-size: 0.75rem; }
.product-tabs { margin-top: clamp(65px, 7vw, 95px); border-block: 1px solid var(--border); }
.product-tabs__nav { display: flex; gap: 0; border-bottom: 1px solid var(--border); }
.product-tabs__nav button { min-height: 57px; padding: 0 24px; border-right: 1px solid var(--border); background: transparent; color: var(--text-secondary); cursor: pointer; font-size: 0.71rem; font-weight: 750; }
.product-tabs__nav button.is-active { box-shadow: inset 0 -3px var(--brand-blue); color: var(--brand-navy); }
.product-tabs__panel { max-width: 880px; min-height: 150px; padding: 34px 0; color: var(--text-secondary); }
.product-tabs__panel p { margin-bottom: 0; }
.product-tabs__panel dl { margin: 0; }
.product-tabs__panel dl > div { display: grid; grid-template-columns: 170px 1fr; padding: 9px 0; border-bottom: 1px solid var(--border); }
.product-tabs__panel dt { font-weight: 750; }
.product-tabs__panel dd { margin: 0; }
.section--related { margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); background: var(--surface-soft); }

.audience-hero { position: relative; overflow: hidden; padding-block: clamp(70px, 8vw, 118px); }
.audience-hero::after { position: absolute; width: 580px; height: 580px; right: -260px; top: -300px; border: 72px solid rgba(255, 255, 255, 0.11); border-radius: 50%; content: ""; }
.audience-hero--home { background: linear-gradient(135deg, #edf8f2, #dff2e8); color: var(--brand-navy-900); }
.audience-hero--home::after { border-color: rgba(43, 164, 99, 0.1); }
.audience-hero--business { background: var(--brand-navy-900); color: white; }
.audience-hero--condo { background: var(--brand-navy); color: white; }
.audience-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(270px, 0.55fr); align-items: center; gap: clamp(46px, 8vw, 120px); }
.audience-hero__grid > div:first-child { max-width: 890px; }
.audience-hero:not(.audience-hero--home) .eyebrow { color: #72c1ff; }
.audience-hero h1 { margin-bottom: 24px; color: inherit; font-size: clamp(2.55rem, 5vw, 5.2rem); }
.audience-hero p { max-width: 760px; margin-bottom: 30px; color: inherit; font-size: clamp(1rem, 1.2vw, 1.14rem); opacity: 0.74; }
.audience-hero__index { min-height: 315px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid currentColor; border-radius: 0 54px 0 54px; background: rgba(255, 255, 255, 0.045); opacity: 0.88; }
.audience-hero__index > span { width: 88px; height: 88px; display: grid; place-items: center; margin-bottom: 26px; border: 1px solid currentColor; border-radius: 22px; }
.audience-hero__index strong { font-size: clamp(1.2rem, 2vw, 1.75rem); letter-spacing: 0.12em; }
.audience-hero__index small { margin-top: 8px; font-size: 0.6rem; font-weight: 700; letter-spacing: 0.23em; opacity: 0.66; }
.audience-needs { background: white; }
.audience-needs__grid { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: clamp(48px, 8vw, 120px); }
.audience-needs__grid h2 { margin-bottom: 22px; }
.audience-needs__grid p { color: var(--text-secondary); }
.audience-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 0; padding: 1px; background: var(--border); list-style: none; }
.audience-list li { min-height: 72px; display: flex; align-items: center; gap: 11px; padding: 18px 22px; background: white; color: var(--brand-navy); font-size: 0.8rem; font-weight: 700; }
.audience-list svg { color: var(--brand-green); }
.business-offer { background: var(--surface-soft); }
.business-offer__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-block: 1px solid var(--border); }
.business-offer__grid article { min-height: 210px; padding: 28px; border-right: 1px solid var(--border); background: white; }
.business-offer__grid article:last-child { border-right: 0; }
.business-offer__grid span { color: var(--brand-blue); font-size: 0.65rem; font-weight: 850; }
.business-offer__grid h3 { margin: 70px 0 0; font-size: 1rem; }
.recurrence-section { padding-block: clamp(62px, 7vw, 94px); background: var(--brand-green-700); color: white; }
.recurrence-section__grid { display: grid; grid-template-columns: auto 0.8fr 1fr; align-items: center; gap: clamp(30px, 5vw, 70px); }
.recurrence-section__icon { width: 82px; height: 82px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, 0.34); border-radius: 20px; }
.recurrence-section .eyebrow { color: white; opacity: 0.72; }
.recurrence-section h2 { margin-bottom: 15px; color: white; font-size: clamp(2rem, 3vw, 3.2rem); }
.recurrence-section p { margin-bottom: 0; color: rgba(255, 255, 255, 0.75); }
.recurrence-flow { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.recurrence-flow span { padding: 10px 13px; border: 1px solid rgba(255, 255, 255, 0.24); font-size: 0.67rem; font-weight: 800; }
.recurrence-flow svg { color: rgba(255, 255, 255, 0.55); }
.supply-process { background: white; }
.audience-products { background: var(--surface-soft); }

.about-hero { padding-block: clamp(78px, 9vw, 130px); background: var(--brand-navy-900); color: white; }
.about-hero__grid { display: grid; grid-template-columns: 0.95fr 1.05fr; gap: clamp(50px, 8vw, 120px); }
.about-hero .eyebrow { color: #72c1ff; }
.about-hero h1 { margin-bottom: 0; color: white; }
.about-hero p { max-width: 690px; color: rgba(255, 255, 255, 0.72); font-size: 1rem; line-height: 1.8; }
.about-purpose { background: white; }
.about-purpose__grid { display: grid; grid-template-columns: 0.85fr 1.15fr; align-items: center; gap: clamp(50px, 8vw, 120px); }
.about-purpose__signature { position: relative; display: grid; place-items: center; overflow: hidden; aspect-ratio: 1; border-radius: 50% 50% 8% 50%; background: var(--brand-navy); }
.about-purpose__signature img { width: 77%; height: 77%; border-radius: 50%; object-fit: cover; }
.about-purpose__signature span { position: absolute; right: 22px; bottom: 21px; padding: 9px 13px; border-radius: 8px; background: white; color: var(--brand-navy); font-size: 0.64rem; font-weight: 800; box-shadow: var(--shadow-sm); }
.about-purpose h2 { margin-bottom: 22px; }
.about-purpose p { margin-bottom: 24px; color: var(--text-secondary); }
.about-values { background: var(--surface-soft); }
.about-values__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--border); }
.about-values__grid article { min-height: 260px; padding: clamp(28px, 3.3vw, 46px); background: white; }
.about-values__grid article:nth-child(2) { background: var(--surface-blue); }
.about-values__grid article:nth-child(3) { background: var(--brand-navy); color: white; }
.about-values__grid span { color: var(--brand-green); font-size: 0.68rem; font-weight: 850; letter-spacing: 0.12em; }
.about-values__grid h3 { margin: 80px 0 15px; }
.about-values__grid p { margin-bottom: 0; color: inherit; font-size: 0.79rem; opacity: 0.72; }
.vision-section { padding-block: clamp(78px, 8vw, 118px); border-block: 1px solid var(--border); background: white; }
.vision-section__grid { display: grid; grid-template-columns: 0.35fr 0.65fr 1fr; align-items: start; gap: 44px; }
.vision-section h2 { margin-bottom: 0; font-size: clamp(2rem, 3vw, 3.2rem); }
.vision-section p { margin-bottom: 0; color: var(--text-secondary); font-size: 1rem; line-height: 1.8; }

.page-intro { padding-block: clamp(64px, 7vw, 102px); }
.page-intro .container { max-width: 1050px; margin-inline: auto; text-align: center; }
.page-intro h1 { margin-bottom: 20px; }
.page-intro p { max-width: 730px; margin: 0 auto; color: var(--text-secondary); font-size: 1.03rem; }
.page-intro--how { background: var(--surface-blue); }
.how-main { background: white; }
.how-explainer { padding-block: clamp(62px, 7vw, 92px); background: var(--brand-navy); color: white; }
.how-explainer__grid { display: grid; grid-template-columns: 0.72fr 1.28fr; align-items: center; gap: 60px; }
.how-explainer .eyebrow { color: #72c1ff; }
.how-explainer h2 { margin-bottom: 15px; color: white; }
.how-explainer p { margin-bottom: 0; color: rgba(255, 255, 255, 0.7); }
.how-explainer__sequence { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.how-explainer__sequence span { padding: 11px 14px; border: 1px solid rgba(255, 255, 255, 0.21); font-size: 0.67rem; font-weight: 800; }
.how-explainer__sequence svg { color: rgba(255, 255, 255, 0.4); }

.page-intro--quote { background: var(--surface-soft); }
.quote-page { min-height: 500px; }
.empty-state--quote { min-height: 430px; }
.quote-page__grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.6fr); align-items: start; gap: clamp(30px, 5vw, 70px); }
.quote-list { border-top: 3px solid var(--brand-navy); }
.quote-list__heading { min-height: 62px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--border); font-size: 0.8rem; }
.quote-list__heading button { background: transparent; color: var(--danger); cursor: pointer; font-size: 0.67rem; font-weight: 750; }
.quote-list article { display: grid; grid-template-columns: 116px minmax(0, 1fr) auto auto; align-items: center; gap: 20px; padding-block: 18px; border-bottom: 1px solid var(--border); }
.quote-list__image { width: 116px; height: 116px; overflow: hidden; border-radius: 12px; background: #f6f7f5; }
.quote-list__image img { width: 100%; height: 100%; object-fit: cover; }
.quote-list__copy { display: grid; gap: 5px; }
.quote-list__copy > a { font-size: 0.95rem; font-weight: 750; }
.quote-list__copy > a:hover { color: var(--brand-blue); }
.quote-list__copy span, .quote-list__copy small { color: var(--text-secondary); font-size: 0.68rem; }
.quote-list__remove { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 8px; background: transparent; color: var(--text-soft); cursor: pointer; }
.quote-list__remove:hover { background: #fff0f0; color: var(--danger); }
.quote-summary { position: sticky; top: 120px; padding: clamp(28px, 3vw, 42px); border-top: 4px solid var(--brand-green); background: var(--surface-soft); }
.quote-summary h2 { margin-bottom: 16px; font-size: clamp(1.55rem, 2.3vw, 2.25rem); }
.quote-summary p { margin-bottom: 25px; color: var(--text-secondary); font-size: 0.8rem; }
.quote-summary .text-link { margin-top: 17px; }

.request-page, .contact-page { padding-block: clamp(70px, 8vw, 112px); background: var(--surface-soft); }
.request-page__grid, .contact-page__grid { display: grid; grid-template-columns: minmax(320px, 0.78fr) minmax(480px, 1.22fr); align-items: start; gap: clamp(40px, 7vw, 96px); }
.request-page__intro, .contact-page__info { position: sticky; top: 120px; }
.request-page__intro h1, .contact-page__info h1 { margin-bottom: 23px; }
.request-page__intro > p, .contact-page__info > p { max-width: 570px; margin-bottom: 30px; color: var(--text-secondary); font-size: 1rem; }
.request-trust { display: grid; gap: 10px; }
.request-trust span { display: flex; align-items: center; gap: 9px; color: var(--brand-navy); font-size: 0.75rem; font-weight: 750; }
.request-trust svg { color: var(--brand-green); }
.request-form { display: grid; gap: 21px; padding: clamp(28px, 4vw, 52px); border-top: 4px solid var(--brand-blue); background: white; box-shadow: var(--shadow-sm); }
.request-form__heading { padding-bottom: 22px; border-bottom: 1px solid var(--border); }
.request-form__heading h2 { margin-bottom: 7px; font-size: clamp(1.6rem, 2.4vw, 2.35rem); }
.request-form__heading p { margin-bottom: 0; color: var(--text-secondary); font-size: 0.72rem; }
.field-grid { display: grid; gap: 17px; }
.field-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.field { min-width: 0; display: grid; gap: 7px; }
.field > span { color: var(--brand-navy); font-size: 0.69rem; font-weight: 750; }
.field input, .field textarea, .field select { width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); outline: 0; background: white; font-size: 0.78rem; transition: border-color var(--transition), box-shadow var(--transition); }
.field textarea { resize: vertical; }
.field input:focus, .field textarea:focus, .field select:focus { border-color: var(--brand-blue); box-shadow: 0 0 0 3px rgba(0, 119, 230, 0.1); }
.selected-products-field { display: grid; gap: 8px; }
.selected-products-field__empty { display: flex; align-items: center; justify-content: space-between; padding: 14px; border: 1px dashed var(--border-strong); background: var(--surface-soft); }
.selected-products-field__empty p { margin-bottom: 0; color: var(--text-secondary); font-size: 0.72rem; }
.selected-products-field__empty a { color: var(--brand-blue); font-size: 0.7rem; font-weight: 800; }
.selected-products-field__list { max-height: 285px; overflow-y: auto; border: 1px solid var(--border); }
.selected-products-field__list > div { display: grid; grid-template-columns: 54px 1fr; align-items: center; gap: 11px; padding: 8px; border-bottom: 1px solid var(--border); }
.selected-products-field__list img { width: 54px; height: 54px; border-radius: 8px; object-fit: cover; }
.selected-products-field__list span { display: grid; }
.selected-products-field__list strong { font-size: 0.72rem; }
.selected-products-field__list small { color: var(--text-secondary); font-size: 0.63rem; }
.selected-products-field__total { display: block; padding: 12px; color: var(--brand-navy); font-size: 0.7rem; text-align: right; }
.checkbox-field { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: 10px; cursor: pointer; }
.checkbox-field input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--brand-green); }
.checkbox-field span { display: grid; }
.checkbox-field strong { font-size: 0.74rem; }
.checkbox-field small { color: var(--text-secondary); font-size: 0.65rem; }
.form-note { margin: -9px 0 0; color: var(--text-soft); font-size: 0.61rem; text-align: center; }
.form-message { display: none; padding: 11px 13px; border: 1px solid #eababa; background: #fff3f3; color: var(--danger); font-size: 0.7rem; }
.form-message.is-visible { display: block; }
.spinner { width: 17px; height: 17px; border: 2px solid rgba(255, 255, 255, 0.35); border-top-color: white; border-radius: 50%; animation: spin 0.8s linear infinite; }
.form-success { min-height: 560px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 50px; border-top: 4px solid var(--brand-green); background: white; text-align: center; box-shadow: var(--shadow-sm); }
.form-success > span { width: 76px; height: 76px; display: grid; place-items: center; margin-bottom: 24px; border-radius: 50%; background: var(--brand-green-100); color: var(--brand-green); }
.form-success h2 { margin-bottom: 14px; }
.form-success p { max-width: 530px; color: var(--text-secondary); }
.form-success > div { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 22px; margin-top: 14px; }

.contact-details { display: grid; gap: 1px; background: var(--border); }
.contact-details > a, .contact-details > div { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 15px; padding: 16px; background: white; }
.contact-details > a:hover { background: var(--surface-blue); }
.contact-details > a > span, .contact-details > div > span { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 10px; color: var(--brand-blue); }
.contact-details div div, .contact-details a div { display: grid; }
.contact-details small { color: var(--text-soft); font-size: 0.62rem; font-weight: 700; }
.contact-details strong { font-size: 0.76rem; }

.not-found { min-height: 690px; display: grid; place-items: center; padding-block: 80px; background: var(--surface-soft); }
.not-found__inner { text-align: center; }
.not-found__code { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 15px; }
.not-found__code span { color: var(--brand-navy); font-size: clamp(6rem, 13vw, 10rem); font-weight: 850; line-height: 0.9; }
.not-found__code img { width: clamp(110px, 14vw, 180px); height: clamp(110px, 14vw, 180px); border-radius: 50%; object-fit: cover; }
.not-found h1 { margin-bottom: 16px; font-size: clamp(2.2rem, 4vw, 4rem); }
.not-found p { margin-bottom: 28px; color: var(--text-secondary); }
.not-found__inner > div:last-child { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }

.site-footer { position: relative; padding-top: 76px; background: var(--brand-navy-900); color: white; }
.site-footer__accent { position: absolute; top: 0; right: 0; left: 0; height: 5px; background: linear-gradient(90deg, var(--brand-green) 0 32%, var(--brand-blue) 32% 67%, #59b8ff 67%); }
.site-footer__grid { display: grid; grid-template-columns: 1.45fr repeat(3, 0.65fr); gap: clamp(35px, 6vw, 90px); padding-bottom: 62px; }
.site-footer__brand { max-width: 390px; }
.site-footer__brand .brand { margin-bottom: 22px; }
.site-footer__brand p { color: rgba(255, 255, 255, 0.62); font-size: 0.8rem; }
.site-footer__brand > span { display: flex; align-items: center; gap: 8px; color: rgba(255, 255, 255, 0.74); font-size: 0.71rem; }
.site-footer__grid > div:not(:first-child) { display: flex; flex-direction: column; gap: 10px; }
.site-footer h2 { margin-bottom: 10px; color: white; font-size: 0.71rem; letter-spacing: 0.12em; text-transform: uppercase; }
.site-footer__grid > div:not(:first-child) a { color: rgba(255, 255, 255, 0.63); font-size: 0.72rem; }
.site-footer__grid > div:not(:first-child) a:hover { color: white; }
.site-footer__bottom { min-height: 65px; display: flex; align-items: center; justify-content: space-between; gap: 30px; border-top: 1px solid rgba(255, 255, 255, 0.12); color: rgba(255, 255, 255, 0.45); font-size: 0.62rem; }
.whatsapp-float { position: fixed; z-index: 220; right: 25px; bottom: 24px; display: flex; align-items: center; gap: 10px; }
.whatsapp-float > span { padding: 9px 12px; border-radius: 8px; background: var(--brand-navy-900); color: white; box-shadow: var(--shadow-md); font-size: 0.65rem; font-weight: 750; opacity: 0; transform: translateX(8px); transition: opacity var(--transition), transform var(--transition); }
.whatsapp-float > svg { width: 54px; height: 54px; padding: 13px; border-radius: 50%; background: var(--brand-green); color: white; box-shadow: 0 12px 30px rgba(31, 135, 80, 0.33); }
.whatsapp-float:hover > span { opacity: 1; transform: translateX(0); }
.mobile-bottom-nav { display: none; }

@keyframes spin { to { transform: rotate(360deg); } }

@media (min-width: 1600px) {
  .home-hero__inner { min-height: 665px; }
  .home-hero__visual { width: 720px; }
  .product-grid { gap: 24px; }
}

@media (max-width: 1280px) {
  .desktop-nav { gap: 13px; }
  .desktop-nav a { font-size: 0.66rem; }
  .header-cta { display: none; }
  .home-hero__copy { grid-column: 1 / span 7; }
  .home-hero__copy h1 { font-size: clamp(2.7rem, 5.3vw, 4.8rem); }
  .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .catalog-results .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .business-offer__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .business-offer__grid article:nth-child(3) { border-right: 0; }
  .business-offer__grid article:nth-child(n + 4) { border-top: 1px solid var(--border); }
}

@media (max-width: 1120px) {
  .desktop-nav { display: none; }
  .mobile-menu-button { display: inline-grid; }
  .header-cta { display: inline-flex; }
  .home-hero__copy { grid-column: 1 / span 7; }
  .home-hero__visual { width: 50vw; }
  .benefits-editorial { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .benefits-editorial__intro { grid-column: 1 / -1; grid-row: auto; min-height: 330px; }
  .about-values__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .about-values__grid article:nth-child(2) { border-bottom: 1px solid var(--border); }
  .recurrence-section__grid { grid-template-columns: auto 1fr; }
  .recurrence-flow { grid-column: 1 / -1; }
}

@media (max-width: 960px) {
  .topbar { display: none; }
  .site-header__inner { min-height: 74px; }
  .home-hero { padding-top: 58px; }
  .home-hero__inner { min-height: 0; display: flex; flex-direction: column; align-items: stretch; }
  .home-hero__copy { width: min(100%, 770px); padding-bottom: 24px; }
  .home-hero__copy h1 { font-size: clamp(2.65rem, 7.5vw, 4.4rem); }
  .home-hero__visual { position: relative; top: auto; right: auto; bottom: auto; width: 100%; height: min(56vw, 500px); margin-top: 6px; }
  .home-hero__image-frame { inset: 12px 0 36px; border-radius: 22px 4px 62px 22px; }
  .hero-orbit--blue { left: 7px; }
  .hero-segments { right: 0; }
  .audience-editorial { grid-template-columns: 1fr; grid-template-rows: auto; }
  .audience-panel--home { grid-row: auto; min-height: 320px; }
  .audience-panel--business, .audience-panel--condo { min-height: 245px; }
  .category-mosaic { grid-auto-rows: 230px; }
  .category-tile--1 { grid-column: span 12; grid-row: span 2; }
  .category-tile--2, .category-tile--3 { grid-column: span 6; }
  .category-tile--4, .category-tile--5, .category-tile--6 { grid-column: span 4; }
  .b2b-home__grid { grid-template-columns: 1fr; }
  .supply-diagram { max-width: 720px; }
  .process-timeline { grid-template-columns: 1fr; gap: 0; }
  .process-timeline::before { top: 27px; bottom: 27px; left: 27px; width: 1px; height: auto; }
  .process-timeline li { display: grid; grid-template-columns: 56px 1fr; align-items: start; gap: 20px; padding: 0 0 25px; text-align: left; }
  .process-timeline li > span { margin-bottom: 0; }
  .process-timeline h3 { margin-top: 5px; }
  .special-product__inner { grid-template-columns: auto 1fr; }
  .special-product__actions { grid-column: 2; }
  .catalog-layout { grid-template-columns: 1fr; }
  .catalog-sidebar { display: none; }
  .mobile-filter-button { display: inline-flex; }
  .catalog-toolbar { grid-template-columns: minmax(0, 1fr) auto auto; }
  .catalog-results .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .product-detail { grid-template-columns: 1fr; }
  .product-gallery { max-width: 760px; }
  .product-summary { position: static; }
  .product-summary h1 { font-size: clamp(2.5rem, 7vw, 4.4rem); }
  .audience-hero__grid { grid-template-columns: 1fr; }
  .audience-hero__index { max-width: 440px; min-height: 230px; }
  .audience-needs__grid, .about-hero__grid, .about-purpose__grid { grid-template-columns: 1fr; }
  .about-purpose__signature { width: min(100%, 590px); }
  .vision-section__grid { grid-template-columns: 0.3fr 0.7fr; }
  .vision-section__grid p { grid-column: 2; }
  .how-explainer__grid { grid-template-columns: 1fr; }
  .quote-page__grid { grid-template-columns: 1fr; }
  .quote-summary { position: static; }
  .request-page__grid, .contact-page__grid { grid-template-columns: 1fr; }
  .request-page__intro, .contact-page__info { position: static; }
  .request-page__intro > p, .contact-page__info > p { max-width: 720px; }
  .site-footer__grid { grid-template-columns: 1.2fr repeat(3, 0.7fr); gap: 32px; }
}

@media (max-width: 780px) {
  :root { --gutter: clamp(16px, 4.8vw, 30px); --section-space: clamp(64px, 13vw, 92px); }
  body { padding-bottom: 70px; }
  .site-header__inner { min-height: 68px; gap: 10px; }
  .brand img { width: 46px; height: 46px; }
  .brand__wordmark strong { font-size: 0.98rem; }
  .brand__wordmark small { font-size: 0.48rem; }
  .header-actions { margin-left: auto; }
  .header-cta { display: none; }
  .quote-button span { display: none; }
  .quote-button { min-width: 44px; justify-content: center; padding: 7px; }
  .quote-button b { position: absolute; top: 8px; right: 51px; min-width: 17px; height: 17px; font-size: 0.55rem; }
  .home-hero { padding-top: 44px; }
  .home-hero__copy h1 { font-size: clamp(2.25rem, 10.5vw, 3.65rem); }
  .home-hero__copy > p { font-size: 0.94rem; line-height: 1.65; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-actions .button { width: 100%; }
  .home-hero__visual { height: min(74vw, 440px); }
  .home-hero__image-frame { clip-path: polygon(9% 0, 100% 0, 100% 100%, 0 100%, 0 14%); }
  .hero-segments { right: 10px; left: 10px; justify-content: center; }
  .hero-segments span { padding-inline: 8px; font-size: 0.59rem; }
  .hero-orbit { display: none; }
  .hero-benefits { grid-template-columns: repeat(2, 1fr); }
  .hero-benefits span { min-height: 58px; padding-inline: 8px; border-bottom: 1px solid rgba(255, 255, 255, 0.14); font-size: 0.65rem; }
  .hero-benefits span:nth-child(2) { border-right: 0; }
  .section-heading--row { display: grid; align-items: start; }
  .section-heading--row .button { justify-self: start; }
  .audience-panel { min-height: 250px; align-items: flex-end; padding: 28px; }
  .audience-panel--home { min-height: 300px; }
  .audience-panel__icon { width: 47px; height: 47px; }
  .audience-panel h3 { font-size: 2rem; }
  .category-mosaic { display: grid; grid-template-columns: 1fr; grid-auto-rows: 260px; }
  .category-tile--1, .category-tile--2, .category-tile--3, .category-tile--4, .category-tile--5, .category-tile--6 { grid-column: auto; grid-row: auto; }
  .category-tile__copy { width: 64%; }
  .category-tile img { width: 49%; }
  .product-grid, .catalog-results .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-card__actions { grid-template-columns: 1fr; }
  .product-card__actions .quantity { width: 100%; grid-template-columns: 1fr 42px 1fr; }
  .button--quote-card { min-height: 44px; }
  .product-card__description { display: none; }
  .b2b-home__actions { align-items: stretch; flex-direction: column; }
  .b2b-home__actions .button { width: 100%; }
  .benefits-editorial { grid-template-columns: 1fr; }
  .benefits-editorial__intro { min-height: 300px; }
  .benefits-editorial article { min-height: 190px; }
  .special-product__inner { grid-template-columns: 1fr; }
  .special-product__mark { width: 60px; height: 60px; }
  .special-product__actions { grid-column: auto; }
  .special-product__actions .button { width: 100%; }
  .closing-cta__inner { flex-direction: column; align-items: flex-start; }
  .closing-cta .button { width: 100%; }
  .breadcrumbs { min-height: 44px; overflow-x: auto; white-space: nowrap; }
  .breadcrumbs em { max-width: 190px; }
  .catalog-hero__mark { display: none; }
  .catalog-toolbar { grid-template-columns: minmax(0, 1fr) auto; padding: 9px; }
  .catalog-order { grid-column: 1 / -1; justify-content: space-between; }
  .catalog-order select { min-width: 180px; }
  .catalog-results__meta span { display: none; }
  .filter-drawer > aside, .quote-drawer__panel { top: auto; bottom: 0; width: 100%; height: min(88vh, 760px); border-radius: 20px 20px 0 0; animation: panel-up 260ms ease both; }
  .product-summary__quote { grid-template-columns: 1fr; }
  .product-summary__quote .quantity { width: 100%; grid-template-columns: 1fr 50px 1fr; }
  .product-tabs__nav { overflow-x: auto; }
  .product-tabs__nav button { flex: 0 0 auto; padding-inline: 17px; }
  .product-tabs__panel { font-size: 0.87rem; }
  .audience-hero__index { display: none; }
  .audience-list { grid-template-columns: 1fr; }
  .business-offer__grid { grid-template-columns: 1fr; }
  .business-offer__grid article { min-height: 150px; border-right: 0; border-bottom: 1px solid var(--border); }
  .business-offer__grid h3 { margin-top: 38px; }
  .recurrence-section__grid { grid-template-columns: 1fr; }
  .recurrence-flow { grid-column: auto; }
  .recurrence-flow svg { transform: rotate(90deg); }
  .about-values__grid { grid-template-columns: 1fr; }
  .about-values__grid article { min-height: 210px; }
  .about-values__grid h3 { margin-top: 52px; }
  .vision-section__grid { grid-template-columns: 1fr; gap: 22px; }
  .vision-section__grid p { grid-column: auto; }
  .quote-list article { grid-template-columns: 88px minmax(0, 1fr) auto; gap: 13px; }
  .quote-list__image { width: 88px; height: 88px; }
  .quote-list article > .quantity { grid-column: 2; }
  .quote-list__remove { grid-column: 3; grid-row: 1; }
  .field-grid--2 { grid-template-columns: 1fr; }
  .request-form { padding: 26px 20px; }
  .site-footer { padding-top: 62px; }
  .site-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-footer__brand { grid-column: 1 / -1; max-width: 560px; }
  .site-footer__bottom { align-items: flex-start; flex-direction: column; justify-content: center; padding-block: 18px; }
  .whatsapp-float { right: 15px; bottom: 82px; }
  .whatsapp-float > span { display: none; }
  .whatsapp-float > svg { width: 50px; height: 50px; }
  .toast { right: 18px; bottom: 88px; }
  .mobile-bottom-nav { position: fixed; z-index: 210; right: 0; bottom: 0; left: 0; min-height: 69px; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--border); background: rgba(255, 255, 255, 0.97); box-shadow: 0 -8px 28px rgba(6, 31, 63, 0.09); backdrop-filter: blur(10px); }
  .mobile-bottom-nav a, .mobile-bottom-nav button { position: relative; min-width: 0; min-height: 69px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; background: transparent; color: var(--text-secondary); cursor: pointer; font-size: 0.58rem; font-weight: 750; }
  .mobile-bottom-nav a:hover, .mobile-bottom-nav button:hover { color: var(--brand-blue); }
  .mobile-bottom-nav__icon { position: relative; display: inline-flex; }
  .mobile-bottom-nav__icon b { position: absolute; top: -7px; right: -10px; min-width: 16px; height: 16px; display: grid; place-items: center; border-radius: 50%; background: var(--brand-blue); color: white; font-size: 0.5rem; }
  .form-success { min-height: 470px; padding: 34px 22px; }
}

@media (max-width: 600px) {
  .brand__wordmark { display: none; }
  .home-hero__visual { height: 330px; }
  .home-hero__image-frame img { object-position: 69% center; }
  .audience-panel { flex-direction: column; align-items: flex-start; justify-content: flex-end; gap: 16px; }
  .category-tile { min-height: 250px; }
  .category-tile__copy { width: 68%; }
  .category-tile p { display: none; }
  .product-grid, .catalog-results .product-grid { grid-template-columns: 1fr; }
  .product-card__image { aspect-ratio: 1 / 0.72; }
  .product-card__description { display: block; }
  .product-card__actions { grid-template-columns: auto 1fr; }
  .product-card__actions .quantity { width: max-content; grid-template-columns: 34px 36px 34px; }
  .supply-diagram { grid-template-columns: 1fr; }
  .supply-diagram > div { min-height: 120px; }
  .live-results { grid-template-columns: 1fr; }
  .search-panel__heading { align-items: flex-start; flex-direction: column; gap: 3px; }
  .catalog-hero h1 { font-size: 2.35rem; }
  .catalog-search { grid-column: 1 / -1; }
  .catalog-toolbar { grid-template-columns: 1fr 1fr; }
  .mobile-filter-button { width: 100%; }
  .catalog-order { grid-column: auto; display: grid; gap: 4px; }
  .catalog-order select { min-width: 0; width: 100%; }
  .product-meta > div { grid-template-columns: 96px 1fr; }
  .product-tabs__panel dl > div { grid-template-columns: 120px 1fr; }
  .about-purpose__signature { border-radius: 24px 24px 70px 24px; }
  .how-explainer__sequence { align-items: stretch; flex-direction: column; }
  .how-explainer__sequence svg { align-self: center; transform: rotate(90deg); }
  .quote-list__copy small { display: none; }
  .contact-details strong { font-size: 0.7rem; overflow-wrap: anywhere; }
  .not-found__code { gap: 3px; }
  .not-found__code span { font-size: 5.3rem; }
  .site-footer__grid { grid-template-columns: 1fr 1fr; gap: 36px 22px; }
}

@media (max-width: 390px) {
  :root { --gutter: 15px; }
  .site-header__inner { gap: 6px; }
  .brand img { width: 43px; height: 43px; }
  .header-actions { gap: 5px; }
  .header-actions .icon-button, .quote-button { width: 42px; min-width: 42px; height: 42px; }
  .quote-button b { right: 48px; }
  .home-hero__copy h1 { font-size: 2.18rem; }
  .home-hero__visual { height: 290px; }
  .hero-segments span { gap: 4px; padding-inline: 5px; font-size: 0.53rem; }
  .hero-segments svg { width: 15px; }
  .hero-benefits span { font-size: 0.59rem; }
  .audience-panel { min-height: 280px; }
  .category-tile__copy { width: 72%; }
  .product-card__actions { grid-template-columns: 1fr; }
  .product-card__actions .quantity { width: 100%; grid-template-columns: 1fr 42px 1fr; }
  .special-product__actions .text-link { font-size: 0.73rem; }
  .product-summary h1 { font-size: 2.2rem; }
  .quote-list article { grid-template-columns: 75px 1fr auto; }
  .quote-list__image { width: 75px; height: 75px; }
  .quote-list article > .quantity { width: 100%; grid-template-columns: 1fr 40px 1fr; }
  .not-found__code img { width: 90px; height: 90px; }
  .site-footer__grid { grid-template-columns: 1fr; }
  .site-footer__brand { grid-column: auto; }
}

@media (max-width: 330px) {
  .header-actions > .icon-button:first-child { display: none; }
  .home-hero__copy h1 { font-size: 2rem; }
  .home-hero__visual { height: 255px; }
  .hero-segments span { font-size: 0.49rem; }
  .hero-benefits { grid-template-columns: 1fr; }
  .hero-benefits span { border-right: 0; }
  .category-tile { padding: 20px; }
  .category-tile__copy { width: 75%; }
  .mobile-bottom-nav a, .mobile-bottom-nav button { font-size: 0.54rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}

@keyframes panel-up { from { transform: translateY(40px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }