:root {
    --bg: oklch(0.982 0.012 96);
    --surface: oklch(0.968 0.018 105);
    --surface-strong: oklch(0.915 0.028 106);
    --card: oklch(0.993 0.004 95);
    --ink: oklch(0.255 0.03 158);
    --muted: oklch(0.52 0.024 154);
    --line: oklch(0.89 0.017 105);
    --primary: oklch(0.57 0.136 160);
    --primary-strong: oklch(0.49 0.132 160);
    --accent: oklch(0.71 0.159 54);
    --accent-strong: oklch(0.64 0.165 48);
    --white: oklch(1 0 0);
    --bg-rgb: 248, 246, 239;
    --surface-rgb: 240, 241, 229;
    --surface-strong-rgb: 221, 226, 203;
    --ink-rgb: 31, 48, 39;
    --primary-rgb: 27, 139, 104;
    --shadow-soft: 0 18px 40px rgba(31, 48, 39, 0.06);
    --shadow-lift: 0 24px 56px rgba(31, 48, 39, 0.1);
    --radius-lg: 1rem;
    --radius-md: 0.75rem;
    --radius-sm: 0.5rem;
    --container: 1200px;
    --ease: cubic-bezier(0.22, 1, 0.36, 1);
    --hero-shell-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 440 360' preserveAspectRatio='none'%3E%3Cpath fill='%23fff' d='M120 20C192 10 282 12 360 24C403 31 430 51 437 86C442 110 438 134 432 153C425 177 430 193 438 215C445 236 444 268 433 297C418 336 384 356 326 360H170C111 360 67 348 36 320C10 296 0 260 0 219C0 190 8 164 25 145C43 125 59 109 60 88C61 64 50 46 59 31C68 20 91 17 120 20Z'/%3E%3C/svg%3E");
    --hero-image-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%205868.80859375%205429.5107421875'%20preserveAspectRatio%3D'none'%3E%3Cpath%20fill%3D'%23fff'%20transform%3D'translate(-6979.169921875%20-2856.25)'%20d%3D'M11701%208260%20c292%20-48%20513%20-153%20697%20-334%2087%20-85%20115%20-121%20181%20-232%20159%20-267%20206%20-487%20204%20-949%20-1%20-234%20-8%20-362%20-50%20-917%20-11%20-149%20-17%20-347%20-17%20-593%20-1%20-395%204%20-465%2064%20-960%2066%20-541%2079%20-746%2060%20-906%20-38%20-322%20-157%20-456%20-445%20-500%20-113%20-17%20-409%20-17%20-535%200%20-148%2020%20-321%2056%20-630%20131%20-518%20125%20-645%20144%20-970%20143%20-186%200%20-300%20-7%20-550%20-31%20-589%20-58%20-821%20-64%20-1124%20-26%20-294%2036%20-656%20146%20-866%20261%20-347%20192%20-617%20603%20-715%201088%20-56%20278%20-26%20450%20140%20804%20153%20326%20192%20450%20204%20661%2014%20240%20-18%20431%20-139%20822%20-107%20349%20-140%20493%20-140%20622%200%20392%20314%20748%20715%20811%20174%2028%20303%2018%20725%20-54%20363%20-62%20502%20-75%20730%20-68%20218%206%20289%2015%20905%20117%20566%2095%20695%20113%20930%20130%20180%2013%20479%203%20626%20-20z'%2F%3E%3C%2Fsvg%3E");
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    /* Keeps anchor-scrolled sections (#calculator, #services, etc.) from
       landing underneath the sticky header, whose height differs by breakpoint. */
    scroll-padding-top: 5.5rem;
}

@media (max-width: 767px) {
    html {
        scroll-padding-top: 8rem;
    }
}

body {
    margin: 0;
    font-family: "Onest", sans-serif;
    background:
        radial-gradient(120% 70% at 50% -8%, rgba(var(--surface-strong-rgb), 0.55), transparent 58%),
        radial-gradient(circle at top left, rgba(255, 255, 255, 0.85), transparent 30%),
        var(--bg);
    color: var(--ink);
    line-height: 1.68;
}

body.is-preloading,
body.is-booting {
    overflow: hidden;
}

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

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

button,
input,
textarea,
select {
    font: inherit;
}

button {
    cursor: pointer;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 3px solid rgba(27, 139, 104, 0.2);
    outline-offset: 3px;
}

.container {
    width: min(var(--container), calc(100% - 2rem));
    margin: 0 auto;
}

.site-shell {
    overflow: clip;
}

.page-preloader {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: grid;
    place-items: center;
    opacity: 0;
    pointer-events: none;
    background:
        radial-gradient(80% 70% at 50% 20%, rgba(var(--surface-strong-rgb), 0.5), transparent 65%),
        linear-gradient(180deg, rgba(251, 250, 244, 0.94), rgba(248, 246, 239, 0.97));
    backdrop-filter: blur(18px);
    transition: opacity 220ms var(--ease);
}

.page-preloader[hidden] {
    display: none;
}

.page-preloader.is-active,
body.is-booting .page-preloader {
    opacity: 1;
    pointer-events: auto;
}

.page-preloader__inner {
    position: relative;
    display: grid;
    justify-items: center;
    gap: 0;
    transform: translateY(-0.4rem);
}

.page-preloader__inner::before {
    content: "";
    position: absolute;
    inset: 50% auto auto 50%;
    width: min(38vw, 400px);
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background:
        radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.96), rgba(var(--surface-strong-rgb), 0.44) 58%, rgba(var(--surface-strong-rgb), 0) 74%);
    filter: blur(8px);
}

.page-preloader__video {
    position: relative;
    z-index: 1;
    width: min(30vw, 320px);
    min-width: 180px;
    aspect-ratio: 1;
    object-fit: contain;
    background: transparent;
    filter: drop-shadow(0 18px 34px rgba(var(--ink-rgb), 0.08));
}

@media (prefers-reduced-motion: reduce) {
    .page-preloader,
    .page-preloader__video {
        transition: none;
    }
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 20;
    padding: 0.35rem 0 0.42rem;
    background:
        radial-gradient(80% 160% at 88% 0%, rgba(var(--surface-strong-rgb), 0.45), transparent 60%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(251, 250, 244, 0.95));
    backdrop-filter: blur(12px);
    box-shadow: 0 8px 24px rgba(var(--ink-rgb), 0.05);
}

.topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    flex-wrap: wrap;
    padding: 0.08rem 0.2rem;
}

.brand img {
    width: clamp(72px, 16vw, 118px);
}

.footer-logo {
    width: clamp(116px, 15vw, 180px);
}

.main-nav {
    display: none;
    align-items: center;
    gap: 1.15rem;
    font-size: 0.92rem;
}

.main-nav a,
.language-switcher a,
.text-link {
    position: relative;
    color: var(--muted);
    transition: color 180ms var(--ease);
}

.main-nav a:hover,
.language-switcher a:hover,
.text-link:hover {
    color: var(--ink);
}

.header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.45rem;
    margin-left: auto;
}

.header-actions .button,
.header-actions .city-chip,
.header-actions .language-switcher {
    min-height: 2.3rem;
}

.header-actions .button {
    padding: 0.62rem 1.05rem;
}

.header-actions .city-chip {
    padding: 0.42rem 0.72rem 0.42rem 0.66rem;
}

.header-actions .city-chip__icon {
    width: 1.35rem;
    height: 1.35rem;
}

.header-actions .city-chip__content strong {
    font-size: 0.9rem;
}

.header-actions .language-switcher {
    padding: 0.14rem;
}

.header-actions .language-switcher a {
    min-width: 1.95rem;
    min-height: 2rem;
    padding: 0 0.42rem;
    font-size: 0.86rem;
}

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 3rem;
    padding: 0.85rem 1.35rem;
    border: 1px solid transparent;
    border-radius: 0.7rem;
    font-weight: 600;
    transition: transform 180ms var(--ease), box-shadow 180ms var(--ease), background-color 180ms var(--ease);
}

.button:hover {
    transform: translateY(-1px);
}

.button:active {
    transform: translateY(0);
}

.button--primary {
    background: linear-gradient(135deg, var(--accent), var(--accent-strong));
    color: var(--white);
    box-shadow: 0 18px 38px rgba(219, 111, 46, 0.22);
}

.button--ghost {
    background: rgba(255, 255, 255, 0.78);
    border-color: rgba(214, 220, 199, 0.8);
    color: var(--ink);
}

.button--block {
    width: 100%;
}

.city-chip,
.selector-button {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 3rem;
    padding: 0.625rem 0.9rem 0.625rem 0.8rem;
    border: 1px solid rgba(201, 210, 181, 0.72);
    border-radius: 0.5rem;
    background: rgba(255, 255, 255, 0.92);
    color: var(--ink);
    box-shadow: 0 10px 24px rgba(var(--ink-rgb), 0.05);
    transition: border-color 180ms var(--ease), background-color 180ms var(--ease), box-shadow 180ms var(--ease), transform 180ms var(--ease);
}

.city-chip:hover,
.selector-button:hover {
    transform: translateY(-1px);
    border-color: rgba(var(--primary-rgb), 0.26);
    box-shadow: 0 14px 28px rgba(var(--ink-rgb), 0.07);
}

.city-chip__icon {
    position: relative;
    flex: none;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 499.5px;
    background: rgba(var(--primary-rgb), 0.08);
}

.city-chip__icon::before {
    content: "";
    position: absolute;
    inset: 50% auto auto 50%;
    width: 0.95rem;
    height: 0.95rem;
    transform: translate(-50%, -50%);
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b8b68' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s6-5.1 6-11a6 6 0 1 0-12 0c0 5.9 6 11 6 11Z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

.city-chip__content {
    display: grid;
    gap: 0.05rem;
    min-width: 0;
}

.city-chip__content strong {
    font-size: 0.96rem;
    line-height: 1.05;
    white-space: nowrap;
}

.city-chip__chevron {
    flex: none;
    width: 0.72rem;
    height: 0.72rem;
    margin-left: 0.05rem;
    opacity: 0.62;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6.25L8 10.25L12 6.25' stroke='%23506557' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.city-chip__label,
.selector-button small {
    color: var(--muted);
    font-size: 0.72rem;
    line-height: 1;
}

.language-switcher {
    display: inline-flex;
    align-items: center;
    gap: 0.18rem;
    min-height: 3rem;
    padding: 0.2rem;
    border: 1px solid rgba(201, 210, 181, 0.72);
    border-radius: 0.5rem;
    background: rgba(246, 248, 240, 0.92);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.language-switcher a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.2rem;
    min-height: 2.35rem;
    padding: 0 0.6rem;
    border-radius: 0.4rem;
    font-size: 0.92rem;
    font-weight: 600;
    line-height: 1;
    transition: color 180ms var(--ease), background-color 180ms var(--ease), box-shadow 180ms var(--ease);
}

.header-cta {
    display: none;
}

.language-switcher a.is-active {
    color: var(--ink);
    font-weight: 700;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 8px 18px rgba(var(--ink-rgb), 0.08);
}

.language-switcher a:not(.is-active) {
    color: rgba(80, 101, 87, 0.84);
}

.menu-toggle {
    display: inline-flex;
    flex-direction: column;
    gap: 0.28rem;
    border: 0;
    background: transparent;
    padding: 0.55rem;
}

.menu-toggle span {
    width: 1.4rem;
    height: 2px;
    border-radius: 499.5px;
    background: var(--ink);
}

.mobile-menu {
    margin-top: 0.75rem;
    padding: 1.2rem;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(214, 220, 199, 0.8);
    box-shadow: var(--shadow-soft);
}

.mobile-menu a {
    display: block;
    padding: 0.8rem 0;
    border-bottom: 1px solid rgba(214, 220, 199, 0.65);
}

.mobile-menu__footer {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1rem;
}

.mobile-menu__footer .city-chip {
    width: 100%;
    justify-content: space-between;
}

.hero-section {
    position: relative;
    padding: 2.2rem 0 4.4rem;
}

.hero-grid {
    position: relative;
    z-index: 1;
}

.hero-grid,
.contact-grid {
    display: grid;
    gap: 1.5rem;
}

.hero-copy {
    position: relative;
    z-index: 3;
    padding-top: 0.5rem;
}

/* On phones the photo + sage blob sit behind the copy as a soft blurred backdrop.
   Higher-specificity selectors so these win over the later base .hero-media rule. */
@media (max-width: 767px) {
    .hero-section {
        overflow: hidden;
        padding-bottom: 2.25rem;
    }

    .hero-grid .hero-media {
        position: absolute;
        inset: -1.5rem -1.25rem auto auto;
        width: 94%;
        height: 64%;
        min-height: 0;
        z-index: 0;
        opacity: 0.42;
        filter: blur(6px) saturate(1.05);
        pointer-events: none;
    }

    .hero-grid .hero-media img {
        filter: none;
    }

    /* Photo no longer adds height below the copy, so drop the desktop overlap. */
    main .calculator-section {
        margin-top: 0;
    }
}

.hero-eyebrow {
    display: inline-flex;
    margin: 0 0 1rem;
    padding: 0.45rem 0.9rem;
    border-radius: 499.5px;
    background: rgba(27, 139, 104, 0.1);
    color: var(--primary-strong);
    font-weight: 600;
}

h1,
h2,
h3 {
    margin: 0;
    font-family: "Geologica", sans-serif;
    text-wrap: balance;
}

h1 {
    font-size: clamp(2.45rem, 7vw, 4.95rem);
    line-height: 0.96;
    letter-spacing: -0.04em;
    max-width: 12ch;
}

h2 {
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    line-height: 1.02;
    letter-spacing: -0.03em;
}

h3 {
    font-size: 1.2rem;
    line-height: 1.18;
}

.hero-description,
.section-heading p,
.about-copy p,
.contact-copy p,
.review-card p,
.service-card p,
.process-step p,
.benefit-item p {
    max-width: 65ch;
    color: var(--muted);
}

.hero-description {
    margin: 1.2rem 0 0;
    font-size: 1.05rem;
    color: #000;
}

.hero-actions {
    margin-top: 1.5rem;
}

.hero-secondary {
    margin: 1rem 0 0;
    font-size: 0.95rem;
    color: #000;
}

.trust-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 1.1rem 1.6rem;
    padding: 0;
    margin: 1.8rem 0 0;
    list-style: none;
}

.trust-chips li,
.trust-chip {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    max-width: 11rem;
    font-size: 0.92rem;
    font-weight: 500;
    line-height: 1.22;
    color: var(--ink);
}

.trust-chip__icon {
    flex: none;
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 999px;
    background-color: rgba(var(--primary-rgb), 0.1);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.5rem;
}

.trust-chip__icon--flask {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%231b8b68'%3E%3Cpath d='M19.8 18.4 14 10.67V6.5l1.35-1.69c.26-.33.03-.81-.39-.81H9.04c-.42 0-.65.48-.39.81L10 6.5v4.17L4.2 18.4c-.49.66-.02 1.6.8 1.6h14c.82 0 1.29-.94.8-1.6z'/%3E%3C/svg%3E");
}

.trust-chip__icon--clock {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%231b8b68'%3E%3Cpath d='M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67z'/%3E%3C/svg%3E");
}

.trust-chip__icon--kit {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%231b8b68'%3E%3Cpath d='M20 6h-4V4c0-1.11-.89-2-2-2h-4c-1.11 0-2 .89-2 2v2H4c-1.11 0-1.99.89-1.99 2L2 19c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V8c0-1.11-.89-2-2-2zm-6 0h-4V4h4v2z'/%3E%3C/svg%3E");
}

.hero-service-area {
    display: grid;
    gap: 0.35rem;
    width: min(100%, 24rem);
    margin-top: 1rem;
    padding: 1rem 1.1rem;
    border-radius: 0.75rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(239, 243, 230, 0.88)),
        rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(214, 220, 199, 0.86);
    box-shadow: var(--shadow-soft);
}

.hero-service-area span,
.calculator-intro__label {
    color: var(--muted);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.hero-service-area strong {
    font-family: "Geologica", sans-serif;
    font-size: 1.15rem;
}

.hero-service-area p {
    margin: 0;
    color: var(--muted);
    font-size: 0.95rem;
}

.hero-media {
    position: relative;
    z-index: 1;
    min-height: 22rem;
    overflow: visible;
}

/* Wide organic shell closer to the reference: soft capsule with a left waist. */
.hero-media__shape {
    position: absolute;
    inset: 0 0 0 0;
    z-index: 0;
    background:
        radial-gradient(82% 74% at 58% 48%, rgba(255, 255, 255, 0.18), transparent 68%),
        linear-gradient(160deg, rgba(var(--primary-rgb), 0.17), rgba(var(--surface-strong-rgb), 0.7));
    -webkit-mask: var(--hero-shell-mask) center / 100% 100% no-repeat;
    mask: var(--hero-shell-mask) center / 100% 100% no-repeat;
    transform: translateY(1.2rem) scale(1.2);
    transform-origin: center;
    filter: blur(1px);
}

.hero-media img {
    position: absolute;
    inset: 0 0 0 0;
    z-index: 1;
    width: 150%;
    max-width: none;
    height: 100%;
    object-fit: cover;
    object-position: center;
    -webkit-mask: var(--hero-image-mask) center / 100% 100% no-repeat;
    mask: var(--hero-image-mask) center / 100% 100% no-repeat;
    filter: drop-shadow(0 22px 40px rgba(var(--ink-rgb), 0.16));
}

.about-photo img {
    position: relative;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 22% 28% 26% 24% / 27% 23% 27% 23%;
    box-shadow: var(--shadow-lift);
}

.hero-floating-card {
    position: absolute;
    left: 1rem;
    bottom: 1rem;
    width: min(16rem, 70%);
    padding: 1rem;
    border-radius: 0.675rem;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(214, 220, 199, 0.82);
    box-shadow: var(--shadow-soft);
}

.hero-floating-card span,
.estimate-card__label,
.metric-card span {
    display: block;
    margin-bottom: 0.35rem;
    color: var(--muted);
    font-size: 0.9rem;
}

section {
    padding: 1.8rem 0 3.35rem;
}

.section-heading {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    margin-bottom: 1.5rem;
}

.section-heading--center {
    text-align: center;
    align-items: center;
}

/* ---- Calculator: a single sage block overlapping the hero ---- */
.calculator-section {
    position: relative;
    z-index: 2;
    margin-top: -5rem;
    padding-top: 0;
}

.calculator-card {
    position: relative;
    padding: clamp(1.25rem, 3vw, 2.4rem);
    border-radius: 1.1rem;
    background: var(--surface);
    border: 1px solid rgba(214, 220, 199, 0.7);
    box-shadow: 0 30px 70px rgba(var(--ink-rgb), 0.08);
}

.calculator-card__title {
    margin-bottom: 1.1rem;
}

.service-card,
.process-step,
.review-card,
.request-form,
.about-copy,
.contact-copy {
    background: var(--card);
    border: 1px solid rgba(214, 220, 199, 0.82);
    box-shadow: var(--shadow-soft);
}

.service-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-bottom: 1.2rem;
}

.service-tab {
    padding: 0.7rem 1.2rem;
    border: 1px solid rgba(214, 220, 199, 0.85);
    border-radius: 499.5px;
    background: rgba(255, 255, 255, 0.85);
    color: var(--muted);
    font-weight: 600;
    transition: background-color 180ms var(--ease), color 180ms var(--ease);
}

.service-tab.is-active {
    background: var(--primary);
    border-color: transparent;
    color: var(--white);
}

.calculator-body {
    display: grid;
    gap: 1rem;
    align-items: stretch;
}

.calc-field {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    padding: 1.2rem;
    border-radius: 0.8rem;
    background: var(--card);
    border: 1px solid rgba(214, 220, 199, 0.7);
}

.calc-field--area {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}

.calc-field--area > * {
    position: relative;
    z-index: 1;
}

.calc-field--area::after {
    content: "";
    position: absolute;
    top: 4.2rem;
    left: 50%;
    width: min(9.5rem, 52%);
    aspect-ratio: 1;
    border-radius: 0.8rem;
    opacity: 0.22;
    transform: translateX(-50%);
    background:
        radial-gradient(circle at 18% 18%, rgba(var(--primary-rgb), 0.1) 0, rgba(var(--primary-rgb), 0.1) 0.22rem, transparent 0.24rem),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200' fill='none'%3E%3Crect x='28' y='28' width='144' height='144' rx='12' stroke='%231b8b68' stroke-width='4'/%3E%3Cpath d='M100 28V92' stroke='%231b8b68' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M28 92H172' stroke='%231b8b68' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M72 92V172' stroke='%231b8b68' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M128 92V172' stroke='%231b8b68' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M72 132H128' stroke='%231b8b68' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M50 60H78' stroke='%231b8b68' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M120 60H150' stroke='%231b8b68' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M46 126H58' stroke='%231b8b68' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M142 126H154' stroke='%231b8b68' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M88 150H112' stroke='%231b8b68' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
    background-repeat: no-repeat;
    background-position: top left, center;
    pointer-events: none;
    z-index: 0;
}

/* The decorative room-plan watermark gets clipped on narrow phones — hide it. */
@media (max-width: 560px) {
    .calc-field--area::after {
        display: none;
    }
}

.calc-field__label {
    color: var(--muted);
    font-size: 0.95rem;
    font-weight: 500;
}

.area-control {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    margin-top: auto;
}

.area-value {
    display: flex;
    align-items: baseline;
    gap: 0.3rem;
}

.area-value strong {
    font-family: "Geologica", sans-serif;
    font-size: clamp(1.8rem, 4vw, 2.4rem);
    line-height: 1;
}

.area-value small {
    color: var(--muted);
}

.area-button {
    flex: none;
    width: 3rem;
    height: 3rem;
    border: 0;
    border-radius: 0.5rem;
    background: var(--surface-strong);
    color: var(--ink);
    font-size: 1.5rem;
    line-height: 1;
    transition: background-color 160ms var(--ease);
}

.area-button:hover {
    background: rgba(var(--primary-rgb), 0.16);
}

/* Add-on rows: green custom checkbox + optional quantity field */
.addon-list {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.addon-chip {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem 0.75rem;
}

.addon-chip__main {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    cursor: pointer;
}

.addon-chip input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    flex: none;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 0.275rem;
    border: 1px solid rgba(214, 220, 199, 1);
    background: var(--white);
    display: grid;
    place-content: center;
    transition: background-color 140ms var(--ease), border-color 140ms var(--ease);
}

.addon-chip input[type="checkbox"]::before {
    content: "";
    width: 0.82rem;
    height: 0.82rem;
    transform: scale(0);
    transition: transform 140ms var(--ease);
    background: var(--white);
    clip-path: polygon(14% 44%, 0 60%, 40% 100%, 100% 22%, 86% 8%, 38% 70%);
}

.addon-chip input[type="checkbox"]:checked {
    background: var(--primary);
    border-color: var(--primary);
}

.addon-chip input[type="checkbox"]:checked::before {
    transform: scale(1);
}

.addon-chip__name {
    font-size: 0.98rem;
}

.addon-qty {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-left: 0.25rem;
}

.addon-qty input {
    width: 3.8rem;
    padding: 0.4rem 0.5rem;
    text-align: center;
    border: 1px solid rgba(214, 220, 199, 1);
    border-radius: 0.35rem;
    background: var(--white);
    color: var(--ink);
}

.addon-qty small {
    color: var(--muted);
    font-size: 0.85rem;
}

.all-services-btn {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.2rem;
    padding: 0.6rem 1.05rem;
    border: 1px dashed rgba(var(--primary-rgb), 0.45);
    border-radius: 499.5px;
    background: rgba(var(--primary-rgb), 0.06);
    color: var(--primary-strong);
    font-weight: 600;
    transition: background-color 160ms var(--ease);
}

.all-services-btn:hover {
    background: rgba(var(--primary-rgb), 0.12);
}

.all-services-btn span {
    font-size: 1.1rem;
    line-height: 1;
}

/* Request form keeps its own grid + field styling */
.request-form__grid {
    display: grid;
    gap: 0.85rem;
}

.request-form label {
    display: grid;
    gap: 0.45rem;
    min-width: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.request-form__full {
    grid-column: 1 / -1;
}

.soft-input,
.request-form input,
.request-form textarea,
.request-form select {
    width: 100%;
    padding: 0.95rem 1rem;
    border: 1px solid rgba(214, 220, 199, 0.95);
    border-radius: 0.5rem;
    background: rgba(255, 255, 255, 0.95);
    color: var(--ink);
}

.soft-input:focus,
.request-form input:focus,
.request-form textarea:focus,
.request-form select:focus {
    outline: 2px solid rgba(27, 139, 104, 0.18);
    border-color: var(--primary);
}

.calculator-note {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin: 1.3rem 0 0;
    color: var(--muted);
    font-size: 0.95rem;
}

.calculator-note::before {
    content: "";
    flex: none;
    width: 1.6rem;
    height: 1.6rem;
    opacity: 0.75;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%23677a6f'%3E%3Cpath d='M17 8C8 10 5.9 16.17 3.82 21.34l1.89.66.95-2.3c.48.17.98.34 1.34.34C19 20 22 3 22 3c-1 2-8 2.25-13 3.25S2 11.5 2 13.5s1.75 3.75 1.75 3.75C3 16 12 6 17 8z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.estimate-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 1.6rem;
    border-radius: 0.9rem;
    background: linear-gradient(180deg, var(--card), rgba(240, 241, 229, 0.7));
    border: 1px solid rgba(214, 220, 199, 0.7);
}

.estimate-card__spark {
    position: absolute;
    top: 1.2rem;
    right: 1.3rem;
    width: 2.1rem;
    height: 2.1rem;
    opacity: 0.45;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231b8b68'%3E%3Cpath d='M12 0C13 7 17 11 24 12C17 13 13 17 12 24C11 17 7 13 0 12C7 11 11 7 12 0Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.estimate-card__label {
    margin: 0;
    color: var(--muted);
    font-size: 0.95rem;
}

.estimate-card__amount {
    display: block;
    margin: 0.3rem 0 1.1rem;
    font-family: "Geologica", sans-serif;
    font-size: clamp(2.2rem, 5vw, 3rem);
    line-height: 0.95;
    color: var(--primary-strong);
}

.estimate-card__amount span:last-child {
    font-size: 0.45em;
    color: var(--ink);
}

.estimate-card small {
    margin-top: 0.85rem;
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.45;
}

.services-dialog {
    width: min(34rem, calc(100% - 1rem));
    border: 0;
    padding: 1.4rem;
    border-radius: 0.875rem;
    background: var(--card);
    box-shadow: var(--shadow-lift);
}

.services-dialog::backdrop {
    background: rgba(var(--ink-rgb), 0.3);
    backdrop-filter: blur(4px);
}

.addon-list--full {
    gap: 0;
    margin: 0.6rem 0 1.2rem;
}

.addon-list--full .addon-chip {
    padding: 0.75rem 0.3rem;
    border-bottom: 1px solid rgba(214, 220, 199, 0.55);
}

.addon-list--full .addon-chip:last-child {
    border-bottom: 0;
}

.services-grid,
.benefits-grid,
.reviews-grid {
    display: grid;
    gap: 1rem;
    align-items: stretch;
}

.service-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    height: 100%;
    overflow: hidden;
    border-radius: 0.5rem;
    box-shadow: none;
    transition: transform 220ms var(--ease), box-shadow 220ms var(--ease), border-color 220ms var(--ease);
}

.service-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lift);
}

.service-card__image {
    position: relative;
    overflow: hidden;
}

.service-card__image-button {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.service-card__image img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    transition: transform 500ms var(--ease);
}

.service-card:hover .service-card__image img {
    transform: scale(1.04);
}

.service-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 1rem;
    padding: 1.1rem;
}

.service-card__copy {
    display: grid;
    gap: 0.7rem;
    min-width: 0;
}

.service-card__copy p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.service-card__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-width: 0;
    margin-top: auto;
    padding-top: 0.1rem;
}

.service-card__price {
    font-family: "Geologica", sans-serif;
    font-size: 1rem;
    line-height: 1.1;
    color: var(--ink);
}

.text-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0;
    border: 0;
    background: transparent;
    font-weight: 600;
}

.text-link::after {
    content: "→";
    transition: transform 180ms var(--ease);
}

.text-link:hover::after,
.text-link:focus-visible::after {
    transform: translateX(0.18rem);
}

.service-card--popular {
    min-height: 100%;
}

.about-copy,
.contact-copy {
    padding: 1.4rem;
    border-radius: 0.6rem;
}

.about-section {
    padding: clamp(3.25rem, 7vw, 5.5rem) 0;
}

.about-layout {
    display: grid;
    gap: 1.5rem;
}

.about-copy {
    display: grid;
    gap: 1.5rem;
    align-content: start;
}

.about-copy p {
    margin: 0;
}

.about-points {
    display: grid;
    gap: 1rem;
}

.about-point {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.9rem;
    padding: 1rem 1rem 1rem 0.95rem;
    border: 1px solid rgba(214, 220, 199, 0.82);
    border-radius: 0.875rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(243, 245, 236, 0.78));
}

.about-point__index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.35rem;
    height: 2.35rem;
    border-radius: 0.7rem;
    background: rgba(var(--primary-rgb), 0.1);
    color: var(--primary-strong);
    font-family: "Geologica", sans-serif;
    font-size: 0.9rem;
    font-weight: 700;
}

.about-point__body {
    display: grid;
    gap: 0.35rem;
}

.about-point__body h3,
.about-note strong,
.about-gallery__caption strong {
    margin: 0;
}

.about-point__body p,
.about-note p,
.about-gallery__caption span {
    margin: 0;
}

.about-note {
    display: grid;
    gap: 0.35rem;
    padding: 1rem 1.05rem;
    border-radius: 0.875rem;
    background: rgba(var(--primary-rgb), 0.06);
    border: 1px solid rgba(var(--primary-rgb), 0.14);
}

.about-gallery {
    display: grid;
    gap: 0.95rem;
    align-content: start;
}

.about-gallery__main,
.about-gallery__tile,
.about-gallery__caption {
    margin: 0;
    overflow: hidden;
    border-radius: 0.9rem;
}

.about-gallery__main,
.about-gallery__tile {
    position: relative;
    border: 1px solid rgba(214, 220, 199, 0.8);
    background: rgba(255, 255, 255, 0.84);
    box-shadow: var(--shadow-soft);
}

.about-gallery__main {
    min-height: 19rem;
}

.about-gallery__main img,
.about-gallery__tile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about-gallery__main img {
    object-position: center 56%;
}

.about-gallery__caption {
    display: grid;
    gap: 0.35rem;
    padding: 1rem 1.05rem;
    background: linear-gradient(135deg, rgba(27, 139, 104, 0.1), rgba(255, 255, 255, 0.92));
    border: 1px solid rgba(var(--primary-rgb), 0.12);
}

.about-gallery__caption span {
    color: var(--primary-strong);
    font-size: 0.84rem;
    font-weight: 600;
}

.about-gallery__caption strong {
    font-size: 1rem;
    line-height: 1.35;
}

.about-gallery__tile {
    min-height: 10rem;
}

.about-gallery__tile--left img {
    object-position: center 30%;
}

.about-gallery__tile--right img {
    object-position: center 72%;
}

.contact-section {
    padding-top: 2rem;
}

.process-row {
    --process-gap: 1rem;
    --process-icon-size: clamp(5.1rem, 10vw, 6.2rem);
    --process-connector-inset: 0.75rem;
    display: grid;
    gap: var(--process-gap);
    align-items: stretch;
}

/* On phones the four steps become a side-scroll instead of a tall stack. */
@media (max-width: 767px) {
    .process-row,
    .services-grid {
        cursor: grab;
    }

    .process-row.is-dragging,
    .services-grid.is-dragging {
        cursor: grabbing;
        scroll-snap-type: none;
        user-select: none;
    }

    .process-row.is-dragging img,
    .services-grid.is-dragging img {
        pointer-events: none;
    }

    .process-row {
        grid-auto-flow: column;
        grid-auto-columns: minmax(70%, 1fr);
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        margin: 0 -0.4rem;
        padding: 0 0.4rem 0.5rem;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .process-row::-webkit-scrollbar {
        display: none;
    }

    .process-step {
        scroll-snap-align: start;
    }

    .services-grid {
        grid-auto-flow: column;
        grid-auto-columns: minmax(80%, 1fr);
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        margin: 0 -0.4rem;
        padding: 0 0.4rem 0.5rem;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .services-grid::-webkit-scrollbar {
        display: none;
    }

    .service-card--popular {
        scroll-snap-align: start;
    }
}

.process-step,
.review-card {
    padding: 1.25rem;
    border-radius: 0.5rem;
}

.process-panel {
    padding: clamp(1.35rem, 2.7vw, 2.2rem);
    border-radius: 0.85rem;
    background: var(--surface);
    border: 1px solid rgba(214, 220, 199, 0.6);
    box-shadow: none;
}

.process-step {
    position: relative;
    display: grid;
    grid-template-rows: auto 1fr;
    gap: 1.05rem;
    align-content: start;
    justify-items: center;
    min-height: 100%;
    padding: 0.75rem 0.65rem;
    text-align: center;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.process-step::after {
    display: none;
    content: "";
    position: absolute;
    top: 2.35rem;
    right: -1.65rem;
    width: 3.3rem;
    height: 1.05rem;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 54 20' fill='none'%3E%3Cpath d='M2 10H42' stroke='%2390a08f' stroke-width='2.6' stroke-linecap='round' stroke-dasharray='2 7'/%3E%3Cpath d='M36 4L42 10L36 16' stroke='%231b8b68' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
        center / contain no-repeat;
}

.process-step__icon-wrap {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: auto;
}

.process-step__icon-wrap::after {
    display: none;
    content: "";
    position: absolute;
    top: calc((var(--process-icon-size) / 2) - 0.525rem);
    left: calc(50% + (var(--process-icon-size) / 2) + var(--process-connector-inset));
    width: calc(100% + var(--process-gap) - var(--process-icon-size) - (var(--process-connector-inset) * 2));
    height: 1.05rem;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 54 20' fill='none'%3E%3Cpath d='M2 10H42' stroke='%2390a08f' stroke-width='2.6' stroke-linecap='round' stroke-dasharray='2 7'/%3E%3Cpath d='M36 4L42 10L36 16' stroke='%231b8b68' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
        center / contain no-repeat;
    pointer-events: none;
}

.process-step__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--process-icon-size);
    height: var(--process-icon-size);
    border-radius: 999px;
    background:
        radial-gradient(circle at 30% 28%, rgba(255, 255, 255, 0.98), rgba(248, 249, 242, 0.96) 42%, rgba(240, 242, 234, 0.92) 100%);
    border: 1px solid rgba(214, 220, 199, 0.85);
    box-shadow: 0 16px 32px rgba(var(--ink-rgb), 0.07);
}

.process-step__icon::before {
    content: "";
    width: 2.45rem;
    height: 2.45rem;
    background-color: var(--primary-strong);
    -webkit-mask: var(--process-icon) center / contain no-repeat;
    mask: var(--process-icon) center / contain no-repeat;
}

.process-step--1 .process-step__icon {
    --process-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 3H16C17.1 3 18 3.9 18 5V6H20C21.1 6 22 6.9 22 8V19C22 20.1 21.1 21 20 21H4C2.9 21 2 20.1 2 19V8C2 6.9 2.9 6 4 6H6V5C6 3.9 6.9 3 8 3ZM8 6H16V5H8V6ZM6 11H10V13H6V11ZM12 11H18V13H12V11ZM6 15H10V17H6V15ZM12 15H16V17H12V15Z' fill='black'/%3E%3C/svg%3E");
}

.process-step--2 .process-step__icon {
    --process-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2V5M17 2V5M4 8H20M6 4H18C19.1 4 20 4.9 20 6V12.2C19.4 12.1 18.7 12 18 12C14.69 12 12 14.69 12 18C12 18.35 12.03 18.68 12.08 19H6C4.9 19 4 18.1 4 17V6C4 4.9 4.9 4 6 4ZM18 14V18L20.8 19.7L21.5 18.55L19.4 17.3V14H18ZM18 22C15.79 22 14 20.21 14 18S15.79 14 18 14 22 15.79 22 18 20.21 22 18 22Z' fill='black'/%3E%3C/svg%3E");
}

.process-step--3 .process-step__icon {
    --process-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 7H13L16.5 10.5H20C21.1 10.5 22 11.4 22 12.5V16C22 16.55 21.55 17 21 17H19.8C19.36 18.73 17.79 20 16 20C14.21 20 12.64 18.73 12.2 17H9.8C9.36 18.73 7.79 20 6 20C4.21 20 2.64 18.73 2.2 17H2C1.45 17 1 16.55 1 16V9C1 7.9 1.9 7 3 7ZM6 18C6.55 18 7 17.55 7 17S6.55 16 6 16 5 16.45 5 17 5.45 18 6 18ZM16 18C16.55 18 17 17.55 17 17S16.55 16 16 16 15 16.45 15 17 15.45 18 16 18ZM14.1 3.7C15.4 3.81 16.59 4.41 17.46 5.35L18.93 3.88L19.63 4.58L18.18 6.03C18.79 6.78 19.21 7.69 19.36 8.7H18.15C17.83 6.83 16.37 5.35 14.5 5.01L14.1 3.7ZM12.9 8.1L14.15 5.6L15.4 8.1L17.9 9.35L15.4 10.6L14.15 13.1L12.9 10.6L10.4 9.35L12.9 8.1Z' fill='black'/%3E%3C/svg%3E");
}

.process-step--4 .process-step__icon {
    --process-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2L13.76 7.24L19 9L13.76 10.76L12 16L10.24 10.76L5 9L10.24 7.24L12 2ZM5 14L5.88 16.12L8 17L5.88 17.88L5 20L4.12 17.88L2 17L4.12 16.12L5 14ZM19 13L20.17 15.83L23 17L20.17 18.17L19 21L17.83 18.17L15 17L17.83 15.83L19 13Z' fill='black'/%3E%3C/svg%3E");
}

.process-step__content {
    display: grid;
    gap: 0.6rem;
    justify-items: center;
    align-content: start;
}

.process-step h3,
.process-step p {
    margin: 0;
}

.process-step__number {
    color: var(--primary-strong);
    font-weight: 700;
}

.process-step h3 {
    max-width: 15ch;
    font-size: 1.12rem;
    line-height: 1.16;
}

.process-step p {
    max-width: 21ch;
    font-size: 0.97rem;
    line-height: 1.58;
}

.benefits-section {
    position: relative;
    overflow: hidden;
}

.benefits-section__sparkle {
    position: absolute;
    width: 1.4rem;
    height: 1.4rem;
    background: rgba(var(--primary-rgb), 0.35);
    clip-path: polygon(50% 0%, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0% 50%, 39% 39%);
    pointer-events: none;
}

.benefits-section__sparkle--1 {
    top: 0.5rem;
    right: 8%;
}

.benefits-section__sparkle--2 {
    top: 3.5rem;
    right: 4%;
    width: 0.9rem;
    height: 0.9rem;
    opacity: 0.7;
}

.benefits-grid {
    grid-template-columns: 1fr;
    gap: 1.75rem;
    text-align: center;
}

.benefit-item {
    display: grid;
    justify-items: center;
    gap: 0.6rem;
    padding: 0 1.5rem;
}

.benefit-item h3 {
    font-size: 1.05rem;
}

.benefit-item p {
    max-width: 26ch;
    font-size: 0.9rem;
}

.benefit-item__icon {
    display: inline-block;
    width: 2.75rem;
    height: 2.75rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.benefit-item__icon--price {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b8b68' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M9 12.5l2 2 4-5'/%3E%3C/svg%3E");
}

.benefit-item__icon--safe {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b8b68' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22V12'/%3E%3Cpath d='M12 12C12 12 4 12 4 5C10 5 12 9 12 12Z'/%3E%3Cpath d='M12 12C12 12 20 12 20 5C14 5 12 9 12 12Z'/%3E%3C/svg%3E");
}

.benefit-item__icon--time {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b8b68' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='13' r='8'/%3E%3Cpath d='M12 9v4l2.5 2.5'/%3E%3Cpath d='M9 2h6'/%3E%3C/svg%3E");
}

.benefit-item__icon--team {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b8b68' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M3 20c0-3.5 3-5 6-5s6 1.5 6 5'/%3E%3Ccircle cx='17' cy='9' r='2.5'/%3E%3Cpath d='M15.5 12c2.5 0 5 1.3 5 4.5'/%3E%3C/svg%3E");
}

.review-card {
    position: relative;
    display: grid;
    gap: 0.9rem;
    align-content: start;
    background: var(--card);
    box-shadow: none;
}

.review-card__mark {
    position: absolute;
    top: 1rem;
    right: 1rem;
    color: rgba(var(--primary-rgb), 0.14);
    font-family: "Geologica", sans-serif;
    font-size: 3rem;
    line-height: 1;
}

.stars {
    margin-bottom: 0;
    color: var(--accent-strong);
    letter-spacing: 0.16em;
}

.reviews-head {
    display: grid;
    gap: 1rem;
    justify-items: center;
    margin-bottom: 1.4rem;
}

.reviews-head__copy {
    display: grid;
    gap: 0.55rem;
    justify-items: center;
    width: 100%;
}

.reviews-head__copy p,
.contact-band__copy p {
    margin: 0;
}

.reviews-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: center;
    gap: 0.75rem;
}

.reviews-google,
.reviews-add-button {
    min-height: 3.25rem;
    border-radius: 999px;
}

.reviews-google {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0 1.4rem;
    border: 1px solid rgba(214, 220, 199, 0.9);
    background: var(--card);
    color: var(--ink);
    font-weight: 600;
    transition: background-color 160ms var(--ease);
}

.reviews-google:hover {
    background: rgba(var(--primary-rgb), 0.07);
}

.reviews-google span {
    color: var(--muted);
    font-size: 0.85rem;
    font-weight: 500;
}

.reviews-google strong {
    font-size: 0.95rem;
    font-weight: 600;
}

.review-card__status {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.36rem 0.65rem;
    border-radius: 999px;
    background: rgba(var(--primary-rgb), 0.1);
    color: var(--primary-strong);
    font-size: 0.8rem;
    font-weight: 700;
}

.review-card footer {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    margin-top: 1rem;
    color: var(--muted);
}

/* ---- Generic horizontal card slider (reviews + about) ---- */
.slider {
    position: relative;
}

.slider__track {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding: 0.25rem 0.25rem 0.6rem;
    margin: 0 -0.25rem;
    cursor: grab;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.slider__track.is-dragging {
    cursor: grabbing;
    scroll-snap-type: none;
    scroll-behavior: auto;
    user-select: none;
}

.slider__track.is-dragging img {
    pointer-events: none;
}

.slider__track::-webkit-scrollbar {
    display: none;
}

.slider__track > * {
    flex: 0 0 min(88%, 27rem);
    scroll-snap-align: start;
}

.slider__nav {
    display: flex;
    justify-content: flex-end;
    gap: 0.6rem;
    margin-top: 1rem;
}

.slider__arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border: 1px solid rgba(214, 220, 199, 0.9);
    border-radius: 999px;
    background: var(--card);
    color: var(--ink);
    font-size: 1.45rem;
    line-height: 1;
    box-shadow: none;
    transition: background-color 160ms var(--ease), opacity 160ms var(--ease);
}

.slider__arrow:hover {
    background: rgba(var(--primary-rgb), 0.1);
}

.slider__arrow:disabled {
    opacity: 0.35;
    cursor: not-allowed;
    box-shadow: none;
}

/* Horizontal card: photo on the left, copy on the right */
.hcard-slider .slider__track > * {
    flex-basis: min(92%, 34rem);
}

.hcard {
    display: grid;
    grid-template-columns: 42% 1fr;
    min-height: 12rem;
    overflow: hidden;
    border-radius: 0.75rem;
    background: var(--card);
    border: 1px solid rgba(214, 220, 199, 0.8);
}

.hcard__media {
    overflow: hidden;
}

.hcard__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hcard__body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.55rem;
    padding: 1.4rem;
}

.hcard__body p {
    margin: 0;
    color: var(--muted);
}

/* ---- Before / after comparison slider ---- */
.before-after-slider .slider__track > * {
    flex-basis: min(84%, 26rem);
}

.ba-card {
    display: grid;
    gap: 0.85rem;
}

.ba-compare {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: var(--radius-lg);
    background: var(--surface-strong);
    border: 1px solid rgba(214, 220, 199, 0.82);
    box-shadow: var(--shadow-soft);
    touch-action: pan-y;
    --ba-position: 50%;
}

.ba-compare__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    user-select: none;
}

.ba-compare__before {
    position: absolute;
    inset: 0;
    width: var(--ba-position);
    overflow: hidden;
}

.ba-compare__before .ba-compare__img {
    width: var(--ba-compare-width, 100%);
    max-width: none;
}

.ba-compare__tag {
    position: absolute;
    top: 0.85rem;
    z-index: 1;
    padding: 0.3rem 0.75rem;
    border-radius: 999px;
    background: rgba(31, 48, 39, 0.55);
    color: var(--white);
    font-size: 0.8rem;
    font-weight: 600;
    backdrop-filter: blur(2px);
}

.ba-compare__tag--before {
    left: 0.85rem;
}

.ba-compare__tag--after {
    right: 0.85rem;
}

.ba-compare__handle {
    position: absolute;
    top: 0;
    bottom: 0;
    left: var(--ba-position);
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    margin-left: -1.375rem;
    cursor: ew-resize;
}

.ba-compare__handle::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 2px;
    background: rgba(255, 255, 255, 0.85);
    transform: translateX(-50%);
}

.ba-compare__handle-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 999px;
    background: var(--card);
    color: var(--ink);
    font-size: 1.1rem;
    box-shadow: var(--shadow-lift);
    transition: transform 180ms var(--ease);
}

.ba-compare.is-dragging .ba-compare__handle-icon {
    transform: scale(1.06);
}

.ba-compare__handle:focus-visible .ba-compare__handle-icon {
    outline: 3px solid rgba(27, 139, 104, 0.35);
    outline-offset: 2px;
}

.ba-card__caption {
    margin: 0;
    color: var(--muted);
    font-size: 0.9375rem;
}

.contact-grid {
    align-items: start;
}

.contact-band {
    display: grid;
    gap: 1rem;
    padding: 1.2rem;
    border-radius: 0.6rem;
    background: var(--surface);
    border: 1px solid rgba(214, 220, 199, 0.6);
    box-shadow: none;
}

.contact-band--consultation {
    overflow: hidden;
    padding: clamp(1.15rem, 2.6vw, 1.7rem);
    gap: 1.1rem;
    align-items: stretch;
}

.contact-band__copy {
    display: grid;
    gap: 0.55rem;
    align-content: start;
}

.contact-band__actions {
    display: grid;
    gap: 0.85rem;
    align-content: start;
}

.contact-band__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    color: var(--muted);
    font-size: 0.92rem;
}

.contact-band__meta span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.contact-band__meta span::before {
    content: "";
    width: 0.4rem;
    height: 0.4rem;
    border-radius: 50%;
    background: rgba(var(--primary-rgb), 0.5);
}

.contact-direct {
    display: grid;
    gap: 0.75rem;
    margin-top: 0.6rem;
}

.contact-direct__item {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    width: fit-content;
    max-width: 100%;
    color: var(--ink);
    font-weight: 600;
}

.contact-direct__icon {
    position: relative;
    flex: none;
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 999px;
    background: rgba(var(--primary-rgb), 0.1);
}

.contact-direct__icon::before {
    content: "";
    position: absolute;
    inset: 50% auto auto 50%;
    width: 1.2rem;
    height: 1.2rem;
    transform: translate(-50%, -50%);
    background-color: var(--primary-strong);
    -webkit-mask: var(--contact-icon) center / contain no-repeat;
    mask: var(--contact-icon) center / contain no-repeat;
}

.contact-direct__icon--telegram {
    --contact-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M21.44 4.64a1.5 1.5 0 0 0-1.6-.22L3.1 11.42a1.5 1.5 0 0 0 .14 2.81l4.15 1.45 1.5 4.76a1.5 1.5 0 0 0 2.69.42l2.58-3.53 4.6 3.56a1.5 1.5 0 0 0 2.39-.9l2.3-13.9a1.5 1.5 0 0 0-.01-.45ZM9.34 14.85l-.75 2.4-.72-2.3 8.72-6.9-7.25 6.8ZM18.92 17.5l-3.58-2.77a1.5 1.5 0 0 0-2.12.3l-.83 1.13.54-1.73L20 7.68l-1.08 9.83Z'/%3E%3C/svg%3E");
}

.contact-direct__icon--phone {
    --contact-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6.62 10.79a15.54 15.54 0 0 0 6.59 6.59l2.2-2.2a1 1 0 0 1 1.02-.24 11.36 11.36 0 0 0 3.57.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1C10.06 21 3 13.94 3 5a1 1 0 0 1 1-1h3.29a1 1 0 0 1 1 1c0 1.23.2 2.43.57 3.57a1 1 0 0 1-.24 1.02l-2 2.2Z'/%3E%3C/svg%3E");
}

.contact-direct__icon--email {
    --contact-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 6h16a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2Zm0 2v.01L12 13l8-4.99V8H4Zm16 8V10.3l-7.47 4.67a1 1 0 0 1-1.06 0L4 10.3V16h16Z'/%3E%3C/svg%3E");
}

.contact-band__form-wrap {
    min-width: 0;
}

.contact-request-form {
    display: grid;
    gap: 1rem;
    align-content: start;
}

.contact-request-form__grid {
    gap: 0.9rem;
}

.contact-request-form textarea {
    min-height: 7rem;
    resize: vertical;
}

.contact-copy {
    display: grid;
    gap: 1rem;
}

.contact-copy > p {
    margin: 0;
}

.contact-assurance {
    display: grid;
    gap: 0.85rem;
}

.contact-assurance__item {
    padding: 1rem 1.05rem;
    border-radius: 0.45rem;
    background: var(--card);
    border: 1px solid rgba(214, 220, 199, 0.6);
}

.contact-assurance__item strong,
.contact-summary dd {
    display: block;
    font-weight: 700;
}

.contact-assurance__item p,
.contact-summary__label {
    margin: 0.35rem 0 0;
    color: var(--muted);
}

.contact-summary {
    padding: 1.1rem;
    border-radius: 0.75rem;
    background:
        linear-gradient(135deg, rgba(27, 139, 104, 0.08), rgba(255, 255, 255, 0.96) 52%),
        rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(214, 220, 199, 0.84);
}

.contact-summary__label {
    margin: 0 0 0.8rem;
    font-size: 0.88rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.contact-summary__grid {
    display: grid;
    gap: 0.85rem;
    margin: 0;
}

.contact-summary__grid div {
    display: grid;
    gap: 0.18rem;
    padding-top: 0.8rem;
    border-top: 1px solid rgba(214, 220, 199, 0.7);
}

.contact-summary__grid div:first-child {
    padding-top: 0;
    border-top: 0;
}

.contact-summary dt {
    color: var(--muted);
    font-size: 0.9rem;
}

.contact-summary dd {
    margin: 0;
    font-size: 1rem;
    color: var(--ink);
}

.request-form {
    padding: 1rem;
    border-radius: 1rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(243, 244, 235, 0.92));
}

.request-form label span {
    display: block;
    margin-bottom: 0.45rem;
    color: var(--muted);
    font-size: 0.92rem;
}

.form-message {
    margin-top: 1rem;
    padding: 0.95rem 1rem;
    border-radius: 0.5rem;
}

.form-message--success {
    background: rgba(27, 139, 104, 0.12);
    color: var(--primary-strong);
}

.form-message--error {
    background: rgba(219, 111, 46, 0.14);
    color: var(--accent-strong);
}

.site-footer {
    padding: 1rem 0 2.5rem;
}

.legal-section {
    padding: clamp(2.25rem, 6vw, 4rem) 0 clamp(3rem, 7vw, 5rem);
}

.legal-container {
    max-width: 46rem;
}

.legal-back {
    display: inline-block;
    margin-bottom: 1.5rem;
    color: var(--muted);
    font-weight: 600;
}

.legal-back:hover,
.legal-back:focus-visible {
    color: var(--ink);
}

.legal-container h1 {
    margin-bottom: 1.75rem;
}

.legal-body {
    display: grid;
    gap: 1.75rem;
    color: var(--ink);
}

.legal-body h2 {
    margin-bottom: 0.6rem;
    font-size: 1.2rem;
}

.legal-body p {
    margin: 0;
}

.legal-body ul,
.legal-body ol {
    margin: 0.6rem 0 0;
    padding-left: 1.3rem;
    display: grid;
    gap: 0.4rem;
}

.legal-body__notice {
    padding: 0.9rem 1.1rem;
    border: 1px solid rgba(var(--primary-rgb), 0.2);
    border-radius: 0.7rem;
    background: rgba(var(--primary-rgb), 0.06);
    color: var(--muted);
    font-size: 0.92rem;
}

.footer-grid {
    display: grid;
    gap: 1rem;
    padding: 1.75rem 1.5rem;
    border-top: 1px solid rgba(214, 220, 199, 0.7);
    background: transparent;
}

.footer-list {
    padding: 0;
    margin: 0.8rem 0 0;
    list-style: none;
    color: var(--muted);
}

.footer-list li + li {
    margin-top: 0.5rem;
}

.footer-list a:hover,
.footer-list a:focus-visible {
    color: var(--ink);
    text-decoration: underline;
}

.city-dialog {
    width: min(68rem, calc(100% - 1rem));
    max-height: min(44rem, calc(100vh - 1rem));
    border: 0;
    padding: 1.2rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: var(--shadow-lift);
    overflow: auto;
}

.city-dialog::backdrop {
    background: rgba(31, 48, 39, 0.3);
    backdrop-filter: blur(4px);
}

.booking-dialog {
    width: min(60rem, calc(100% - 1.5rem));
    max-height: 92vh;
    border: 0;
    padding: clamp(1rem, 2.5vw, 1.75rem);
    border-radius: 1.4rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(248, 246, 239, 0.98));
    box-shadow: 0 36px 80px rgba(var(--ink-rgb), 0.18);
    overflow: auto;
}

.booking-dialog::backdrop {
    background: rgba(var(--ink-rgb), 0.34);
    backdrop-filter: blur(6px);
}

.review-dialog {
    width: min(100% - 1.5rem, 42rem);
    padding: clamp(1.2rem, 3vw, 1.7rem);
    border: 0;
    border-radius: 1.4rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(244, 245, 237, 0.96));
    box-shadow: 0 30px 80px rgba(var(--ink-rgb), 0.18);
}

.review-dialog::backdrop {
    background: rgba(var(--ink-rgb), 0.34);
    backdrop-filter: blur(6px);
}

.review-dialog__header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.review-dialog__header > div {
    display: grid;
    gap: 0.45rem;
}

.review-dialog__header h2,
.review-dialog__header p {
    margin: 0;
}

.review-dialog__header p {
    color: var(--muted);
}

.review-form {
    display: grid;
    gap: 1rem;
}

.review-form__grid {
    gap: 0.9rem;
}

.review-form textarea {
    min-height: 8rem;
    resize: vertical;
}

.review-form__message {
    margin-top: 0;
}

.review-form__field-error {
    color: var(--accent-strong);
    font-size: 0.8rem;
}

.review-form__footer {
    display: flex;
    justify-content: flex-start;
}

.booking-dialog__back {
    margin-bottom: 0.75rem;
}

.booking-dialog__header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.2rem;
}

.booking-dialog__header > div {
    display: grid;
    gap: 0.35rem;
}

.booking-dialog__header h2 {
    font-size: clamp(1.3rem, 2.6vw, 1.7rem);
}

.booking-dialog__header p,
.booking-summary__note,
.booking-calendar__timezone,
.booking-placeholder {
    margin: 0;
    color: var(--muted);
    font-size: 0.9rem;
}

.booking-dialog__error {
    margin-top: 0.3rem;
}

.booking-grid {
    display: grid;
    gap: 1.1rem;
    align-items: start;
}

/* Left column — Calendly-style estimate summary */
.booking-summary {
    display: grid;
    align-content: start;
    gap: 0.85rem;
    padding: 1.2rem;
    border-radius: 1.1rem;
    background: var(--surface);
    border: 1px solid rgba(214, 220, 199, 0.8);
}

.booking-summary__eyebrow {
    margin: 0;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--primary-strong);
}

.booking-summary__facts {
    display: grid;
    gap: 0.55rem;
}

.booking-summary__facts > div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.booking-summary__facts span {
    color: var(--muted);
    font-size: 0.92rem;
}

.booking-summary__facts strong {
    text-align: right;
    font-weight: 600;
}

.booking-breakdown {
    list-style: none;
    margin: 0;
    padding: 0.85rem 0;
    border-top: 1px solid rgba(214, 220, 199, 0.85);
    border-bottom: 1px solid rgba(214, 220, 199, 0.85);
    display: grid;
    gap: 0.5rem;
    /* Long add-on lists scroll inside the list itself, never the whole popup. */
    max-height: 12.5rem;
    overflow-y: auto;
    scrollbar-width: thin;
}

.booking-breakdown li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    font-size: 0.9rem;
    color: var(--muted);
}

.booking-breakdown li span:last-child {
    flex: none;
    color: var(--ink);
    font-weight: 500;
}

.booking-summary__total {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
}

.booking-summary__total span {
    color: var(--muted);
    font-size: 0.92rem;
}

.booking-summary__total strong {
    font-family: "Geologica", sans-serif;
    font-size: 1.5rem;
    line-height: 1;
    color: var(--primary-strong);
}

.booking-summary__slot {
    display: grid;
    gap: 0.2rem;
    padding: 0.7rem 0.85rem;
    border-radius: 0.8rem;
    background: rgba(255, 255, 255, 0.72);
}

.booking-summary__slot span {
    color: var(--muted);
    font-size: 0.85rem;
}

.booking-summary__slot strong {
    font-weight: 600;
}

/* Right column — stepped flow (date → details) */
.booking-main {
    min-width: 0;
}

.booking-step {
    display: none;
    gap: 1rem;
    grid-template-columns: 1fr;
}

.booking-step.is-active {
    display: grid;
}

.booking-calendar,
.booking-slots-block {
    padding: 1.1rem;
    border-radius: 1.1rem;
    background: var(--card);
    border: 1px solid rgba(214, 220, 199, 0.8);
}

.booking-slots-block__label {
    margin: 0 0 0.8rem;
    color: var(--ink);
    font-weight: 600;
}

.booking-slots-block__label.is-error {
    color: var(--accent-strong);
}

.booking-form-card {
    display: grid;
    gap: 0.95rem;
    max-width: 35rem;
    align-self: start;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.booking-form-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    flex-wrap: wrap;
}

.booking-form-card__intro {
    display: grid;
    gap: 0.4rem;
}

.booking-form-card__intro h3,
.booking-form-card__intro p,
.booking-form__footer p,
.booking-step-error,
.booking-form-error {
    margin: 0;
}

.booking-form-card__eyebrow {
    margin: 0;
    color: var(--primary-strong);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.booking-form-card__slot {
    display: grid;
    gap: 0.15rem;
    padding: 0.7rem 0.9rem;
    border-radius: 0.85rem;
    background: rgba(var(--primary-rgb), 0.08);
    border: 1px solid rgba(var(--primary-rgb), 0.12);
}

.booking-form-card__slot span {
    color: var(--muted);
    font-size: 0.8rem;
}

.booking-form-card__slot strong {
    font-size: 0.94rem;
}

.booking-form-card > .booking-back {
    display: inline-flex;
}

.booking-step[data-booking-step="details"] > .booking-back {
    display: none;
}

.booking-back {
    width: fit-content;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    white-space: nowrap;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--primary-strong);
    font-weight: 600;
    font-size: 0.9rem;
    transition: color 160ms var(--ease), opacity 160ms var(--ease);
}

.booking-back:hover {
    color: var(--primary);
    opacity: 0.9;
}

@media (min-width: 720px) {
    .process-row {
        --process-gap: 2rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1.25rem var(--process-gap);
    }

    .booking-grid {
        grid-template-columns: 18.5rem minmax(0, 1fr);
        align-items: start;
    }
}

@media (min-width: 920px) {
    .process-panel {
        padding: 1.65rem 2.15rem 1.85rem;
    }

    .process-row {
        --process-gap: 1.65rem;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1.8rem var(--process-gap);
    }

    .process-step:not(:last-child) .process-step__icon-wrap::after {
        display: block;
    }

    .booking-step[data-booking-step="date"] {
        grid-template-columns: minmax(0, 1fr) 12.5rem;
        grid-template-areas:
            "calendar slots"
            "continue continue";
        align-items: start;
    }

    .booking-step[data-booking-step="date"] .booking-calendar {
        grid-area: calendar;
    }

    .booking-step[data-booking-step="date"] .booking-slots-block {
        grid-area: slots;
        height: 100%;
    }

    .booking-step[data-booking-step="date"] [data-booking-continue] {
        grid-area: continue;
    }

    .booking-step[data-booking-step="date"] .booking-slots {
        grid-template-columns: 1fr;
    }

    .booking-form-card__head {
        align-items: center;
    }
}

.booking-calendar__head {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.9rem;
}

.booking-calendar__head strong {
    text-align: center;
    font-size: 1rem;
}

.calendar-nav {
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid rgba(214, 220, 199, 0.86);
    border-radius: 0.6rem;
    background: rgba(248, 246, 239, 0.92);
    color: var(--ink);
    font-size: 1.15rem;
}

.calendar-nav[disabled] {
    opacity: 0.45;
    cursor: default;
}

.booking-calendar__weekdays,
.booking-calendar__days {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.45rem;
}

.booking-calendar__weekdays {
    margin-bottom: 0.7rem;
}

.booking-calendar__weekdays span {
    text-align: center;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 600;
}

.calendar-day,
.calendar-day--placeholder {
    aspect-ratio: 1;
}

.calendar-day {
    position: relative;
    border: 1px solid rgba(214, 220, 199, 0.72);
    border-radius: 0.7rem;
    background: rgba(255, 255, 255, 0.96);
    color: var(--ink);
    font-weight: 600;
    transition: border-color 180ms var(--ease), background-color 180ms var(--ease), transform 180ms var(--ease), box-shadow 180ms var(--ease);
}

.calendar-day:hover {
    transform: translateY(-1px);
    border-color: rgba(var(--primary-rgb), 0.3);
}

.calendar-day.is-today::after {
    content: "";
    position: absolute;
    bottom: 0.45rem;
    left: 50%;
    width: 0.32rem;
    height: 0.32rem;
    border-radius: 50%;
    transform: translateX(-50%);
    background: rgba(var(--primary-rgb), 0.66);
}

.calendar-day.is-selected {
    border-color: transparent;
    background: rgba(var(--primary-rgb), 0.12);
    box-shadow: inset 0 0 0 1px rgba(var(--primary-rgb), 0.18);
    color: var(--primary-strong);
}

.calendar-day.is-disabled {
    background: rgba(244, 244, 240, 0.72);
    color: rgba(var(--ink-rgb), 0.36);
    cursor: default;
}

.calendar-day.is-disabled:hover {
    transform: none;
    border-color: rgba(214, 220, 199, 0.72);
}

.calendar-day--placeholder {
    border-radius: 0.7rem;
    background: transparent;
}

.booking-calendar__timezone {
    margin-top: 0.9rem;
    font-size: 0.88rem;
}

.booking-slots {
    display: grid;
    gap: 0.7rem;
}

.booking-slot {
    min-height: 3rem;
    border: 1px solid rgba(214, 220, 199, 0.82);
    border-radius: 0.7rem;
    background: rgba(255, 255, 255, 0.96);
    color: var(--ink);
    font-weight: 600;
}

.booking-slot:hover {
    border-color: rgba(var(--primary-rgb), 0.26);
}

.booking-slot.is-selected {
    border-color: transparent;
    background: linear-gradient(135deg, rgba(var(--primary-rgb), 0.16), rgba(255, 255, 255, 0.94));
    color: var(--primary-strong);
    box-shadow: inset 0 0 0 1px rgba(var(--primary-rgb), 0.2);
}

.booking-placeholder {
    padding: 0.9rem 0.2rem 0.1rem;
    font-size: 0.92rem;
}

.booking-custom-time {
    margin-top: 1rem;
    padding-top: 0.9rem;
    border-top: 1px solid rgba(214, 220, 199, 0.7);
}

.booking-custom-time__form {
    display: grid;
    gap: 0.6rem;
    margin-top: 0.7rem;
}

.booking-custom-time__form[hidden] {
    display: none;
}

.booking-custom-time__input {
    height: 2.9rem;
    padding: 0 0.9rem;
    border-radius: 0.7rem;
    border: 1px solid rgba(214, 220, 199, 0.85);
    background: var(--card);
    color: var(--ink);
}

.booking-custom-time__note {
    margin-top: 0.6rem;
    color: var(--muted);
    font-size: 0.85rem;
}

.booking-custom-time.is-custom-selected {
    border-top-color: rgba(var(--primary-rgb), 0.3);
}

.booking-form {
    padding: 1.1rem;
    border: 1px solid rgba(214, 220, 199, 0.82);
    border-radius: 1.1rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 247, 240, 0.92));
    box-shadow: none;
}

.booking-step-error,
.booking-form-error {
    padding: 0.8rem 0.95rem;
    border-radius: 0.75rem;
    border: 1px solid rgba(219, 111, 46, 0.24);
    background: rgba(219, 111, 46, 0.08);
    color: var(--accent-strong);
    font-size: 0.92rem;
    line-height: 1.45;
}

.booking-form__grid {
    gap: 0.95rem;
}

.booking-form .booking-field {
    position: relative;
    display: grid;
    gap: 0.45rem;
    align-content: start;
    min-width: 0;
    padding: 0 0 1.35rem;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.booking-field--full {
    grid-column: 1 / -1;
}

.booking-form .booking-field span {
    display: block;
    margin-bottom: 0;
    color: var(--muted);
    font-size: 0.9rem;
}

.booking-form .booking-field input,
.booking-form .booking-field textarea {
    width: 100%;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(214, 220, 199, 0.88);
    border-radius: 0.75rem;
    background: rgba(255, 255, 255, 0.98);
}

.booking-field input[aria-invalid="true"],
.booking-field textarea[aria-invalid="true"] {
    border-color: rgba(219, 111, 46, 0.45);
    background: rgba(255, 249, 246, 0.98);
}

.booking-field__error {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0;
    color: var(--accent-strong);
    font-size: 0.84rem;
    line-height: 1.35;
}

.booking-form__footer {
    display: grid;
    gap: 0.8rem;
    margin-top: 1rem;
}

.booking-form__footer p {
    color: var(--muted);
    font-size: 0.9rem;
}

.booking-form .button[disabled] {
    opacity: 0.55;
    cursor: default;
    transform: none;
    box-shadow: none;
}

.city-dialog__header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.1rem;
}

.city-dialog__header > div {
    display: grid;
    gap: 0.35rem;
}

.city-dialog__header h2,
.city-dialog__header p {
    margin: 0;
}

.city-picker {
    display: grid;
    gap: 1rem;
}

.city-picker__controls {
    display: grid;
    gap: 0.8rem;
}

.city-search {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 3.5rem;
    padding: 0 1rem;
    border: 1px solid rgba(214, 220, 199, 0.92);
    border-radius: 0.8rem;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.city-search__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.2rem;
    height: 1.2rem;
    color: var(--muted);
    flex-shrink: 0;
}

.city-search__icon svg {
    width: 100%;
    height: 100%;
}

.city-search input {
    width: 100%;
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--ink);
    font: inherit;
}

.city-search input:focus {
    outline: none;
}

.city-search:focus-within {
    border-color: rgba(var(--primary-rgb), 0.45);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.92),
        0 0 0 0.2rem rgba(var(--primary-rgb), 0.12);
}

.city-detect-button {
    min-height: 3.5rem;
}

.city-picker__caption {
    margin: 0;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 600;
}

.city-quick {
    display: grid;
    gap: 0.7rem;
}

.city-quick__list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.city-quick__chip {
    min-height: 2.6rem;
    padding: 0.55rem 0.95rem;
    border: 1px solid rgba(214, 220, 199, 0.92);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.96);
    color: var(--ink);
    font: inherit;
    font-weight: 600;
    transition:
        border-color 180ms var(--ease),
        color 180ms var(--ease),
        background-color 180ms var(--ease);
}

.city-quick__chip.is-active {
    border-color: rgba(var(--primary-rgb), 0.24);
    background: rgba(var(--primary-rgb), 0.12);
    color: var(--primary-strong);
}

.city-picker__layout {
    display: grid;
    gap: 0.9rem;
}

.city-panel {
    display: grid;
    gap: 0.9rem;
    min-height: 0;
    padding: 1rem;
    border: 1px solid rgba(214, 220, 199, 0.82);
    border-radius: 0.9rem;
    background: rgba(255, 255, 255, 0.76);
}

.city-region-list {
    display: grid;
    gap: 0.45rem;
    max-height: 16rem;
    overflow: auto;
}

.city-region-button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
    padding: 0.75rem 0.85rem;
    border: 1px solid rgba(214, 220, 199, 0.82);
    border-radius: 0.75rem;
    background: rgba(248, 246, 239, 0.72);
    color: var(--ink);
    text-align: left;
    transition:
        border-color 180ms var(--ease),
        background-color 180ms var(--ease),
        transform 180ms var(--ease);
}

.city-region-button strong,
.city-result strong,
.city-panel__title,
.city-panel__selected {
    margin: 0;
}

.city-region-button span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    height: 2rem;
    padding: 0 0.45rem;
    border-radius: 999px;
    background: rgba(var(--primary-rgb), 0.08);
    color: var(--primary-strong);
    font-size: 0.85rem;
    font-weight: 700;
}

.city-region-button.is-active {
    border-color: rgba(var(--primary-rgb), 0.2);
    background: rgba(var(--primary-rgb), 0.12);
}

.city-panel__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
}

.city-panel__head > div {
    display: grid;
    gap: 0.2rem;
}

.city-panel__title {
    font-size: 1.1rem;
}

.city-panel__selected {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.35rem;
    padding: 0.4rem 0.8rem;
    border-radius: 999px;
    background: rgba(var(--primary-rgb), 0.08);
    color: var(--primary-strong);
    font-size: 0.92rem;
    font-weight: 700;
}

.city-results {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
    gap: 0.35rem 1rem;
    align-content: start;
    max-height: 18rem;
    overflow: auto;
}

.city-result {
    display: grid;
    justify-items: start;
    gap: 0.22rem;
    width: 100%;
    padding: 0.45rem 0;
    border: 0;
    background: transparent;
    color: var(--ink);
    text-align: left;
    font: inherit;
}

.city-result span {
    color: var(--muted);
    font-size: 0.84rem;
}

.city-result.is-active strong,
.city-result:hover strong,
.city-result:focus-visible strong {
    color: var(--primary-strong);
}

.city-empty {
    display: grid;
    gap: 0.45rem;
    align-content: center;
    min-height: 12rem;
    padding: 1rem;
    border-radius: 0.8rem;
    background: rgba(248, 246, 239, 0.6);
    color: var(--muted);
}

.city-empty strong {
    color: var(--ink);
}

.dialog-close {
    width: 2.5rem;
    height: 2.5rem;
    border: 0;
    border-radius: 499.5px;
    background: var(--surface);
    color: var(--ink);
    font-size: 1.5rem;
}

.service-detail-dialog {
    width: min(64rem, calc(100vw - 2rem));
    padding: 0;
    border: 0;
    border-radius: 1.1rem;
    background: var(--card);
    box-shadow: 0 32px 80px rgba(var(--ink-rgb), 0.18);
}

.service-detail-dialog::backdrop {
    background: rgba(18, 30, 23, 0.42);
    backdrop-filter: blur(12px);
}

.service-detail-dialog__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1rem 0;
}

.service-detail-dialog__eyebrow {
    margin: 0;
    color: var(--primary);
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.service-detail {
    display: grid;
    gap: 1rem;
    padding: 0 1rem 1rem;
}

.service-detail__media {
    overflow: hidden;
    border-radius: 0.9rem;
    border: 1px solid rgba(214, 220, 199, 0.7);
    background: rgba(var(--surface-rgb), 0.7);
}

.service-detail__media img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
}

.service-detail__body {
    display: grid;
    gap: 1rem;
    align-content: start;
}

.service-detail__body h2,
.service-detail__description,
.service-detail__note,
.service-detail__facts {
    margin: 0;
}

.service-detail__description,
.service-detail__note {
    color: var(--muted);
}

.service-detail__facts {
    display: grid;
    gap: 0.8rem;
}

.service-detail__fact {
    display: grid;
    gap: 0.35rem;
    padding: 0.9rem 1rem;
    border-radius: 0.8rem;
    background: rgba(var(--surface-rgb), 0.6);
    border: 1px solid rgba(214, 220, 199, 0.7);
}

.service-detail__fact span {
    color: var(--muted);
    font-size: 0.9rem;
}

.service-detail__fact strong {
    font-family: "Geologica", sans-serif;
    font-size: 1.1rem;
}

.service-detail__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

[hidden] {
    display: none !important;
}

@media (min-width: 768px) {
    .container {
        width: min(var(--container), calc(100% - 3rem));
    }

    .city-picker__controls {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
    }

    .city-detect-button {
        min-width: 16rem;
    }

    .city-picker__layout {
        grid-template-columns: minmax(0, 16rem) minmax(0, 1fr);
        align-items: start;
    }

    .city-region-list,
    .city-results {
        max-height: 22rem;
    }

    .hero-grid,
    .contact-grid {
        grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
        gap: 2rem;
    }

    .benefits-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 2.5rem;
    }

    .about-layout {
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr);
        gap: 2rem;
        align-items: start;
    }

    .about-gallery {
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr);
        grid-template-areas:
            "main top"
            "main left"
            "main right";
        align-items: stretch;
    }

    .about-gallery__main {
        grid-area: main;
        min-height: 30rem;
    }

    .about-gallery__caption--top {
        grid-area: top;
    }

    .about-gallery__tile--left {
        grid-area: left;
    }

    .about-gallery__tile--right {
        grid-area: right;
    }

    .calculator-body {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

    .calc-field--area {
        grid-column: 1;
    }

    .calc-field--addons {
        grid-column: 2;
    }

    .estimate-card {
        grid-column: 1 / -1;
    }

    .request-form__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .contact-request-form__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .contact-summary__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 1rem;
    }

    .contact-summary__grid div:nth-child(2) {
        padding-top: 0;
        border-top: 0;
    }

    .services-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .reviews-grid,
    .footer-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .contact-band--consultation {
        grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    }

    .service-detail {
        grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
        align-items: stretch;
    }

    .booking-dialog {
        padding: 1.2rem;
    }

    .booking-dialog__layout {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-areas:
            "summary calendar"
            "slots slots"
            "form form";
    }

    .booking-dialog__summary {
        grid-area: summary;
    }

    .booking-dialog__calendar {
        grid-area: calendar;
    }

    .booking-dialog__slots {
        grid-area: slots;
    }

    .booking-form {
        grid-area: form;
    }
}

@media (min-width: 1024px) {
    .container {
        width: min(var(--container), calc(100% - 4rem));
    }

    .main-nav {
        display: flex;
    }

    .topbar {
        flex-wrap: nowrap;
    }

    .header-actions {
        width: auto;
    }

    .header-cta {
        display: inline-flex;
    }

    .header-actions .language-switcher {
        display: flex;
    }

    .city-chip {
        padding-right: 0.85rem;
    }

    .city-chip__content {
        display: flex;
        align-items: center;
        gap: 0.35rem;
    }

    .city-chip__label {
        display: none;
    }

    .language-switcher {
        min-height: 3rem;
    }

    .menu-toggle,
    .mobile-menu {
        display: none;
    }

    .hero-section {
        padding-top: 3rem;
        padding-bottom: 7rem;
    }

    .hero-grid {
        grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
        align-items: start;
    }

    .hero-description {
        font-size: 1.08rem;
    }

    .hero-media {
        min-height: clamp(38.5rem, 52vw, 45.5rem);
        margin-bottom: -8rem;
    }

    .hero-media__shape {
        inset: auto;
        top: -80px;
        left: 20%;
        width: 200%;
        height: 100%;
        transform: scale(1.5) translate(10px, 10px);
    }

    .hero-floating-card {
        left: 1.5rem;
        bottom: 1.5rem;
    }

    .services-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .calculator-body {
        grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) minmax(0, 1fr);
        align-items: stretch;
    }

    .calc-field--area {
        grid-column: 1;
    }

    .calc-field--addons {
        grid-column: 2;
    }

    .estimate-card {
        grid-column: 3;
    }

    .process-row {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .reviews-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .benefits-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 0;
    }

    .benefit-item {
        border-left: 1px solid rgba(214, 220, 199, 0.7);
    }

    .benefit-item:first-child {
        border-left: none;
    }

    .contact-band--consultation {
        grid-template-columns: minmax(0, 0.76fr) minmax(0, 1.04fr);
        padding: 1.45rem 1.5rem;
        align-items: center;
    }

    .booking-dialog__layout {
        grid-template-columns: minmax(18rem, 20rem) minmax(0, 1fr) minmax(15rem, 16rem);
        grid-template-areas:
            "summary calendar slots"
            "summary form form";
        align-items: start;
    }
}

@media (prefers-reduced-motion: reduce) {
    html,
    .slider__track {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}