/* =========================================================
   DIGITALCRAFT STUDIO ? GLOBAL
   ========================================================= */

:root {
    --yellow: #ffb400;
    --yellow-light: #ffd15a;
    --yellow-soft: #fff6dc;

    --black: #111214;
    --text: #202124;
    --muted: #656565;

    --white: #ffffff;
    --background: #fffefa;

    --border: rgba(20, 20, 20, 0.085);

    --header-height: clamp(88px, 6.2vw, 112px);
    --page-space: clamp(28px, 3.7vw, 74px);

    --shadow-card:
        0 22px 55px rgba(25, 23, 16, 0.09),
        0 5px 15px rgba(25, 23, 16, 0.035);

    --transition:
        260ms cubic-bezier(0.22, 1, 0.36, 1);
}

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

html {
    width: 100%;
    min-width: 320px;

    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--header-height) + 20px);
}

body {
    width: 100%;
    min-width: 320px;
    margin: 0;

    overflow-x: hidden;

    background: var(--background);
    color: var(--text);

    font-family:
        "Segoe UI",
        Arial,
        Helvetica,
        sans-serif;

    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body.menu-open {
    overflow: hidden;
}

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

button {
    font: inherit;
}

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

.page-anchor {
    height: 1px;
    scroll-margin-top: calc(var(--header-height) + 20px);
}


/* =========================================================
   HEADER
   ========================================================= */

.site-header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1000;

    width: 100%;
    height: var(--header-height);

    background: rgba(255, 255, 255, 0.985);
    border-bottom: 1px solid rgba(20, 20, 20, 0.045);

    transition:
        height var(--transition),
        border-color var(--transition),
        box-shadow var(--transition);
}

.site-header.is-scrolled {
    height: clamp(76px, 5vw, 92px);

    border-bottom-color: rgba(20, 20, 20, 0.08);

    box-shadow:
        0 12px 32px rgba(24, 24, 24, 0.065);
}

.site-header__inner {
    position: relative;

    width: 100%;
    height: 100%;
    padding-inline: var(--page-space);

    display: grid;
    grid-template-columns:
        minmax(250px, 0.95fr)
        minmax(520px, 1.4fr)
        minmax(340px, 1.1fr);

    align-items: center;
}

.site-header__brand {
    width: clamp(235px, 16.5vw, 335px);

    display: inline-flex;
    align-items: center;
}

.site-header__brand img {
    width: 100%;
    height: auto;
}

.site-header__navigation {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(16px, 1.25vw, 26px);
}

.site-header__navigation > a,
.site-header__dropdown-toggle {
    position: relative;

    padding: 12px 0;

    color: #292929;

    font-size: clamp(13px, 0.84vw, 17px);
    line-height: 1;
    font-weight: 550;
    white-space: nowrap;

    transition: color var(--transition);
}

.site-header__navigation > a::after,
.site-header__dropdown-toggle::after {
    content: "";

    position: absolute;
    right: 0;
    bottom: 4px;
    left: 0;

    height: 2px;

    border-radius: 999px;
    background: var(--yellow);

    transform: scaleX(0);
    transform-origin: right center;

    transition: transform var(--transition);
}

.site-header__navigation > a:hover,
.site-header__navigation > a:focus-visible,
.site-header__dropdown-toggle:hover,
.site-header__dropdown-toggle:focus-visible,
.site-header__dropdown.is-open
.site-header__dropdown-toggle {
    color: #a87300;
    outline: none;
}

.site-header__navigation > a:hover::after,
.site-header__navigation > a:focus-visible::after,
.site-header__dropdown-toggle:hover::after,
.site-header__dropdown-toggle:focus-visible::after,
.site-header__dropdown.is-open
.site-header__dropdown-toggle::after {
    transform: scaleX(1);
    transform-origin: left center;
}

.site-header__navigation > a[aria-current="page"],
.site-header__navigation
.site-header__dropdown.is-current:not(.is-open)
.site-header__dropdown-toggle {
    color: #a87300;
    outline: none;
}

.site-header__navigation > a[aria-current="page"]::after,
.site-header__navigation
.site-header__dropdown.is-current:not(.is-open)
.site-header__dropdown-toggle::after {
    transform: scaleX(1);
    transform-origin: left center;
}

.site-header__dropdown {
    position: relative;
}

.site-header__dropdown-toggle {
    min-height: 42px;

    display: inline-flex;
    align-items: center;

    gap: 7px;

    border: 0;
    background: transparent;

    cursor: pointer;
}

.site-header__dropdown-chevron {
    display: inline-flex;

    font-size: 15px;
    line-height: 1;

    transform: translateY(-2px);

    transition:
        transform var(--transition);
}

.site-header__dropdown.is-open
.site-header__dropdown-chevron {
    transform:
        translateY(1px)
        rotate(180deg);
}

.site-header__dropdown-menu {
    position: absolute;
    top: calc(100% + 14px);
    left: 50%;
    z-index: 1200;

    width: min(330px, 82vw);
    padding: 10px;

    border: 1px solid rgba(20, 20, 20, 0.075);
    border-radius: 18px;

    background: rgba(255, 255, 255, 0.99);

    box-shadow:
        0 24px 58px rgba(25, 23, 16, 0.15),
        0 5px 14px rgba(25, 23, 16, 0.04);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transform:
        translate(-50%, -8px)
        scale(0.98);

    transition:
        opacity var(--transition),
        visibility var(--transition),
        transform var(--transition);
}

.site-header__dropdown.is-open
.site-header__dropdown-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;

    transform:
        translate(-50%, 0)
        scale(1);
}

.site-header__dropdown-menu a {
    padding: 15px 16px;

    display: block;

    border: 1px solid rgba(239, 170, 0, 0.08);
    border-radius: 13px;

    background: #fffaf0;
}

.site-header__dropdown-menu a::after {
    display: none;
}

.site-header__navigation
.site-header__dropdown-menu a[aria-current="page"] {
    border-color: rgba(239, 170, 0, 0.28);

    background:
        linear-gradient(
            180deg,
            rgba(255, 246, 214, 0.98) 0%,
            rgba(255, 255, 255, 0.98) 100%
        );
}

.site-header__navigation
.site-header__dropdown-menu a[aria-current="page"] strong {
    color: #7f5a00;
}

.site-header__dropdown-menu strong,
.site-header__dropdown-menu span {
    display: block;
}

.site-header__dropdown-menu strong {
    color: #1d1d1d;

    font-size: 14px;
    line-height: 1.25;
    font-weight: 700;
}

.site-header__dropdown-menu span {
    margin-top: 5px;

    color: #707070;

    font-size: 12px;
    line-height: 1.35;
}

.site-header__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 13px;
}

.site-header__project {
    min-width: clamp(190px, 13vw, 245px);
    min-height: clamp(52px, 3.5vw, 66px);
    padding: 0 clamp(20px, 1.4vw, 29px);

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            var(--yellow-light),
            var(--yellow)
        );

    color: #151515;

    font-size: clamp(14px, 0.9vw, 18px);
    line-height: 1;
    font-weight: 680;
    white-space: nowrap;

    box-shadow:
        0 15px 32px rgba(240, 174, 0, 0.21);

    transition:
        transform var(--transition),
        box-shadow var(--transition);
}

.site-header__project img {
    width: 22px;
    height: 22px;
    object-fit: contain;

    transition: transform var(--transition);
}

.site-header__project:hover,
.site-header__project:focus-visible {
    transform: translateY(-3px);

    box-shadow:
        0 19px 38px rgba(240, 174, 0, 0.29);

    outline: none;
}

.site-header__project:hover img {
    transform: translate(4px, -4px);
}

.site-header__whatsapp {
    min-width: clamp(148px, 10.4vw, 188px);
    min-height: clamp(52px, 3.5vw, 66px);
    padding:
        0
        clamp(17px, 1.2vw, 23px);

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: clamp(10px, 0.72vw, 14px);

    border: 1px solid var(--border);
    border-radius: 14px;
    background: #ffffff;
    color: #202020;

    font-size: clamp(13px, 0.82vw, 16px);
    line-height: 1;
    font-weight: 680;
    white-space: nowrap;

    box-shadow:
        0 10px 25px rgba(24, 24, 24, 0.07);

    transition:
        transform var(--transition),
        border-color var(--transition),
        box-shadow var(--transition);
}

.site-header__whatsapp img {
    width: clamp(22px, 1.5vw, 28px);
    height: clamp(22px, 1.5vw, 28px);
    object-fit: contain;
}

.site-header__whatsapp-label {
    display: inline-block;
}

.site-header__whatsapp:hover,
.site-header__whatsapp:focus-visible {
    transform: translateY(-3px);

    border-color: rgba(240, 174, 0, 0.35);

    box-shadow:
        0 16px 32px rgba(24, 24, 24, 0.1);

    outline: none;
}

.site-header__toggle {
    position: relative;

    width: 52px;
    height: 52px;
    padding: 0;

    display: none;

    border: 1px solid var(--border);
    border-radius: 14px;
    background: #ffffff;

    cursor: pointer;
}

.site-header__toggle span {
    position: absolute;
    left: 50%;

    width: 24px;
    height: 2px;

    border-radius: 999px;
    background: #181818;

    transform: translateX(-50%);

    transition:
        top var(--transition),
        opacity var(--transition),
        transform var(--transition);
}

.site-header__toggle span:nth-child(1) {
    top: 17px;
}

.site-header__toggle span:nth-child(2) {
    top: 24px;
}

.site-header__toggle span:nth-child(3) {
    top: 31px;
}

.site-header__toggle.is-active span:nth-child(1) {
    top: 24px;

    transform:
        translateX(-50%)
        rotate(45deg);
}

.site-header__toggle.is-active span:nth-child(2) {
    opacity: 0;
}

.site-header__toggle.is-active span:nth-child(3) {
    top: 24px;

    transform:
        translateX(-50%)
        rotate(-45deg);
}


/* =========================================================
   HERO
   ========================================================= */

.hero {
    position: relative;
    isolation: isolate;

    width: 100%;
    min-height: 100svh;
    padding-top: var(--header-height);

    overflow: hidden;

    background:
        linear-gradient(
            107deg,
            #ffffff 0%,
            #fffefa 48%,
            #fff8e8 100%
        );
}

.hero__background {
    position: absolute;
    inset: 0;
    z-index: -2;

    pointer-events: none;
    overflow: hidden;
}

.hero__glow {
    position: absolute;
    top: 4%;
    right: -6%;

    width: clamp(650px, 58vw, 1180px);
    aspect-ratio: 1;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255, 196, 38, 0.2) 0%,
            rgba(255, 214, 105, 0.08) 43%,
            transparent 71%
        );
}

.hero__circle {
    position: absolute;

    border: 1px solid rgba(239, 170, 0, 0.11);
    border-radius: 50%;
}

.hero__circle--outer {
    top: 8%;
    right: -5%;

    width: clamp(650px, 58vw, 1180px);
    aspect-ratio: 1;
}

.hero__circle--middle {
    top: 14%;
    right: 1%;

    width: clamp(550px, 49vw, 1000px);
    aspect-ratio: 1;
}

.hero__circle--inner {
    top: 20%;
    right: 7%;

    width: clamp(450px, 40vw, 820px);
    aspect-ratio: 1;
}

.hero__dots {
    position: absolute;
    right: 3%;
    bottom: 11%;

    width: clamp(150px, 12vw, 250px);
    height: clamp(100px, 9vw, 180px);

    opacity: 0.32;

    background-image:
        radial-gradient(
            circle,
            rgba(239, 170, 0, 0.26) 1.3px,
            transparent 1.5px
        );

    background-size: 13px 13px;
}

.hero__inner {
    position: relative;
    z-index: 2;

    width: 100%;
    min-height:
        calc(100svh - var(--header-height));

    padding:
        clamp(34px, 2.8vw, 58px)
        var(--page-space)
        clamp(26px, 2vw, 42px);

    display: grid;
    grid-template-columns:
        minmax(470px, 40.5%)
        minmax(0, 59.5%);
    grid-template-rows:
        minmax(0, 1fr)
        auto;

    column-gap: clamp(5px, 1vw, 22px);

    align-items: center;
}

.hero__copy {
    position: relative;
    z-index: 5;

    grid-column: 1;
    grid-row: 1;

    width: 100%;
    max-width: clamp(620px, 40vw, 810px);
    padding:
        clamp(4px, 1vw, 18px)
        clamp(18px, 1.2vw, 28px)
        clamp(24px, 2vw, 38px)
        0;
}

.hero__badge {
    width: fit-content;
    min-height: 43px;
    margin-bottom: clamp(28px, 2vw, 40px);
    padding: 8px 17px;

    display: inline-flex;
    align-items: center;
    gap: 11px;

    border: 1px solid rgba(239, 170, 0, 0.13);
    border-radius: 999px;
    background: rgba(255, 247, 226, 0.92);

    color: #252525;

    font-size: clamp(11px, 0.72vw, 14px);
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.hero__badge img {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.hero__title {
    margin: 0;

    color: var(--black);

    font-size: clamp(55px, 4.2vw, 84px);
    line-height: 0.99;
    font-weight: 670;
    letter-spacing: -0.052em;
}

.hero__title-line {
    display: block;
}

.hero__title-line--accent {
    margin-top: 0.16em;

    color: var(--yellow);
}

.hero__description {
    width: min(96%, 700px);
    margin: clamp(28px, 2vw, 40px) 0 0;

    color: var(--muted);

    font-size: clamp(17px, 1.08vw, 21px);
    line-height: 1.55;
    font-weight: 400;
    letter-spacing: -0.012em;
}

.hero__actions {
    margin-top: clamp(29px, 2.1vw, 42px);

    display: flex;
    align-items: center;
    gap: 15px;
}

.hero-button {
    min-height: clamp(57px, 3.8vw, 72px);
    padding: 0 clamp(24px, 1.9vw, 38px);

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;

    border-radius: 14px;

    font-size: clamp(15px, 0.94vw, 18px);
    line-height: 1;
    font-weight: 680;
    white-space: nowrap;

    transition:
        transform var(--transition),
        border-color var(--transition),
        background var(--transition),
        box-shadow var(--transition);
}

.hero-button img {
    width: 23px;
    height: 23px;
    object-fit: contain;
}

.hero-button--primary {
    min-width: clamp(220px, 14.5vw, 285px);

    justify-content: space-between;

    background:
        linear-gradient(
            135deg,
            var(--yellow-light),
            var(--yellow)
        );

    color: #151515;

    box-shadow:
        0 16px 34px rgba(240, 174, 0, 0.24);
}

.hero-button--secondary {
    min-width: clamp(205px, 13.5vw, 265px);

    border: 1px solid rgba(20, 20, 20, 0.12);
    background: rgba(255, 255, 255, 0.88);

    color: #202020;

    box-shadow:
        0 10px 26px rgba(24, 24, 24, 0.045);
}

.hero-button:hover,
.hero-button:focus-visible {
    transform: translateY(-4px);
    outline: none;
}

.hero-button--primary:hover,
.hero-button--primary:focus-visible {
    box-shadow:
        0 22px 42px rgba(240, 174, 0, 0.33);
}

.hero-button--secondary:hover,
.hero-button--secondary:focus-visible {
    border-color: rgba(239, 170, 0, 0.42);
    background: #ffffff;

    box-shadow:
        0 17px 35px rgba(24, 24, 24, 0.075);
}


/* =========================================================
   HERO ADVANTAGES
   ========================================================= */

.hero__advantages-shell {
    width: min(100%, 760px);
    margin-top: clamp(34px, 2.5vw, 49px);
}

.hero__advantages {
    width: 100%;

    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.hero-advantage {
    position: relative;

    min-width: 0;
    padding-right: clamp(12px, 1.05vw, 21px);

    display: flex;
    flex-direction: column;
    gap: 11px;
}

.hero-advantage:not(:first-child) {
    padding-left: clamp(12px, 1.05vw, 21px);
}

.hero-advantage:not(:last-child)::after {
    content: "";

    position: absolute;
    top: 7px;
    right: 0;

    width: 1px;
    height: calc(100% - 14px);

    background: rgba(20, 20, 20, 0.09);
}

.hero-advantage__icon {
    width: clamp(45px, 2.9vw, 57px);
    aspect-ratio: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(239, 170, 0, 0.12);
    border-radius: 50%;
    background: var(--yellow-soft);
}

.hero-advantage__icon img {
    width: 68%;
    height: 68%;
    object-fit: contain;
}

.hero-advantage strong {
    display: block;

    color: #171717;

    font-size: clamp(12px, 0.73vw, 14px);
    line-height: 1.25;
    font-weight: 700;
}

.hero-advantage span {
    display: block;
    margin-top: 5px;

    color: #737373;

    font-size: clamp(10px, 0.62vw, 12px);
    line-height: 1.4;
}

.hero__advantages-tools,
.hero__trust-tools {
    display: none;
}


/* =========================================================
   HERO VISUAL
   ========================================================= */

.hero__visual {
    position: relative;
    z-index: 3;

    grid-column: 2;
    grid-row: 1;

    min-width: 0;
    width: 100%;
    align-self: stretch;

    display: flex;
    align-items: center;
    justify-content: center;
}

.hero__stage {
    position: relative;
    isolation: isolate;

    width: 100%;
    height: clamp(560px, 39vw, 810px);
}

.hero__image-glow {
    position: absolute;
    z-index: -1;
    top: 5%;
    right: 0;

    width: 85%;
    aspect-ratio: 1;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255, 193, 35, 0.2),
            rgba(255, 217, 119, 0.07) 48%,
            transparent 72%
        );
}

.hero__main-image {
    position: absolute;
    top: 50%;
    left: -8%;
    z-index: 2;

    width: 116%;
    max-width: none;
    height: auto;

    object-fit: contain;

    filter:
        drop-shadow(
            0 28px 27px rgba(20, 18, 13, 0.14)
        );

    transform: translateY(-50%);

    animation:
        hero-object-float 7s ease-in-out infinite alternate;
}

.hero-trust-card {
    position: absolute;
    top: 17%;
    right: 0.5%;
    z-index: 7;

    width: clamp(220px, 14.5vw, 285px);
    padding: clamp(18px, 1.25vw, 25px);

    border: 1px solid rgba(20, 20, 20, 0.07);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.97);

    box-shadow: var(--shadow-card);
}

.hero-trust-card__head {
    padding-bottom: 16px;

    display: flex;
    align-items: center;
    gap: 12px;

    border-bottom: 1px solid rgba(20, 20, 20, 0.08);
}

.hero-trust-card__head img {
    width: 40px;
    height: 40px;
    object-fit: contain;
}

.hero-trust-card__head strong,
.hero-trust-card__head span {
    display: block;
}

.hero-trust-card__head strong {
    color: #171717;

    font-size: clamp(14px, 0.86vw, 17px);
    line-height: 1.2;
    font-weight: 700;
}

.hero-trust-card__head span {
    margin-top: 4px;

    color: #747474;

    font-size: clamp(11px, 0.68vw, 13px);
    line-height: 1.2;
}

.hero-trust-card ul {
    margin: 16px 0 0;
    padding: 0;

    display: grid;
    gap: 13px;

    list-style: none;
}

.hero-trust-card li {
    display: flex;
    align-items: center;
    gap: 10px;

    color: #303030;

    font-size: clamp(11px, 0.7vw, 14px);
    line-height: 1.25;
    font-weight: 580;
}

.hero-trust-card li img {
    width: 21px;
    height: 21px;
    object-fit: contain;
}

@keyframes hero-object-float {
    from {
        transform: translateY(-50%);
    }

    to {
        transform: translateY(calc(-50% - 7px));
    }
}


/* =========================================================
   HERO TRUST STRIP
   ========================================================= */

.hero__trust-shell {
    position: relative;
    z-index: 10;

    grid-column: 1 / -1;
    grid-row: 2;

    width: 100%;
    margin-top: clamp(-31px, -1.5vw, -17px);
}

.hero__trust-strip {
    width: 100%;
    min-height: clamp(92px, 6.5vw, 124px);
    padding:
        clamp(18px, 1.3vw, 26px)
        clamp(20px, 1.8vw, 36px);

    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    border: 1px solid rgba(20, 20, 20, 0.07);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.97);

    box-shadow:
        0 19px 48px rgba(24, 22, 15, 0.075);
}

.hero-trust-item {
    position: relative;

    min-width: 0;
    padding-inline: clamp(14px, 1.25vw, 25px);

    display: flex;
    align-items: center;
    gap: clamp(12px, 0.95vw, 19px);
}

.hero-trust-item:first-child {
    padding-left: 0;
}

.hero-trust-item:last-child {
    padding-right: 0;
}

.hero-trust-item:not(:last-child)::after {
    content: "";

    position: absolute;
    top: 13%;
    right: 0;

    width: 1px;
    height: 74%;

    background: rgba(20, 20, 20, 0.085);
}

.hero-trust-item > img {
    width: clamp(31px, 2vw, 40px);
    height: clamp(31px, 2vw, 40px);

    flex: 0 0 auto;
    object-fit: contain;
}

.hero-trust-item strong,
.hero-trust-item span {
    display: block;
}

.hero-trust-item strong {
    color: #202020;

    font-size: clamp(12px, 0.82vw, 16px);
    line-height: 1.25;
    font-weight: 680;
}

.hero-trust-item span {
    margin-top: 5px;

    color: #747474;

    font-size: clamp(10px, 0.66vw, 13px);
    line-height: 1.35;
}


/* =========================================================
   HERO ANIMATIONS
   ========================================================= */

.hero.hero--js [data-hero-reveal] {
    opacity: 0;

    transform: translateY(30px);

    transition:
        opacity 760ms ease,
        transform 760ms cubic-bezier(0.22, 1, 0.36, 1);
}

.hero.hero--js [data-hero-reveal="visual"] {
    transform: translateX(45px);
}

.hero.hero--js.is-visible [data-hero-reveal] {
    opacity: 1;
    transform: translate(0, 0);
}

.hero.hero--js.is-visible [data-hero-reveal="title"] {
    transition-delay: 80ms;
}

.hero.hero--js.is-visible [data-hero-reveal="description"] {
    transition-delay: 150ms;
}

.hero.hero--js.is-visible [data-hero-reveal="actions"] {
    transition-delay: 220ms;
}

.hero.hero--js.is-visible [data-hero-reveal="advantages"] {
    transition-delay: 290ms;
}

.hero.hero--js.is-visible [data-hero-reveal="visual"] {
    transition-delay: 120ms;
}

.hero.hero--js.is-visible [data-hero-reveal="trust"] {
    transition-delay: 340ms;
}


/* =========================================================
   RESPONSIVE ? 1500
   ========================================================= */

@media (max-width: 1500px) and (min-width: 1181px) {
    :root {
        --header-height: 96px;
        --page-space: 42px;
    }

    .site-header__inner {
        grid-template-columns:
            minmax(235px, 0.9fr)
            minmax(470px, 1.32fr)
            minmax(315px, 1fr);
    }

    .site-header__brand {
        width: 250px;
    }

    .site-header__navigation {
        gap: 18px;
    }

    .site-header__project {
        min-width: 205px;
        min-height: 56px;

        font-size: 14px;
    }

    .site-header__whatsapp {
        width: 56px;
        min-width: 56px;
        min-height: 56px;
        padding-inline: 0;
    }

    .site-header__whatsapp-label {
        display: none;
    }

    .hero__inner {
        padding-top: 36px;

        grid-template-columns:
            minmax(430px, 41%)
            minmax(0, 59%);
    }

    .hero__copy {
        padding-right: 18px;
    }

    .hero__title {
        font-size: clamp(56px, 4.25vw, 66px);
    }

    .hero__description {
        font-size: 17px;
    }

    .hero__stage {
        height: clamp(555px, 42vw, 650px);
    }

    .hero__main-image {
        left: -9%;

        width: 119%;
    }

    .hero-trust-card {
        right: 0;

        width: 230px;
    }

    .hero__trust-strip {
        min-height: 96px;
    }
}


/* =========================================================
   RESPONSIVE ? 1180
   ========================================================= */

@media (max-width: 1180px) {
    :root {
        --header-height: 90px;
        --page-space: 30px;
    }

    .site-header__inner {
        grid-template-columns: 1fr auto;
    }

    .site-header__brand {
        width: 245px;
    }

    .site-header__navigation {
        position: fixed;
        top: calc(var(--header-height) + 10px);
        right: 20px;
        left: 20px;
        z-index: 1100;

        max-height:
            calc(
                100dvh - var(--header-height) - 30px
                - env(safe-area-inset-bottom)
            );

        padding:
            14px
            14px
            calc(14px + env(safe-area-inset-bottom));

        display: grid;
        gap: 0;

        border: 1px solid var(--border);
        border-radius: 20px;
        background: #ffffff;

        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-gutter: stable;
        -webkit-overflow-scrolling: touch;

        box-shadow:
            0 24px 65px rgba(18, 18, 18, 0.16);

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        transform:
            translateY(-15px)
            scale(0.98);

        transition:
            opacity var(--transition),
            visibility var(--transition),
            transform var(--transition);
    }

    .site-header__navigation.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;

        transform:
            translateY(0)
            scale(1);
    }

    .site-header__navigation > a {
        padding: 16px 14px;

        border-bottom: 1px solid rgba(20, 20, 20, 0.07);

        font-size: 16px;
    }

    .site-header__navigation > a:last-child {
        border-bottom: 0;
    }

    .site-header__navigation > a::after {
        display: none;
    }

    .site-header__dropdown {
        width: 100%;
    }

    .site-header__dropdown-toggle {
        width: 100%;
        min-height: 0;

        padding:
            16px
            14px;

        justify-content: space-between;

        border-bottom:
            1px solid rgba(20, 20, 20, 0.07);

        font-size: 16px;
        text-align: left;
    }

    .site-header__dropdown-toggle::after {
        display: none;
    }

    .site-header__dropdown-menu {
        position: static;

        width: 100%;
        max-height: 0;

        padding:
            0
            9px;

        overflow: hidden;

        border: 0;
        border-radius: 0;

        background: transparent;

        box-shadow: none;

        opacity: 1;
        visibility: visible;
        pointer-events: none;

        transform: none;

        transition:
            max-height var(--transition),
            padding var(--transition);
    }

    .site-header__dropdown.is-open
    .site-header__dropdown-menu {
        max-height: 240px;

        padding:
            8px
            9px
            10px;

        transform: none;

        pointer-events: auto;
    }

    .site-header__dropdown-menu a {
        padding:
            13px
            14px;
    }

    .site-header__toggle {
        display: block;
    }

    .hero {
        min-height: 0;
    }

    .hero__inner {
        min-height: 0;
        padding:
            55px
            var(--page-space)
            45px;

        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        gap: 20px;
    }

    .hero__copy {
        grid-column: 1;
        grid-row: 1;

        max-width: 850px;
        padding: 0;
    }

    .hero__title {
        font-size: clamp(58px, 6.4vw, 76px);
    }

    .hero__description {
        max-width: 760px;

        font-size: 18px;
    }

    .hero__advantages-shell {
        max-width: 820px;
    }

    .hero__visual {
        grid-column: 1;
        grid-row: 2;

        width: 100%;
    }

    .hero__stage {
        height: clamp(610px, 64vw, 740px);
    }

    .hero__main-image {
        left: 0;

        width: 100%;
        height: auto;

        object-fit: contain;
    }

    .hero-trust-card {
        top: 15%;
        right: 3%;

        width: 245px;
    }

    .hero__trust-shell {
        grid-column: 1;
        grid-row: 3;

        margin-top: -30px;
    }

    .hero__trust-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px 0;
    }

    .hero-trust-item:nth-child(2)::after {
        display: none;
    }

    .hero-trust-item:nth-child(3) {
        padding-left: 0;
    }
}


/* =========================================================
   RESPONSIVE ? 900
   ========================================================= */

@media (max-width: 900px) {
    :root {
        --page-space: 24px;
    }

    .site-header__project {
        display: none;
    }

    .hero__title {
        font-size: clamp(52px, 8vw, 68px);
    }

    .hero__stage {
        height: clamp(520px, 67vw, 620px);
    }

    .hero__main-image {
        left: 0;

        width: 100%;
        height: auto;

        object-fit: contain;
    }

    .hero-trust-card {
        top: 10%;
        right: 1%;

        width: 225px;
    }
}


/* =========================================================
   RESPONSIVE ? 620
   ========================================================= */

@media (max-width: 620px) {
    :root {
        --header-height: 76px;
        --page-space: 18px;
    }

    .site-header__inner {
        padding-inline: 16px;
    }

    .site-header__brand {
        width: 202px;
    }

    .site-header__whatsapp {
        min-width: 0;
        width: 47px;
        height: 47px;
        padding: 0;

        border-radius: 13px;
    }

    .site-header__whatsapp-label {
        display: none;
    }

    .site-header__toggle {
        width: 47px;
        height: 47px;

        border-radius: 13px;
    }

    .site-header__toggle span:nth-child(1) {
        top: 15px;
    }

    .site-header__toggle span:nth-child(2) {
        top: 22px;
    }

    .site-header__toggle span:nth-child(3) {
        top: 29px;
    }

    .site-header__toggle.is-active span:nth-child(1),
    .site-header__toggle.is-active span:nth-child(3) {
        top: 22px;
    }

    .site-header__navigation {
        top: calc(var(--header-height) + 8px);
        right: 8px;
        left: 8px;

        border-radius: 18px;
    }

    .hero__circle,
    .hero__dots {
        display: none;
    }

    .hero__inner {
        width: 100%;
        min-width: 0;
        min-height: 0;
        padding:
            36px
            var(--page-space)
            32px;

        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .hero__copy {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        padding: 0;
    }

    .hero__badge {
        min-height: 38px;
        margin-bottom: 22px;
        padding: 7px 13px;

        font-size: 10px;
        letter-spacing: 0.12em;
    }

    .hero__badge img {
        width: 21px;
        height: 21px;
    }

    .hero__title {
        width: 100%;
        max-width: 100%;
        margin: 0;

        font-size: clamp(38px, 10vw, 44px);
        line-height: 1.04;
        letter-spacing: -0.045em;
    }

    .hero__title-line {
        width: 100%;
        max-width: 100%;

        white-space: normal;
        overflow-wrap: normal;
    }

    .hero__description {
        width: 100%;
        max-width: 100%;
        margin-top: 23px;

        font-size: 16px;
        line-height: 1.52;
    }

    .hero__actions {
        width: 100%;
        max-width: 100%;
        margin-top: 25px;

        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .hero-button,
    .hero-button--primary,
    .hero-button--secondary {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        min-height: 59px;
        padding: 0 20px;

        flex: 0 0 auto;
        justify-content: space-between;
    }

    .hero-button > span {
        min-width: 0;

        white-space: nowrap;
    }

    .hero-button img {
        flex: 0 0 auto;
    }

    .hero__advantages-shell {
        width: calc(100% + 18px);
        max-width: none;
        margin-top: 30px;
    }

    .hero__advantages {
        width: 100%;
        padding:
            3px
            55px
            22px
            0;

        display: flex;
        gap: 13px;

        overflow-x: auto;
        overflow-y: visible;

        scroll-snap-type: x mandatory;
        overscroll-behavior-inline: contain;

        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

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

    .hero-advantage,
    .hero-advantage:not(:first-child) {
        width: calc(100vw - 75px);
        min-height: 92px;
        padding: 15px 17px;

        flex: 0 0 calc(100vw - 75px);

        display: grid;
        grid-template-columns: 55px minmax(0, 1fr);
        align-items: center;
        gap: 13px;

        border: 1px solid rgba(239, 170, 0, 0.13);
        border-radius: 16px;
        background: rgba(255, 255, 255, 0.96);

        box-shadow:
            0 11px 28px rgba(40, 37, 29, 0.06);

        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .hero-advantage::after {
        display: none;
    }

    .hero-advantage__icon {
        grid-row: 1 / span 2;

        width: 52px;
    }

    .hero-advantage strong {
        font-size: 14px;
    }

    .hero-advantage span {
        font-size: 12px;
    }

    .hero__advantages-tools {
        padding-right: 55px;

        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
    }

    .hero__advantages-tools > span,
    .hero__trust-tools > span {
        display: flex;
        align-items: center;
        gap: 8px;

        color: #6a6a6a;

        font-size: 12px;
        line-height: 1;
        font-weight: 600;
    }

    .hero__advantages-tools b,
    .hero__trust-tools b {
        color: #e5a300;

        font-size: 21px;
        line-height: 1;

        animation:
            hero-swipe-arrow 1.35s ease-in-out infinite;
    }

    .hero__slider-dots {
        display: flex;
        align-items: center;
        gap: 7px;
    }

    .hero__slider-dots button {
        width: 8px;
        height: 8px;
        padding: 0;

        border: 0;
        border-radius: 50%;
        background: #ddd7ca;

        cursor: pointer;

        transition:
            width var(--transition),
            border-radius var(--transition),
            background var(--transition);
    }

    .hero__slider-dots button.is-active {
        width: 23px;

        border-radius: 999px;
        background: var(--yellow);
    }

    .hero__visual {
        width: 100%;
        min-width: 0;
        margin-top: 25px;

        display: block;
        align-self: auto;
    }

    .hero__stage {
        position: relative;

        width: 100%;
        height: auto;
        min-height: 0;
        aspect-ratio: 3 / 2;

        overflow: visible;
    }

    .hero__image-glow {
        top: 5%;
        right: 5%;

        width: 90%;
    }

    .hero__main-image {
        position: relative;
        inset: auto;

        width: 100%;
        max-width: 100%;
        height: 100%;
        margin: 0 auto;

        object-fit: contain;
        object-position: center;

        transform: none;
        animation: none;
    }

    .hero-trust-card {
        display: none;
    }

    .hero__trust-shell {
        width: calc(100% + 18px);
        margin-top: 22px;
    }

    .hero__trust-strip {
        width: 100%;
        min-height: 0;
        padding:
            3px
            55px
            22px
            0;

        display: flex;
        gap: 13px;

        overflow-x: auto;
        overflow-y: visible;

        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;

        scroll-snap-type: x mandatory;
        overscroll-behavior-inline: contain;

        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .hero__trust-strip::-webkit-scrollbar {
        display: none;
    }

    .hero-trust-item,
    .hero-trust-item:first-child,
    .hero-trust-item:last-child,
    .hero-trust-item:nth-child(3) {
        width: calc(100vw - 75px);
        min-height: 91px;
        padding: 16px 17px;

        flex: 0 0 calc(100vw - 75px);

        border: 1px solid rgba(20, 20, 20, 0.07);
        border-radius: 16px;
        background: rgba(255, 255, 255, 0.97);

        box-shadow:
            0 11px 27px rgba(40, 37, 29, 0.06);

        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .hero-trust-item::after {
        display: none;
    }

    .hero-trust-item strong {
        font-size: 14px;
    }

    .hero-trust-item span {
        font-size: 12px;
    }

    .hero__trust-tools {
        padding-right: 55px;

        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
    }

    @keyframes hero-swipe-arrow {
        0%,
        100% {
            transform: translateX(0);
        }

        50% {
            transform: translateX(6px);
        }
    }
}


/* =========================================================
   RESPONSIVE ? 390
   ========================================================= */

@media (max-width: 390px) {
    .site-header__inner {
        padding-inline: 13px;
    }

    .site-header__brand {
        width: 181px;
    }

    .site-header__actions {
        gap: 8px;
    }

    .site-header__whatsapp,
    .site-header__toggle {
        width: 44px;
        height: 44px;
    }

    .hero__inner {
        padding-right: 16px;
        padding-left: 16px;
    }

    .hero__title {
        font-size: clamp(37px, 10vw, 40px);
    }

    .hero__advantages-shell,
    .hero__trust-shell {
        width: calc(100% + 16px);
    }

    .hero-advantage,
    .hero-advantage:not(:first-child),
    .hero-trust-item,
    .hero-trust-item:first-child,
    .hero-trust-item:last-child,
    .hero-trust-item:nth-child(3) {
        width: calc(100vw - 70px);
        flex-basis: calc(100vw - 70px);
    }

    .hero__advantages,
    .hero__trust-strip {
        padding-right: 50px;
    }

    .hero__advantages-tools,
    .hero__trust-tools {
        padding-right: 50px;
    }

    .hero__stage {
        width: 100%;
        height: auto;
        min-height: 0;
        aspect-ratio: 3 / 2;
    }

    .hero-trust-card {
        right: -7%;

        width: 192px;
    }
}


/* =========================================================
   SERVICES SECTION
   ========================================================= */

.services-section {
    position: relative;
    isolation: isolate;

    width: 100%;
    min-height: 100svh;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 78% 34%,
            rgba(255, 192, 29, 0.075) 0%,
            rgba(255, 192, 29, 0.018) 27%,
            transparent 52%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #ffffff 88%,
            #f6f4ee 100%
        );
}

.services-section__background {
    position: absolute;
    inset: 0;
    z-index: -1;

    overflow: hidden;
    pointer-events: none;
}

.services-section__glow {
    position: absolute;
    top: 9%;
    left: -12%;

    width: clamp(450px, 35vw, 850px);
    aspect-ratio: 1;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255, 205, 76, 0.09),
            transparent 70%
        );
}

.services-section__dots {
    position: absolute;
    right: 1.5%;
    bottom: 8%;

    width: clamp(120px, 10vw, 230px);
    height: clamp(100px, 8vw, 180px);

    opacity: 0.32;

    background-image:
        radial-gradient(
            circle,
            rgba(236, 169, 0, 0.25) 1.2px,
            transparent 1.4px
        );

    background-size: 13px 13px;
}

.services-section__inner {
    position: relative;
    z-index: 2;

    width: 100%;
    min-height: 100svh;

    padding:
        clamp(120px, 7vw, 170px)
        clamp(30px, 3.8vw, 96px)
        clamp(48px, 3.2vw, 82px);

    display: grid;
    grid-template-columns:
        minmax(390px, 30.5%)
        minmax(0, 69.5%);
    grid-template-rows:
        minmax(0, 1fr)
        auto;

    column-gap: clamp(28px, 2.1vw, 54px);
    row-gap: clamp(34px, 2.4vw, 60px);

    align-items: start;
}


/* =========================================================
   SERVICES INTRO
   ========================================================= */

.services-section__intro {
    grid-column: 1;
    grid-row: 1;

    min-width: 0;
}

.services-section__kicker {
    margin-bottom: clamp(25px, 1.8vw, 44px);

    color: #e9a600;

    font-size: clamp(10px, 0.68vw, 16px);
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.2em;
}

.services-section__intro h2 {
    margin: 0;

    color: #111214;

    font-size: clamp(46px, 3.05vw, 76px);
    line-height: 1.04;
    font-weight: 620;
    letter-spacing: -0.05em;
}

.services-section__intro h2 span {
    color: #efad00;
}

.services-section__lead {
    width: min(100%, 650px);
    margin: clamp(25px, 1.7vw, 42px) 0 0;

    color: #5d5d5d;

    font-size: clamp(15px, 1vw, 24px);
    line-height: 1.58;
    font-weight: 400;
    letter-spacing: -0.01em;
}

.services-section__actions {
    margin-top: clamp(27px, 2vw, 48px);

    display: flex;
    align-items: center;
    gap: clamp(12px, 1vw, 23px);
}

.services-section__button {
    min-height: clamp(53px, 3.5vw, 82px);
    padding:
        0
        clamp(19px, 1.4vw, 34px);

    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(18px, 1.1vw, 27px);

    border-radius: clamp(11px, 0.8vw, 18px);

    font-size: clamp(13px, 0.88vw, 21px);
    line-height: 1;
    font-weight: 680;
    white-space: nowrap;

    transition:
        transform 0.26s ease,
        border-color 0.26s ease,
        background 0.26s ease,
        box-shadow 0.26s ease;
}

.services-section__button--primary {
    min-width: clamp(195px, 13.7vw, 330px);

    color: #151515;

    background:
        linear-gradient(
            135deg,
            #ffd15a,
            #ffb400
        );

    box-shadow:
        0 1vw 2.3vw rgba(238, 171, 0, 0.2);
}

.services-section__button--secondary {
    min-width: clamp(185px, 12.5vw, 300px);

    border: 1px solid rgba(20, 20, 20, 0.11);
    background: #ffffff;
    color: #232323;

    box-shadow:
        0 0.7vw 1.8vw rgba(25, 25, 25, 0.045);
}

.services-section__button:hover,
.services-section__button:focus-visible {
    transform: translateY(-3px);
    outline: none;
}

.services-section__button--primary:hover,
.services-section__button--primary:focus-visible {
    box-shadow:
        0 1.35vw 2.8vw rgba(238, 171, 0, 0.3);
}

.services-section__button--secondary:hover,
.services-section__button--secondary:focus-visible {
    border-color: rgba(238, 171, 0, 0.42);
    background: #fffaf0;
}


/* =========================================================
   CONSULTING CARD
   ========================================================= */

.services-consulting {
    position: relative;
    isolation: isolate;

    width: 100%;
    min-height: clamp(330px, 22vw, 530px);
    margin-top: clamp(45px, 3.4vw, 82px);
    padding:
        clamp(24px, 1.7vw, 42px)
        clamp(20px, 1.45vw, 36px);

    overflow: hidden;

    border: 1px solid rgba(238, 171, 0, 0.09);
    border-radius: clamp(18px, 1.25vw, 31px);

    background:
        radial-gradient(
            circle at 88% 55%,
            rgba(255, 205, 74, 0.16),
            transparent 47%
        ),
        linear-gradient(
            135deg,
            #fffdf7,
            #fff8e8
        );

    box-shadow:
        0 1.1vw 2.7vw rgba(45, 40, 25, 0.06);
}

.services-consulting__copy {
    position: relative;
    z-index: 3;

    width: 69%;
}

.services-consulting__icon {
    width: clamp(49px, 3.2vw, 77px);
    height: clamp(49px, 3.2vw, 77px);

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(238, 171, 0, 0.13);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.9);

    box-shadow:
        0 8px 20px rgba(83, 63, 18, 0.07);
}

.services-consulting__icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.services-consulting h3 {
    margin: clamp(19px, 1.3vw, 32px) 0 0;

    color: #191919;

    font-size: clamp(24px, 1.65vw, 40px);
    line-height: 1.13;
    font-weight: 630;
    letter-spacing: -0.04em;
}

.services-consulting h3 span {
    color: #eeaa00;
}

.services-consulting ul {
    margin: clamp(24px, 1.65vw, 40px) 0 0;
    padding: 0;

    display: grid;
    gap: clamp(17px, 1.1vw, 27px);

    list-style: none;
}

.services-consulting li {
    position: relative;

    padding-left: clamp(27px, 1.65vw, 40px);
}

.services-consulting li::before {
    content: "?";

    position: absolute;
    top: 0;
    left: 0;

    width: clamp(19px, 1.25vw, 30px);
    height: clamp(19px, 1.25vw, 30px);

    display: flex;
    align-items: center;
    justify-content: center;

    border: 2px solid #efad00;
    border-radius: 50%;

    color: #e9a600;

    font-size: clamp(10px, 0.68vw, 16px);
    line-height: 1;
    font-weight: 800;
}

.services-consulting li strong,
.services-consulting li span {
    display: block;
}

.services-consulting li strong {
    color: #2b2b2b;

    font-size: clamp(12px, 0.78vw, 19px);
    line-height: 1.25;
    font-weight: 680;
}

.services-consulting li span {
    margin-top: 4px;

    color: #686868;

    font-size: clamp(10px, 0.66vw, 16px);
    line-height: 1.45;
}

.services-consulting__image {
    position: absolute;
    right: -20%;
    bottom: -7%;
    z-index: 1;

    width: 72%;
    max-width: none;
    height: auto;

    object-fit: contain;

    filter:
        drop-shadow(
            0 23px 22px rgba(62, 48, 23, 0.13)
        );

    transition:
        transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.services-consulting:hover
.services-consulting__image {
    transform:
        translate(-3%, -2%)
        rotate(-2deg);
}


/* =========================================================
   SERVICES CARDS
   ========================================================= */

.services-section__cards-shell {
    grid-column: 2;
    grid-row: 1;

    min-width: 0;
}

.services-section__cards {
    width: 100%;

    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap:
        clamp(18px, 1.25vw, 32px)
        clamp(18px, 1.25vw, 32px);
}

.services-card {
    position: relative;

    min-width: 0;
    min-height: clamp(310px, 22.2vw, 545px);

    overflow: hidden;

    border: 1px solid rgba(20, 20, 20, 0.045);
    border-radius: clamp(17px, 1.2vw, 30px);
    background: rgba(255, 255, 255, 0.98);

    box-shadow:
        0 1.05vw 2.7vw rgba(32, 32, 32, 0.065),
        0 0.12vw 0.55vw rgba(32, 32, 32, 0.02);

    transition:
        transform 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        border-color 0.32s ease,
        box-shadow 0.32s ease;
}

.services-card:hover {
    transform: translateY(-8px);

    border-color: rgba(238, 171, 0, 0.16);

    box-shadow:
        0 1.5vw 3.2vw rgba(32, 32, 32, 0.095),
        0 0.16vw 0.65vw rgba(32, 32, 32, 0.03);
}

.services-card__visual {
    position: relative;

    width: 100%;
    height: clamp(160px, 12.5vw, 305px);

    overflow: hidden;

    background:
        radial-gradient(
            circle at 58% 51%,
            rgba(255, 218, 125, 0.17),
            transparent 57%
        ),
        linear-gradient(
            145deg,
            #ffffff,
            #fffdf7
        );
}

.services-card__number {
    position: absolute;
    top: clamp(18px, 1.2vw, 29px);
    left: clamp(18px, 1.2vw, 29px);
    z-index: 4;

    color: rgba(235, 170, 0, 0.18);

    font-size: clamp(30px, 2vw, 49px);
    line-height: 1;
    font-weight: 620;
    letter-spacing: -0.04em;
}

.services-card__visual > img {
    position: absolute;
    top: 50%;
    left: 50%;

    width: 84%;
    max-width: none;
    height: 94%;

    object-fit: contain;

    filter:
        drop-shadow(
            0 18px 20px rgba(34, 30, 21, 0.11)
        );

    transform:
        translate(-50%, -48%)
        scale(1);

    transition:
        transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.services-card:hover
.services-card__visual > img {
    transform:
        translate(-50%, -51%)
        scale(1.055);
}

.services-card__body {
    position: relative;

    min-height:
        calc(
            clamp(310px, 22.2vw, 545px) -
            clamp(160px, 12.5vw, 305px)
        );

    padding:
        clamp(23px, 1.45vw, 36px)
        clamp(20px, 1.35vw, 34px)
        clamp(21px, 1.4vw, 35px);

    display: flex;
    flex-direction: column;
}

.services-card__icon {
    position: absolute;
    top: clamp(-32px, -2vw, -23px);
    left: clamp(20px, 1.35vw, 34px);

    width: clamp(47px, 3.2vw, 78px);
    height: clamp(47px, 3.2vw, 78px);

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(20, 20, 20, 0.055);
    border-radius: clamp(12px, 0.8vw, 20px);
    background: #ffffff;

    box-shadow:
        0 10px 25px rgba(38, 34, 24, 0.09);
}

.services-card__icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.services-card h3 {
    margin: clamp(16px, 1vw, 25px) 0 0;

    color: #1a1a1a;

    font-size: clamp(18px, 1.18vw, 29px);
    line-height: 1.2;
    font-weight: 660;
    letter-spacing: -0.035em;
}

.services-card p {
    margin: clamp(11px, 0.75vw, 18px) 0 0;

    color: #636363;

    font-size: clamp(12px, 0.77vw, 19px);
    line-height: 1.55;
    font-weight: 400;
}

.services-card__body > a {
    margin-top: auto;
    padding-top: clamp(20px, 1.3vw, 32px);

    display: flex;
    align-items: center;
    gap: clamp(8px, 0.55vw, 14px);

    color: #242424;

    font-size: clamp(12px, 0.78vw, 19px);
    line-height: 1;
    font-weight: 680;
}

.services-card__body > a span {
    color: #e8a500;

    font-size: clamp(18px, 1.15vw, 28px);
    line-height: 1;

    transition: transform 0.25s ease;
}

.services-card__body > a:hover span,
.services-card__body > a:focus-visible span {
    transform: translate(4px, -4px);
}

.services-section__slider-tools {
    display: none;
}


/* =========================================================
   SERVICES CTA
   ========================================================= */

.services-cta {
    grid-column: 1 / -1;
    grid-row: 2;

    width: 100%;
    min-height: clamp(108px, 8.4vw, 205px);
    padding:
        clamp(20px, 1.5vw, 37px)
        clamp(24px, 1.9vw, 48px);

    display: grid;
    grid-template-columns:
        auto
        minmax(300px, 1.55fr)
        minmax(260px, 1fr)
        auto;

    align-items: center;
    gap: clamp(21px, 1.8vw, 46px);

    border: 1px solid rgba(20, 20, 20, 0.055);
    border-radius: clamp(18px, 1.25vw, 31px);
    background: rgba(255, 255, 255, 0.97);

    box-shadow:
        0 1.1vw 2.8vw rgba(32, 31, 27, 0.07);
}

.services-cta__icon {
    width: clamp(57px, 3.9vw, 95px);
    height: clamp(57px, 3.9vw, 95px);

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(238, 171, 0, 0.13);
    border-radius: 50%;
    background: #fff7df;
}

.services-cta__icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.services-cta__copy strong,
.services-cta__copy span {
    display: block;
}

.services-cta__copy strong {
    color: #191919;

    font-size: clamp(19px, 1.3vw, 32px);
    line-height: 1.15;
    font-weight: 670;
    letter-spacing: -0.035em;
}

.services-cta__copy > span {
    margin-top: 5px;

    color: #efad00;

    font-size: clamp(18px, 1.25vw, 31px);
    line-height: 1.15;
    font-weight: 650;
    letter-spacing: -0.03em;
}

.services-cta__copy p {
    margin: clamp(10px, 0.7vw, 17px) 0 0;

    color: #676767;

    font-size: clamp(12px, 0.77vw, 19px);
    line-height: 1.45;
}

.services-cta__contact {
    display: flex;
    align-items: center;
    gap: clamp(15px, 1vw, 25px);
}

.services-cta__avatars {
    display: flex;
    align-items: center;
}

.services-cta__avatars img,
.services-cta__avatars > span {
    width: clamp(41px, 2.75vw, 67px);
    height: clamp(41px, 2.75vw, 67px);

    flex: 0 0 auto;

    border: 3px solid #ffffff;
    border-radius: 50%;

    object-fit: cover;

    box-shadow:
        0 6px 14px rgba(30, 30, 30, 0.08);
}

.services-cta__avatars img + img,
.services-cta__avatars > span {
    margin-left: clamp(-12px, -0.6vw, -7px);
}

.services-cta__avatars > span {
    display: flex;
    align-items: center;
    justify-content: center;

    background: #f7b500;
    color: #171717;

    font-size: clamp(15px, 1vw, 24px);
    font-weight: 680;
}

.services-cta__contact > div:last-child strong,
.services-cta__contact > div:last-child span {
    display: block;
}

.services-cta__contact > div:last-child strong {
    color: #242424;

    font-size: clamp(12px, 0.79vw, 19px);
    line-height: 1.3;
    font-weight: 680;
}

.services-cta__contact > div:last-child span {
    margin-top: 5px;

    color: #717171;

    font-size: clamp(10px, 0.66vw, 16px);
    line-height: 1.35;
}

.services-cta__button {
    min-width: clamp(250px, 18vw, 430px);
    min-height: clamp(57px, 3.8vw, 92px);
    padding:
        0
        clamp(22px, 1.6vw, 40px);

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;

    border-radius: clamp(12px, 0.8vw, 20px);

    background:
        linear-gradient(
            135deg,
            #ffd15a,
            #ffb400
        );

    color: #171717;

    font-size: clamp(13px, 0.88vw, 21px);
    line-height: 1;
    font-weight: 680;
    white-space: nowrap;

    box-shadow:
        0 1vw 2.3vw rgba(238, 171, 0, 0.21);

    transition:
        transform 0.26s ease,
        box-shadow 0.26s ease;
}

.services-cta__button:hover,
.services-cta__button:focus-visible {
    transform: translateY(-3px);

    box-shadow:
        0 1.35vw 2.8vw rgba(238, 171, 0, 0.31);

    outline: none;
}


/* =========================================================
   SERVICES ANIMATIONS
   ========================================================= */

.services-section.services-section--js
[data-services-reveal] {
    opacity: 0;
    transform: translateY(34px);

    transition:
        opacity 0.76s ease,
        transform 0.76s cubic-bezier(0.22, 1, 0.36, 1);
}

.services-section.services-section--js
[data-services-reveal="intro"] {
    transform: translateX(-38px);
}

.services-section.services-section--js
[data-services-reveal="cards"] {
    transform: translateX(42px);
}

.services-section.services-section--js.is-visible
[data-services-reveal] {
    opacity: 1;
    transform: translate(0, 0);
}

.services-section.is-visible
[data-services-reveal="cards"] {
    transition-delay: 0.12s;
}

.services-section.is-visible
[data-services-reveal="cta"] {
    transition-delay: 0.22s;
}

.services-section.is-visible
.services-card {
    animation:
        services-card-in
        0.68s
        cubic-bezier(0.22, 1, 0.36, 1)
        both;
}

.services-section.is-visible
.services-card:nth-child(2) {
    animation-delay: 0.07s;
}

.services-section.is-visible
.services-card:nth-child(3) {
    animation-delay: 0.14s;
}

.services-section.is-visible
.services-card:nth-child(4) {
    animation-delay: 0.21s;
}

.services-section.is-visible
.services-card:nth-child(5) {
    animation-delay: 0.28s;
}

.services-section.is-visible
.services-card:nth-child(6) {
    animation-delay: 0.35s;
}

@keyframes services-card-in {
    from {
        opacity: 0;
        transform: translateY(24px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* =========================================================
   SERVICES ? 1500
   ========================================================= */

@media (max-width: 1500px) and (min-width: 1181px) {
    .services-section__inner {
        padding:
            115px
            42px
            54px;

        grid-template-columns:
            minmax(390px, 31%)
            minmax(0, 69%);

        column-gap: 30px;
    }

    .services-section__intro h2 {
        font-size: 48px;
    }

    .services-section__lead {
        font-size: 16px;
    }

    .services-section__button {
        min-height: 55px;

        font-size: 14px;
    }

    .services-consulting {
        min-height: 350px;
        margin-top: 46px;
        padding: 25px 22px;
    }

    .services-consulting h3 {
        font-size: 25px;
    }

    .services-consulting li strong {
        font-size: 13px;
    }

    .services-consulting li span {
        font-size: 11px;
    }

    .services-card {
        min-height: 390px;
    }

    .services-card__visual {
        height: 205px;
    }

    .services-card__body {
        min-height: 185px;
        padding: 25px 21px 21px;
    }

    .services-card h3 {
        font-size: 20px;
    }

    .services-card p,
    .services-card__body > a {
        font-size: 13px;
    }

    .services-cta {
        min-height: 120px;
    }

    .services-cta__button {
        min-width: 275px;
        min-height: 58px;

        font-size: 14px;
    }
}


/* =========================================================
   SERVICES ? 1180
   ========================================================= */

@media (max-width: 1180px) {
    .services-section {
        min-height: 0;
    }

    .services-section__inner {
        min-height: 0;
        padding:
            90px
            30px
            56px;

        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        gap: 46px;
    }

    .services-section__intro {
        grid-column: 1;
        grid-row: 1;
    }

    .services-section__intro h2 {
        font-size: clamp(52px, 6vw, 70px);
    }

    .services-section__lead {
        max-width: 800px;

        font-size: 18px;
    }

    .services-section__actions {
        margin-top: 31px;
    }

    .services-section__button {
        min-height: 60px;

        font-size: 15px;
    }

    .services-consulting {
        min-height: 320px;
        margin-top: 42px;
    }

    .services-consulting__copy {
        width: 64%;
    }

    .services-consulting__image {
        right: -4%;
        bottom: -15%;

        width: 47%;
    }

    .services-section__cards-shell {
        grid-column: 1;
        grid-row: 2;
    }

    .services-section__cards {
        gap: 20px;
    }

    .services-card {
        min-height: 410px;
    }

    .services-card__visual {
        height: 215px;
    }

    .services-card__body {
        min-height: 195px;
    }

    .services-card h3 {
        font-size: 21px;
    }

    .services-card p,
    .services-card__body > a {
        font-size: 14px;
    }

    .services-cta {
        grid-column: 1;
        grid-row: 3;

        min-height: 0;

        grid-template-columns:
            auto
            minmax(0, 1fr)
            auto;

        gap: 25px;
    }

    .services-cta__contact {
        display: none;
    }
}


/* =========================================================
   SERVICES ? 900
   ========================================================= */

@media (max-width: 900px) {
    .services-section__inner {
        padding:
            78px
            24px
            52px;
    }

    .services-section__cards-shell {
        width: calc(100% + 24px);
    }

    .services-section__cards {
        width: 100%;
        padding:
            4px
            78px
            28px
            0;

        display: flex;
        gap: 17px;

        overflow-x: auto;
        overflow-y: visible;

        scroll-snap-type: x mandatory;
        overscroll-behavior-inline: contain;

        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

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

    .services-card {
        width: min(66vw, 490px);
        min-height: 440px;

        flex: 0 0 min(66vw, 490px);

        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .services-card:hover {
        transform: none;
    }

    .services-card__visual {
        height: 235px;
    }

    .services-card__body {
        min-height: 205px;
    }

    .services-section__slider-tools {
        padding-right: 78px;

        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
    }

    .services-section__swipe {
        display: flex;
        align-items: center;
        gap: 8px;

        color: #686868;

        font-size: 13px;
        line-height: 1;
        font-weight: 600;
    }

    .services-section__swipe b {
        color: #e8a500;

        font-size: 22px;
        line-height: 1;

        animation:
            services-swipe-arrow
            1.35s
            ease-in-out
            infinite;
    }

    .services-section__slider-dots {
        display: flex;
        align-items: center;
        gap: 7px;
    }

    .services-section__slider-dots button {
        width: 8px;
        height: 8px;
        padding: 0;

        border: 0;
        border-radius: 50%;
        background: #ded8ca;

        cursor: pointer;

        transition:
            width 0.25s ease,
            border-radius 0.25s ease,
            background 0.25s ease;
    }

    .services-section__slider-dots button.is-active {
        width: 24px;

        border-radius: 999px;
        background: #f3b300;
    }

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

    .services-cta__button {
        grid-column: 1 / -1;

        width: 100%;
    }

    @keyframes services-swipe-arrow {
        0%,
        100% {
            transform: translateX(0);
        }

        50% {
            transform: translateX(6px);
        }
    }
}


/* =========================================================
   SERVICES ? 620
   ========================================================= */

@media (max-width: 620px) {
    .services-section__dots {
        display: none;
    }

    .services-section__inner {
        padding:
            66px
            18px
            46px;

        gap: 38px;
    }

    .services-section__kicker {
        margin-bottom: 20px;

        font-size: 10px;
        letter-spacing: 0.19em;
    }

    .services-section__intro h2 {
        font-size: clamp(40px, 11vw, 48px);
        line-height: 1.04;
    }

    .services-section__lead {
        margin-top: 23px;

        font-size: 16.5px;
        line-height: 1.54;
    }

    .services-section__actions {
        margin-top: 26px;

        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .services-section__button,
    .services-section__button--primary,
    .services-section__button--secondary {
        width: 100%;
        min-width: 0;
        min-height: 59px;
    }

    .services-consulting {
        min-height: 490px;
        margin-top: 32px;
        padding: 23px 20px;
    }

    .services-consulting__copy {
        width: 100%;
    }

    .services-consulting__icon {
        width: 55px;
        height: 55px;
    }

    .services-consulting h3 {
        font-size: 25px;
    }

    .services-consulting ul {
        gap: 16px;
    }

    .services-consulting li {
        padding-left: 29px;
    }

    .services-consulting li strong {
        font-size: 13px;
    }

    .services-consulting li span {
        max-width: 270px;

        font-size: 11.5px;
    }

    .services-consulting__image {
        right: -15%;
        bottom: -8%;

        width: 72%;
    }

    .services-section__cards-shell {
        width: calc(100% + 18px);
    }

    .services-section__cards {
        padding:
            4px
            52px
            25px
            0;

        gap: 14px;
    }

    .services-card {
        width: calc(100vw - 69px);
        min-height: 430px;

        flex: 0 0 calc(100vw - 69px);

        border-radius: 20px;
    }

    .services-card__visual {
        height: 225px;
    }

    .services-card__body {
        min-height: 205px;
        padding: 25px 22px 22px;
    }

    .services-card__icon {
        left: 22px;

        width: 57px;
        height: 57px;
    }

    .services-card h3 {
        margin-top: 16px;

        font-size: 22px;
    }

    .services-card p {
        font-size: 15px;
    }

    .services-card__body > a {
        font-size: 14px;
    }

    .services-section__slider-tools {
        padding-right: 52px;
    }

    .services-section__swipe {
        font-size: 12px;
    }

    .services-section__slider-dots {
        gap: 5px;
    }

    .services-section__slider-dots button {
        width: 7px;
        height: 7px;
    }

    .services-section__slider-dots button.is-active {
        width: 20px;
    }

    .services-cta {
        padding: 22px 19px;

        grid-template-columns: 54px minmax(0, 1fr);
        gap: 16px;

        border-radius: 19px;
    }

    .services-cta__icon {
        width: 54px;
        height: 54px;

        align-self: start;
    }

    .services-cta__copy strong {
        font-size: 20px;
    }

    .services-cta__copy > span {
        margin-top: 6px;

        font-size: 18px;
    }

    .services-cta__copy p {
        font-size: 13px;
    }

    .services-cta__button {
        min-width: 0;
        min-height: 58px;
        padding: 0 18px;

        font-size: 13px;
    }
}


/* =========================================================
   SERVICES ? 390
   ========================================================= */

@media (max-width: 390px) {
    .services-section__inner {
        padding-right: 16px;
        padding-left: 16px;
    }

    .services-section__cards-shell {
        width: calc(100% + 16px);
    }

    .services-section__cards {
        padding-right: 47px;
    }

    .services-card {
        width: calc(100vw - 63px);
        flex-basis: calc(100vw - 63px);
    }

    .services-section__slider-tools {
        padding-right: 47px;
    }

    .services-consulting {
        min-height: 500px;
    }

    .services-consulting__image {
        right: -22%;

        width: 80%;
    }
}


/* =========================================================
   SERVICES ? REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .services-section.services-section--js
    [data-services-reveal],
    .services-card,
    .services-consulting__image,
    .services-section__swipe b {
        animation: none !important;
        transition: none !important;
    }

    .services-section.services-section--js
    [data-services-reveal] {
        opacity: 1;
        transform: none;
    }
}

/* =========================================================
   AUDIENCES SECTION
   ========================================================= */

.audiences-section {
    position: relative;
    isolation: isolate;

    width: 100%;
    min-height: 100svh;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #f7f5ef 0%,
            #fffefa 12%,
            #ffffff 88%,
            #f7f5ef 100%
        );
}

.audiences-section__background {
    position: absolute;
    inset: 0;
    z-index: -2;

    overflow: hidden;
    pointer-events: none;
}

.audiences-section__glow {
    position: absolute;

    border-radius: 50%;
}

.audiences-section__glow--left {
    top: 27%;
    left: -18%;

    width: clamp(500px, 42vw, 960px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 199, 61, 0.12),
            transparent 68%
        );
}

.audiences-section__glow--right {
    top: -18%;
    right: -15%;

    width: clamp(550px, 46vw, 1050px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 219, 129, 0.11),
            transparent 68%
        );
}

.audiences-section__dots {
    position: absolute;
    right: 3%;
    bottom: 7%;

    width: clamp(130px, 11vw, 250px);
    height: clamp(100px, 8vw, 180px);

    opacity: 0.28;

    background-image:
        radial-gradient(
            circle,
            rgba(237, 171, 0, 0.26) 1.2px,
            transparent 1.4px
        );

    background-size: 13px 13px;
}

.audiences-section__inner {
    position: relative;
    z-index: 2;

    width: 100%;
    min-height: 100svh;
    padding:
        clamp(90px, 6vw, 145px)
        clamp(30px, 3.8vw, 96px)
        clamp(60px, 4vw, 95px);

    display: flex;
    flex-direction: column;
}


/* =========================================================
   AUDIENCES HEADER
   ========================================================= */

.audiences-section__header {
    width: min(100%, 1120px);
    margin: 0 auto;
    text-align: center;
}

.audiences-section__badge {
    width: fit-content;
    min-height: clamp(38px, 2.5vw, 54px);
    margin: 0 auto clamp(23px, 1.6vw, 38px);
    padding:
        7px
        clamp(14px, 1vw, 24px);

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;

    border: 1px solid rgba(20, 20, 20, 0.05);
    border-radius: 999px;
    background: rgba(247, 245, 239, 0.96);

    color: #272727;

    font-size: clamp(10px, 0.68vw, 15px);
    line-height: 1;
    font-weight: 750;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.audiences-section__badge-icons {
    display: flex;
    align-items: center;
}

.audiences-section__badge-icons img {
    width: clamp(19px, 1.25vw, 28px);
    height: clamp(19px, 1.25vw, 28px);

    object-fit: contain;
}

.audiences-section__badge-icons img + img {
    margin-left: -5px;
}

.audiences-section__header h2 {
    margin: 0;

    color: #121315;

    font-size: clamp(48px, 3.8vw, 86px);
    line-height: 1.04;
    font-weight: 640;
    letter-spacing: -0.052em;
}

.audiences-section__header h2 span {
    display: block;

    margin-top: 0.08em;

    color: #efa900;
}

.audiences-section__header p {
    width: min(100%, 850px);
    margin:
        clamp(20px, 1.4vw, 32px)
        auto
        0;

    color: #666666;

    font-size: clamp(15px, 1vw, 22px);
    line-height: 1.55;
    font-weight: 400;
}


/* =========================================================
   AUDIENCE CARDS
   ========================================================= */

.audiences-section__cards-shell {
    width: 100%;
    margin-top: clamp(44px, 3.2vw, 75px);
}

.audiences-section__cards {
    width: 100%;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: clamp(22px, 1.7vw, 42px);
}

.audience-card {
    position: relative;
    isolation: isolate;

    min-width: 0;
    min-height: clamp(430px, 29vw, 660px);

    overflow: hidden;

    border: 1px solid rgba(25, 25, 25, 0.055);
    border-radius: clamp(20px, 1.4vw, 34px);

    box-shadow:
        0 1.25vw 3vw rgba(34, 31, 23, 0.075);

    transition:
        transform 0.38s cubic-bezier(0.22, 1, 0.36, 1),
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}

.audience-card--private {
    background:
        radial-gradient(
            circle at 84% 38%,
            rgba(255, 192, 62, 0.15),
            transparent 42%
        ),
        linear-gradient(
            135deg,
            #fffdf8,
            #fff5e5
        );
}

.audience-card--business {
    background:
        radial-gradient(
            circle at 83% 37%,
            rgba(210, 202, 188, 0.25),
            transparent 44%
        ),
        linear-gradient(
            135deg,
            #ffffff,
            #f5f3ee
        );
}

.audience-card:hover {
    transform: translateY(-4px);

    border-color: rgba(238, 171, 0, 0.15);

    box-shadow:
        0 1.45vw 3.2vw rgba(34, 31, 23, 0.095);
}

.audience-card__content {
    position: relative;
    z-index: 4;

    width: 49%;
    min-height: inherit;
    padding:
        clamp(30px, 2.2vw, 52px)
        0
        clamp(28px, 2vw, 48px)
        clamp(30px, 2.3vw, 56px);

    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.audience-card__label {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    min-height: clamp(35px, 2.3vw, 48px);
    padding:
        6px
        clamp(11px, 0.8vw, 18px);

    border: 1px solid rgba(20, 20, 20, 0.06);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.76);

    color: #4f4f4f;

    font-size: clamp(10px, 0.66vw, 14px);
    line-height: 1;
    font-weight: 680;
}

.audience-card__label img {
    width: clamp(20px, 1.4vw, 30px);
    height: clamp(20px, 1.4vw, 30px);

    object-fit: contain;
}

.audience-card h3 {
    margin:
        clamp(22px, 1.5vw, 35px)
        0
        0;

    color: #171717;

    font-size: clamp(30px, 2.05vw, 47px);
    line-height: 1.08;
    font-weight: 650;
    letter-spacing: -0.045em;
}

.audience-card__description {
    margin:
        clamp(12px, 0.85vw, 20px)
        0
        0;

    color: #5c5c5c;

    font-size: clamp(14px, 0.9vw, 20px);
    line-height: 1.5;
}

.audience-card ul {
    margin:
        clamp(24px, 1.65vw, 38px)
        0
        0;

    padding: 0;

    display: grid;
    gap: clamp(14px, 0.95vw, 22px);

    list-style: none;
}

.audience-card li {
    position: relative;

    padding-left: clamp(27px, 1.7vw, 40px);

    color: #303030;

    font-size: clamp(12px, 0.78vw, 18px);
    line-height: 1.35;
    font-weight: 580;
}

.audience-card li::before {
    content: "?";

    position: absolute;
    top: 50%;
    left: 0;

    width: clamp(18px, 1.15vw, 27px);
    height: clamp(18px, 1.15vw, 27px);

    display: flex;
    align-items: center;
    justify-content: center;

    border: 2px solid #edaa00;
    border-radius: 50%;

    color: #e8a500;

    font-size: clamp(9px, 0.58vw, 13px);
    line-height: 1;
    font-weight: 800;

    transform: translateY(-50%);
}

.audience-card__button {
    min-width: clamp(210px, 14vw, 330px);
    min-height: clamp(52px, 3.5vw, 78px);
    margin-top: auto;
    padding:
        0
        clamp(18px, 1.4vw, 34px);

    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    border-radius: clamp(11px, 0.8vw, 18px);

    background:
        linear-gradient(
            135deg,
            #ffd15a,
            #ffb400
        );

    color: #171717;

    font-size: clamp(13px, 0.85vw, 19px);
    line-height: 1;
    font-weight: 680;

    box-shadow:
        0 14px 30px rgba(237, 171, 0, 0.21);

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.audience-card__button span:last-child {
    font-size: 1.45em;

    transition: transform 0.25s ease;
}

.audience-card__button:hover,
.audience-card__button:focus-visible {
    transform: translateY(-3px);

    box-shadow:
        0 20px 38px rgba(237, 171, 0, 0.3);

    outline: none;
}

.audience-card__button:hover span:last-child {
    transform: translate(4px, -4px);
}

.audience-card__visual {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 2;

    width: 55%;

    overflow: hidden;
    pointer-events: none;
}

.audience-card__visual::before {
    content: "";

    position: absolute;
    inset: 0;
    z-index: 2;

    background:
        linear-gradient(
            90deg,
            var(--audience-fade, #fff9eb) 0%,
            rgba(255, 255, 255, 0.68) 12%,
            rgba(255, 255, 255, 0) 34%
        );

    pointer-events: none;
}

.audience-card--private {
    --audience-fade: #fff8e9;
}

.audience-card--business {
    --audience-fade: #f8f6f1;
}

.audience-card__visual-glow {
    position: absolute;
    top: 13%;
    right: 4%;
    z-index: -1;

    width: 82%;
    aspect-ratio: 1;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255, 206, 83, 0.17),
            transparent 68%
        );
}

.audience-card__visual > img {
    position: absolute;
    right: -2%;
    bottom: -2%;
    z-index: 1;

    width: 100%;
    max-width: none;
    height: 96%;

    object-fit: contain;
    object-position: right bottom;

    filter:
        drop-shadow(
            0 25px 22px rgba(38, 33, 23, 0.13)
        );

    transform: scale(1);

    transition:
        transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.audience-card--business
.audience-card__visual > img {
    right: -4%;

    width: 105%;
    height: 98%;
}

.audience-card:hover
.audience-card__visual > img {
    transform: scale(1.018);
}

.audiences-section__cards-tools {
    display: none;
}


/* =========================================================
   AUDIENCES BENEFITS
   ========================================================= */

.audiences-benefits-shell {
    width: 100%;
    margin-top: clamp(28px, 2.1vw, 50px);
}

.audiences-benefits {
    width: 100%;
    min-height: clamp(100px, 7.4vw, 165px);
    padding:
        clamp(18px, 1.35vw, 30px)
        clamp(20px, 1.8vw, 42px);

    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));

    border: 1px solid rgba(20, 20, 20, 0.055);
    border-radius: clamp(18px, 1.25vw, 30px);
    background: rgba(255, 255, 255, 0.97);

    box-shadow:
        0 1.05vw 2.7vw rgba(35, 32, 25, 0.065);
}

.audiences-benefit {
    position: relative;

    min-width: 0;
    padding-inline: clamp(13px, 1.15vw, 27px);

    display: flex;
    align-items: center;
    gap: clamp(12px, 0.95vw, 20px);
}

.audiences-benefit:first-child {
    padding-left: 0;
}

.audiences-benefit:last-child {
    padding-right: 0;
}

.audiences-benefit:not(:last-child)::after {
    content: "";

    position: absolute;
    top: 12%;
    right: 0;

    width: 1px;
    height: 76%;

    background: rgba(20, 20, 20, 0.08);
}

.audiences-benefit__icon {
    width: clamp(43px, 3vw, 69px);
    aspect-ratio: 1;

    flex: 0 0 auto;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(238, 171, 0, 0.11);
    border-radius: 50%;
    background: #fff9eb;
}

.audiences-benefit__icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.audiences-benefit strong,
.audiences-benefit span {
    display: block;
}

.audiences-benefit strong {
    color: #242424;

    font-size: clamp(11px, 0.76vw, 17px);
    line-height: 1.25;
    font-weight: 680;
}

.audiences-benefit span {
    margin-top: 5px;

    color: #747474;

    font-size: clamp(9px, 0.62vw, 14px);
    line-height: 1.35;
}

.audiences-benefits-tools {
    display: none;
}


/* =========================================================
   AUDIENCES ANIMATIONS
   ========================================================= */

.audiences-section.audiences-section--js
[data-audiences-reveal] {
    opacity: 0;
    transform: translateY(34px);

    transition:
        opacity 0.76s ease,
        transform 0.76s cubic-bezier(0.22, 1, 0.36, 1);
}

.audiences-section.audiences-section--js
[data-audiences-reveal="header"] {
    transform: translateY(28px);
}

.audiences-section.audiences-section--js
[data-audiences-reveal="cards"] {
    transform: translateY(40px);
}

.audiences-section.audiences-section--js.is-visible
[data-audiences-reveal] {
    opacity: 1;
    transform: translate(0, 0);
}

.audiences-section.is-visible
[data-audiences-reveal="cards"] {
    transition-delay: 0.12s;
}

.audiences-section.is-visible
[data-audiences-reveal="benefits"] {
    transition-delay: 0.24s;
}

.audiences-section.is-visible
.audience-card:first-child {
    animation:
        audience-card-left
        0.75s
        0.14s
        cubic-bezier(0.22, 1, 0.36, 1)
        both;
}

.audiences-section.is-visible
.audience-card:last-child {
    animation:
        audience-card-right
        0.75s
        0.21s
        cubic-bezier(0.22, 1, 0.36, 1)
        both;
}

@keyframes audience-card-left {
    from {
        opacity: 0;
        transform: translateX(-25px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes audience-card-right {
    from {
        opacity: 0;
        transform: translateX(25px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}


/* =========================================================
   AUDIENCES ? 1500
   ========================================================= */

@media (max-width: 1500px) and (min-width: 1181px) {
    .audiences-section__inner {
        padding:
            90px
            42px
            65px;
    }

    .audiences-section__header h2 {
        font-size: 56px;
    }

    .audiences-section__header p {
        font-size: 16px;
    }

    .audience-card {
        min-height: 450px;
    }

    .audience-card__content {
        width: 52%;
        padding:
            28px
            0
            27px
            30px;
    }

    .audience-card h3 {
        font-size: 31px;
    }

    .audience-card__description {
        font-size: 14px;
    }

    .audience-card li {
        font-size: 12px;
    }

    .audience-card__button {
        min-width: 220px;
        min-height: 54px;

        font-size: 13px;
    }

    .audiences-benefits {
        min-height: 110px;
    }
}


/* =========================================================
   AUDIENCES ? 1180
   ========================================================= */

@media (max-width: 1180px) {
    .audiences-section {
        min-height: 0;
    }

    .audiences-section__inner {
        min-height: 0;
        padding:
            82px
            30px
            60px;
    }

    .audiences-section__header h2 {
        font-size: clamp(50px, 6vw, 68px);
    }

    .audiences-section__header p {
        max-width: 760px;

        font-size: 18px;
    }

    .audiences-section__cards {
        grid-template-columns: 1fr;
    }

    .audience-card {
        min-height: 520px;
    }

    .audience-card__content {
        width: 48%;
    }

    .audience-card__visual {
        width: 60%;
    }

    .audience-card__visual > img {
        width: 94%;
    }

    .audience-card--business
    .audience-card__visual > img {
        width: 99%;
    }

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

        gap: 20px 0;
    }

    .audiences-benefit:nth-child(3)::after {
        display: none;
    }

    .audiences-benefit:nth-child(4) {
        padding-left: 0;
    }
}


/* =========================================================
   AUDIENCES ? 900
   ========================================================= */

@media (max-width: 900px) {
    .audiences-section__inner {
        padding:
            74px
            24px
            55px;
    }

    .audience-card {
        min-height: 500px;
    }

    .audience-card__content {
        width: 54%;
    }

    .audience-card__visual {
        width: 55%;
    }

    .audience-card__visual > img {
        right: -9%;

        width: 110%;
    }

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

    .audiences-benefit:nth-child(2)::after,
    .audiences-benefit:nth-child(4)::after {
        display: none;
    }

    .audiences-benefit:nth-child(3),
    .audiences-benefit:nth-child(5) {
        padding-left: 0;
    }
}


/* =========================================================
   AUDIENCES ? 620
   ========================================================= */

@media (max-width: 620px) {
    .audiences-section__dots {
        display: none;
    }

    .audiences-section__inner {
        padding:
            62px
            18px
            48px;
    }

    .audiences-section__header {
        text-align: left;
    }

    .audiences-section__badge {
        margin-right: 0;
        margin-left: 0;

        font-size: 9.5px;
    }

    .audiences-section__header h2 {
        font-size: clamp(40px, 11vw, 49px);
        line-height: 1.04;
    }

    .audiences-section__header p {
        margin-right: 0;
        margin-left: 0;

        font-size: 16.5px;
        line-height: 1.52;
    }

    .audiences-section__cards-shell {
        width: calc(100% + 18px);
        margin-top: 34px;
    }

    .audiences-section__cards {
        width: 100%;
        padding:
            4px
            54px
            25px
            0;

        display: flex;
        gap: 14px;

        overflow-x: auto;
        overflow-y: visible;

        scroll-snap-type: x mandatory;
        overscroll-behavior-inline: contain;

        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .audiences-section__cards::-webkit-scrollbar {
        display: none;
    }

    .audience-card {
        width: calc(100vw - 70px);
        min-height: 0;

        flex: 0 0 calc(100vw - 70px);

        display: flex;
        flex-direction: column;

        border-radius: 21px;

        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .audience-card:hover {
        transform: none;
    }

    .audience-card__content {
        position: relative;
        z-index: 4;

        width: 100%;
        min-height: 0;
        padding:
            23px
            21px
            20px;

        display: flex;
        flex-direction: column;
        align-items: stretch;

        background: transparent;
    }

    .audience-card--business
    .audience-card__content {
        background: transparent;
    }

    .audience-card__label {
        align-self: flex-start;

        min-height: 37px;

        font-size: 10px;
    }

    .audience-card h3 {
        margin-top: 19px;

        font-size: 29px;
    }

    .audience-card__description {
        margin-top: 10px;

        font-size: 14.5px;
        line-height: 1.48;
    }

    .audience-card ul {
        margin-top: 19px;

        gap: 12px;
    }

    .audience-card li {
        padding-left: 28px;

        font-size: 13px;
        line-height: 1.35;
    }

    .audience-card__button {
        width: 100%;
        min-width: 0;
        min-height: 57px;
        margin-top: 22px;

        font-size: 13px;
    }

    .audience-card__visual {
        position: relative;
        top: auto;
        right: auto;
        bottom: auto;

        width: 100%;
        height: 240px;

        flex: 0 0 240px;

        overflow: hidden;

        border-top: 1px solid rgba(20, 20, 20, 0.035);
    }

    .audience-card__visual::before {
        display: block;

        background:
            linear-gradient(
                180deg,
                var(--audience-fade, #fff9eb) 0%,
                rgba(255, 255, 255, 0.38) 18%,
                rgba(255, 255, 255, 0) 42%
            );
    }

    .audience-card__visual-glow {
        top: 0;
        right: 5%;

        width: 90%;
    }

    .audience-card__visual > img {
        right: -2%;
        bottom: -3%;

        width: 101%;
        height: 106%;

        object-fit: contain;
        object-position: center bottom;

        transform: none;
    }

    .audience-card--business
    .audience-card__visual > img {
        right: -7%;
        bottom: -3%;

        width: 112%;
        height: 108%;
    }

    .audience-card:hover
    .audience-card__visual > img {
        transform: none;
    }

    .audiences-section__cards-tools {
        padding-right: 54px;

        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
    }

    .audiences-section__cards-tools > span,
    .audiences-benefits-tools > span {
        display: flex;
        align-items: center;
        gap: 8px;

        color: #6c6c6c;

        font-size: 12px;
        line-height: 1;
        font-weight: 600;
    }

    .audiences-section__cards-tools b,
    .audiences-benefits-tools b {
        color: #e8a500;

        font-size: 21px;
        line-height: 1;

        animation:
            audiences-swipe-arrow
            1.35s
            ease-in-out
            infinite;
    }

    .audiences-section__dots-nav {
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .audiences-section__dots-nav button {
        width: 8px;
        height: 8px;
        padding: 0;

        border: 0;
        border-radius: 50%;

        background: #ded8ca;

        cursor: pointer;

        transition:
            width 0.25s ease,
            border-radius 0.25s ease,
            background 0.25s ease;
    }

    .audiences-section__dots-nav button.is-active {
        width: 23px;

        border-radius: 999px;
        background: #f1ae00;
    }

    .audiences-benefits-shell {
        width: calc(100% + 18px);
        margin-top: 34px;
    }

    .audiences-benefits {
        width: 100%;
        min-height: 0;
        padding:
            4px
            54px
            24px
            0;

        display: flex;
        gap: 13px;

        overflow-x: auto;
        overflow-y: visible;

        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;

        scroll-snap-type: x mandatory;
        overscroll-behavior-inline: contain;

        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .audiences-benefits::-webkit-scrollbar {
        display: none;
    }

    .audiences-benefit,
    .audiences-benefit:first-child,
    .audiences-benefit:last-child,
    .audiences-benefit:nth-child(3),
    .audiences-benefit:nth-child(5) {
        width: calc(100vw - 70px);
        min-height: 92px;
        padding: 16px 17px;

        flex: 0 0 calc(100vw - 70px);

        border: 1px solid rgba(20, 20, 20, 0.06);
        border-radius: 16px;
        background: rgba(255, 255, 255, 0.97);

        box-shadow:
            0 10px 27px rgba(34, 31, 23, 0.06);

        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .audiences-benefit::after {
        display: none;
    }

    .audiences-benefit__icon {
        width: 53px;
    }

    .audiences-benefit strong {
        font-size: 14px;
    }

    .audiences-benefit span {
        font-size: 12px;
    }

    .audiences-benefits-tools {
        padding-right: 54px;

        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
    }

    @keyframes audiences-swipe-arrow {
        0%,
        100% {
            transform: translateX(0);
        }

        50% {
            transform: translateX(6px);
        }
    }
}


/* =========================================================
   AUDIENCES ? 390
   ========================================================= */

@media (max-width: 390px) {
    .audiences-section__inner {
        padding-right: 16px;
        padding-left: 16px;
    }

    .audiences-section__cards-shell,
    .audiences-benefits-shell {
        width: calc(100% + 16px);
    }

    .audiences-section__cards,
    .audiences-benefits {
        padding-right: 48px;
    }

    .audience-card,
    .audiences-benefit,
    .audiences-benefit:first-child,
    .audiences-benefit:last-child,
    .audiences-benefit:nth-child(3),
    .audiences-benefit:nth-child(5) {
        width: calc(100vw - 64px);
        flex-basis: calc(100vw - 64px);
    }

    .audiences-section__cards-tools,
    .audiences-benefits-tools {
        padding-right: 48px;
    }

    .audience-card__visual {
        height: 220px;
        flex-basis: 220px;
    }
}


/* =========================================================
   AUDIENCES ? REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .audiences-section.audiences-section--js
    [data-audiences-reveal],
    .audience-card,
    .audience-card__visual > img,
    .audiences-section__cards-tools b,
    .audiences-benefits-tools b {
        animation: none !important;
        transition: none !important;
    }

    .audiences-section.audiences-section--js
    [data-audiences-reveal] {
        opacity: 1;
        transform: none;
    }
}


/* =========================================================
   MATERIALS SHOWCASE
   ========================================================= */

.materials-showcase {
    position: relative;
    isolation: isolate;

    width: 100%;
    min-height: 100svh;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #f7f5ef 0%,
            #fffefa 10%,
            #ffffff 88%,
            #f7f5ef 100%
        );
}

.materials-showcase__background {
    position: absolute;
    inset: 0;
    z-index: -2;

    overflow: hidden;
    pointer-events: none;
}

.materials-showcase__glow {
    position: absolute;

    border-radius: 50%;
}

.materials-showcase__glow--left {
    top: 12%;
    left: -20%;

    width: clamp(520px, 42vw, 980px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 203, 74, 0.1),
            transparent 69%
        );
}

.materials-showcase__glow--right {
    top: -15%;
    right: -10%;

    width: clamp(650px, 52vw, 1200px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 213, 111, 0.14),
            transparent 69%
        );
}

.materials-showcase__dots {
    position: absolute;
    right: 2.5%;
    bottom: 8%;

    width: clamp(140px, 11vw, 260px);
    height: clamp(100px, 8vw, 190px);

    opacity: 0.28;

    background-image:
        radial-gradient(
            circle,
            rgba(237, 171, 0, 0.27) 1.2px,
            transparent 1.45px
        );

    background-size: 13px 13px;
}

.materials-showcase__inner {
    position: relative;
    z-index: 2;

    width: 100%;
    min-height: 100svh;

    padding:
        clamp(95px, 6vw, 150px)
        clamp(30px, 3.8vw, 96px)
        clamp(55px, 3.7vw, 90px);
}


/* =========================================================
   MATERIALS TOP
   ========================================================= */

.materials-showcase__top {
    width: 100%;

    display: grid;
    grid-template-columns:
        minmax(410px, 37%)
        minmax(0, 63%);

    align-items: center;

    gap: clamp(20px, 2vw, 50px);
}

.materials-showcase__copy {
    position: relative;
    z-index: 5;

    min-width: 0;
    padding-right: clamp(10px, 1.2vw, 28px);
}

.materials-showcase__kicker {
    margin-bottom: clamp(25px, 1.8vw, 43px);

    color: #e9a600;

    font-size: clamp(10px, 0.68vw, 16px);
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.19em;
    text-transform: uppercase;
}

.materials-showcase__copy h2 {
    margin: 0;

    color: #111214;

    font-size: clamp(52px, 4vw, 92px);
    line-height: 1.02;
    font-weight: 640;
    letter-spacing: -0.055em;
}

.materials-showcase__copy h2 span {
    color: #efa900;
}

.materials-showcase__lead {
    width: min(100%, 680px);
    margin: clamp(28px, 2vw, 44px) 0 0;

    color: #626262;

    font-size: clamp(16px, 1.03vw, 23px);
    line-height: 1.56;
    font-weight: 400;
}

.materials-showcase__actions {
    margin-top: clamp(30px, 2.2vw, 48px);

    display: flex;
    align-items: center;

    gap: clamp(12px, 1vw, 22px);
}

.materials-showcase__button {
    min-height: clamp(55px, 3.6vw, 80px);
    padding:
        0
        clamp(21px, 1.5vw, 36px);

    display: inline-flex;
    align-items: center;
    justify-content: space-between;

    gap: clamp(17px, 1.2vw, 29px);

    border-radius: clamp(11px, 0.8vw, 18px);

    font-size: clamp(13px, 0.86vw, 20px);
    line-height: 1;
    font-weight: 680;
    white-space: nowrap;

    transition:
        transform 0.27s ease,
        border-color 0.27s ease,
        background 0.27s ease,
        box-shadow 0.27s ease;
}

.materials-showcase__button--primary {
    min-width: clamp(230px, 16vw, 360px);

    color: #171717;

    background:
        linear-gradient(
            135deg,
            #ffd15a,
            #ffb400
        );

    box-shadow:
        0 15px 34px rgba(238, 171, 0, 0.22);
}

.materials-showcase__button--secondary {
    min-width: clamp(190px, 13vw, 300px);

    color: #242424;
    background: rgba(255, 255, 255, 0.92);

    border: 1px solid rgba(20, 20, 20, 0.1);

    box-shadow:
        0 11px 28px rgba(30, 30, 30, 0.045);
}

.materials-showcase__button:hover,
.materials-showcase__button:focus-visible {
    transform: translateY(-3px);
    outline: none;
}

.materials-showcase__button--primary:hover,
.materials-showcase__button--primary:focus-visible {
    box-shadow:
        0 21px 42px rgba(238, 171, 0, 0.31);
}

.materials-showcase__button--secondary:hover,
.materials-showcase__button--secondary:focus-visible {
    border-color: rgba(238, 171, 0, 0.4);
    background: #fffaf0;
}

.materials-showcase__materials {
    margin-top: clamp(25px, 1.8vw, 40px);

    display: flex;
    flex-wrap: wrap;
    align-items: center;

    gap:
        clamp(8px, 0.6vw, 14px)
        clamp(11px, 0.75vw, 18px);

    color: #626262;

    font-size: clamp(11px, 0.73vw, 16px);
    line-height: 1;
    font-weight: 650;
}

.materials-showcase__materials i {
    width: 4px;
    height: 4px;

    flex: 0 0 auto;

    border-radius: 50%;
    background: #e9a600;
}


/* =========================================================
   MATERIALS MAIN VISUAL
   ========================================================= */

.materials-showcase__visual {
    position: relative;

    min-width: 0;
    align-self: stretch;
}

.materials-showcase__visual-stage {
    position: relative;
    isolation: isolate;

    width: 100%;
    height: clamp(540px, 37vw, 790px);

    overflow: visible;
}

.materials-showcase__visual-halo {
    position: absolute;
    top: 6%;
    right: 7%;
    z-index: -1;

    width: 79%;
    aspect-ratio: 1;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255, 195, 39, 0.18) 0%,
            rgba(255, 219, 131, 0.07) 48%,
            transparent 72%
        );
}

.materials-showcase__main-image {
    position: absolute;
    top: 53%;
    left: 8%;
    z-index: 2;

    width: 82%;
    max-width: none;
    height: auto;

    object-fit: contain;

    filter:
        drop-shadow(
            0 30px 27px rgba(35, 30, 20, 0.13)
        );

    transform: translateY(-50%);
}

/* Общий слой подписей */

.materials-showcase__callouts {
    position: absolute;
    inset: 0;
    z-index: 5;

    pointer-events: none;
}

.materials-showcase__callout {
    position: absolute;

    width: clamp(130px, 8.7vw, 178px);

    color: #292929;
}

.materials-showcase__callout strong,
.materials-showcase__callout span {
    display: block;
}

.materials-showcase__callout strong {
    color: #242424;

    font-size: clamp(10px, 0.61vw, 13px);
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.materials-showcase__callout span {
    margin-top: 7px;

    color: #626262;

    font-size: clamp(10px, 0.61vw, 13px);
    line-height: 1.45;
    font-weight: 500;
}

.materials-showcase__callout::before {
    content: "";

    position: absolute;
    top: 18px;

    height: 1px;

    border-top: 1px dashed rgba(58, 58, 58, 0.45);
}

/* DEKORATIV */

.materials-showcase__callout--decorative {
    top: 27%;
    left: 0;
}

.materials-showcase__callout--decorative::before {
    left: calc(100% + 8px);

    width: clamp(55px, 4.6vw, 98px);

    transform: rotate(10deg);
    transform-origin: left center;
}

/* ROBUST */

.materials-showcase__callout--robust {
    top: 8%;
    right: 9%;
}

.materials-showcase__callout--robust::before {
    right: calc(100% + 9px);

    width: clamp(42px, 3.4vw, 72px);

    transform: rotate(-14deg);
    transform-origin: right center;
}

/* FLEXIBEL */

.materials-showcase__callout--flexible {
    top: 34%;
    right: -1%;
}

.materials-showcase__callout--flexible::before {
    right: calc(100% + 9px);

    width: clamp(42px, 3.5vw, 75px);

    transform: rotate(-10deg);
    transform-origin: right center;
}

/* OUTDOOR */

.materials-showcase__callout--outdoor {
    top: 55%;
    right: 0;
}

.materials-showcase__callout--outdoor::before {
    right: calc(100% + 9px);

    width: clamp(48px, 3.8vw, 82px);

    transform: rotate(3deg);
    transform-origin: right center;
}


/* =========================================================
   MATERIAL CATEGORY CARDS
   ========================================================= */

.materials-showcase__categories-shell {
    width: 100%;
    margin-top: clamp(24px, 1.7vw, 40px);
}

.materials-showcase__categories {
    width: 100%;

    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: clamp(15px, 1.05vw, 25px);
}

.material-category-card {
    position: relative;
    isolation: isolate;

    min-width: 0;
    min-height: clamp(230px, 13.4vw, 320px);

    overflow: hidden;

    border: 1px solid rgba(20, 20, 20, 0.055);
    border-radius: clamp(17px, 1.1vw, 26px);

    background:
        radial-gradient(
            circle at 88% 72%,
            rgba(255, 206, 85, 0.09),
            transparent 46%
        ),
        rgba(255, 255, 255, 0.98);

    box-shadow:
        0 16px 40px rgba(33, 30, 22, 0.06);

    transition:
        transform 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        border-color 0.32s ease,
        box-shadow 0.32s ease;
}

.material-category-card:hover {
    transform: translateY(-5px);

    border-color: rgba(238, 171, 0, 0.15);

    box-shadow:
        0 23px 48px rgba(33, 30, 22, 0.09);
}

.material-category-card__copy {
    position: relative;
    z-index: 4;

    width: 73%;
    min-height: inherit;

    padding:
        clamp(19px, 1.25vw, 29px)
        0
        clamp(18px, 1.15vw, 27px)
        clamp(19px, 1.25vw, 29px);
}

.material-category-card__heading {
    display: grid;
    grid-template-columns:
        clamp(43px, 2.6vw, 58px)
        minmax(0, 1fr);

    align-items: center;

    gap: clamp(11px, 0.72vw, 16px);
}

.material-category-card__icon {
    width: clamp(43px, 2.6vw, 58px);
    aspect-ratio: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(238, 171, 0, 0.12);
    border-radius: 50%;

    background: #fff8e5;

    box-shadow:
        0 7px 17px rgba(74, 58, 20, 0.06);
}

.material-category-card__icon img {
    width: 56%;
    height: 56%;

    object-fit: contain;
}

.material-category-card h3 {
    margin: 0;

    color: #202020;

    font-size: clamp(16px, 0.92vw, 21px);
    line-height: 1.17;
    font-weight: 680;
    letter-spacing: -0.025em;
}

.material-category-card p {
    margin: 6px 0 0;

    color: #686868;

    font-size: clamp(10px, 0.62vw, 14px);
    line-height: 1.43;
}

.material-category-card ul {
    margin:
        clamp(18px, 1.15vw, 27px)
        0
        0;

    padding: 0;

    display: grid;
    gap: clamp(8px, 0.55vw, 13px);

    list-style: none;
}

.material-category-card li {
    position: relative;

    padding-left: clamp(14px, 0.82vw, 19px);

    color: #5d5d5d;

    font-size: clamp(10px, 0.61vw, 14px);
    line-height: 1.35;
}

.material-category-card li::before {
    content: "";

    position: absolute;
    top: 0.58em;
    left: 0;

    width: 4px;
    height: 4px;

    border-radius: 50%;
    background: #e7a500;
}

.material-category-card__product {
    position: absolute;
    right: 2%;
    bottom: 5%;
    z-index: 2;

    width: 34%;
    height: 58%;

    max-width: none;
    max-height: none;

    object-fit: contain;
    object-position: center bottom;
    pointer-events: none;

    filter:
        drop-shadow(
            0 17px 16px rgba(36, 31, 21, 0.12)
        );

    transform: translateY(0);

    transition:
        transform 0.42s cubic-bezier(0.22, 1, 0.36, 1);
}

/*
 * У всех изображений одинаковая область.
 * Отличается только небольшое положение внутри карточки.
 */

.material-category-card__product--cat {
    right: 2.5%;
    bottom: 4%;
}

.material-category-card__product--bracket {
    right: 1.5%;
    bottom: 5%;
}

.material-category-card__product--flexible {
    right: 1.5%;
    bottom: 4%;
}

.material-category-card__product--outdoor {
    right: 0.5%;
    bottom: 5%;
}

.material-category-card:hover
.material-category-card__product {
    transform: translateY(-5px);
}

.materials-showcase__slider-tools {
    display: none;
}


/* =========================================================
   MATERIAL CONSULTATION
   ========================================================= */

.materials-consultation {
    width: 100%;
    min-height: clamp(105px, 8vw, 175px);
    margin-top: clamp(28px, 2.1vw, 50px);
    padding:
        clamp(20px, 1.5vw, 34px)
        clamp(23px, 1.8vw, 43px);

    display: grid;
    grid-template-columns:
        minmax(340px, 1.35fr)
        minmax(500px, 1.5fr)
        auto;

    align-items: center;

    gap: clamp(22px, 1.8vw, 42px);

    border: 1px solid rgba(20, 20, 20, 0.055);
    border-radius: clamp(18px, 1.25vw, 30px);

    background:
        linear-gradient(
            100deg,
            #fff8e5 0%,
            #ffffff 43%,
            #ffffff 100%
        );

    box-shadow:
        0 18px 46px rgba(35, 31, 23, 0.065);
}

.materials-consultation__main {
    display: flex;
    align-items: center;

    gap: clamp(15px, 1.2vw, 26px);
}

.materials-consultation__icon {
    width: clamp(58px, 4vw, 88px);
    aspect-ratio: 1;

    flex: 0 0 auto;
}

.materials-consultation__icon img {
    width: 100%;
    height: 100%;

    object-fit: contain;
}

.materials-consultation__main strong,
.materials-consultation__main span {
    display: block;
}

.materials-consultation__main strong {
    color: #202020;

    font-size: clamp(15px, 1vw, 23px);
    line-height: 1.25;
    font-weight: 690;
}

.materials-consultation__main span {
    margin-top: 6px;

    color: #686868;

    font-size: clamp(11px, 0.7vw, 16px);
    line-height: 1.45;
}

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

.materials-consultation__trust article {
    position: relative;

    min-width: 0;
    padding-inline: clamp(13px, 1vw, 22px);

    display: flex;
    align-items: center;

    gap: clamp(10px, 0.8vw, 17px);
}

.materials-consultation__trust article:first-child {
    padding-left: 0;
}

.materials-consultation__trust article:last-child {
    padding-right: 0;
}

.materials-consultation__trust article:not(:last-child)::after {
    content: "";

    position: absolute;
    top: 10%;
    right: 0;

    width: 1px;
    height: 80%;

    background: rgba(20, 20, 20, 0.08);
}

.materials-consultation__trust img {
    width: clamp(32px, 2.2vw, 48px);
    height: clamp(32px, 2.2vw, 48px);

    flex: 0 0 auto;
    object-fit: contain;
}

.materials-consultation__trust strong,
.materials-consultation__trust span {
    display: block;
}

.materials-consultation__trust strong {
    color: #2b2b2b;

    font-size: clamp(10px, 0.68vw, 15px);
    line-height: 1.25;
    font-weight: 680;
}

.materials-consultation__trust span {
    margin-top: 4px;

    color: #777777;

    font-size: clamp(9px, 0.58vw, 13px);
    line-height: 1.35;
}

.materials-consultation__button {
    min-width: clamp(220px, 15vw, 340px);
    min-height: clamp(55px, 3.6vw, 80px);
    padding:
        0
        clamp(20px, 1.5vw, 35px);

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 22px;

    border-radius: clamp(11px, 0.8vw, 18px);

    background:
        linear-gradient(
            135deg,
            #ffd15a,
            #ffb400
        );

    color: #171717;

    font-size: clamp(12px, 0.8vw, 18px);
    line-height: 1;
    font-weight: 680;
    white-space: nowrap;

    box-shadow:
        0 14px 30px rgba(238, 171, 0, 0.21);

    transition:
        transform 0.26s ease,
        box-shadow 0.26s ease;
}

.materials-consultation__button:hover,
.materials-consultation__button:focus-visible {
    transform: translateY(-3px);

    box-shadow:
        0 20px 38px rgba(238, 171, 0, 0.3);

    outline: none;
}


/* =========================================================
   MATERIALS ANIMATIONS
   ========================================================= */

.materials-showcase.materials-showcase--js
[data-materials-reveal] {
    opacity: 0;
    transform: translateY(34px);

    transition:
        opacity 0.78s ease,
        transform 0.78s cubic-bezier(0.22, 1, 0.36, 1);
}

.materials-showcase.materials-showcase--js
[data-materials-reveal="copy"] {
    transform: translateX(-36px);
}

.materials-showcase.materials-showcase--js
[data-materials-reveal="visual"] {
    transform: translateX(42px);
}

.materials-showcase.materials-showcase--js.is-visible
[data-materials-reveal] {
    opacity: 1;
    transform: translate(0, 0);
}

.materials-showcase.is-visible
[data-materials-reveal="visual"] {
    transition-delay: 0.1s;
}

.materials-showcase.is-visible
[data-materials-reveal="categories"] {
    transition-delay: 0.2s;
}

.materials-showcase.is-visible
[data-materials-reveal="consultation"] {
    transition-delay: 0.3s;
}


/* =========================================================
   MATERIALS ? 1500
   ========================================================= */

@media (max-width: 1500px) and (min-width: 1181px) {
    .materials-showcase__inner {
        padding:
            88px
            42px
            62px;
    }

    .materials-showcase__top {
        grid-template-columns:
            minmax(390px, 38%)
            minmax(0, 62%);
    }

    .materials-showcase__copy h2 {
        font-size: 58px;
    }

    .materials-showcase__lead {
        font-size: 16px;
    }

    .materials-showcase__visual-stage {
        height: 555px;
    }

    .materials-showcase__main-image {
        top: 53%;
        left: 8%;

        width: 82%;
    }

    .material-category-card {
        min-height: 245px;
    }

    .material-category-card__copy {
        width: 74%;
    }

    .material-category-card__product--cat {
        width: 30%;
    }

    .material-category-card__product--bracket {
        width: 31%;
    }

    .material-category-card__product--flexible {
        width: 28%;
    }

    .material-category-card__product--outdoor {
        width: 29%;
    }

    .materials-consultation {
        grid-template-columns:
            minmax(300px, 1.2fr)
            minmax(440px, 1.45fr)
            auto;
    }
}


/* =========================================================
   MATERIALS ? 1180
   ========================================================= */

@media (max-width: 1180px) {
    .materials-showcase {
        min-height: 0;
    }

    .materials-showcase__inner {
        min-height: 0;
        padding:
            82px
            30px
            58px;
    }

    .materials-showcase__top {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .materials-showcase__copy {
        max-width: 850px;
        padding-right: 0;
    }

    .materials-showcase__copy h2 {
        font-size: clamp(54px, 6vw, 72px);
    }

    .materials-showcase__lead {
        max-width: 770px;

        font-size: 18px;
    }

    .materials-showcase__visual-stage {
        height: clamp(590px, 62vw, 700px);
    }

    .materials-showcase__main-image {
        top: 53%;
        left: 8%;

        width: 83%;
    }

    .materials-showcase__callout--decorative {
        left: 1%;
    }

    .materials-showcase__callout--robust {
        right: 10%;
    }

    .materials-showcase__callout--flexible,
    .materials-showcase__callout--outdoor {
        right: 1%;
    }

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

    .material-category-card {
        min-height: 285px;
    }

    .material-category-card__product--cat {
        width: 28%;
    }

    .material-category-card__product--bracket {
        width: 30%;
    }

    .material-category-card__product--flexible {
        width: 27%;
    }

    .material-category-card__product--outdoor {
        width: 28%;
    }

    .materials-consultation {
        grid-template-columns:
            minmax(0, 1fr)
            auto;
    }

    .materials-consultation__trust {
        grid-column: 1 / -1;
        grid-row: 2;
    }
}


/* =========================================================
   MATERIALS ? 900
   ========================================================= */

@media (max-width: 900px) {
    .materials-showcase__inner {
        padding:
            75px
            24px
            54px;
    }

    .materials-showcase__visual-stage {
        height: clamp(620px, 82vw, 710px);
    }

    .materials-showcase__main-image {
        top: 35%;
        left: 8%;

        width: 84%;
    }

    .materials-showcase__callouts {
        top: auto;
        right: 0;
        bottom: 0;
        left: 0;

        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));

        gap: 10px;
    }

    .materials-showcase__callout,
    .materials-showcase__callout--decorative,
    .materials-showcase__callout--robust,
    .materials-showcase__callout--flexible,
    .materials-showcase__callout--outdoor {
        position: relative;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;

        width: auto;
        min-height: 73px;
        padding: 12px 14px;

        border: 1px solid rgba(20, 20, 20, 0.065);
        border-radius: 14px;

        background: rgba(255, 255, 255, 0.96);

        box-shadow:
            0 8px 22px rgba(34, 30, 22, 0.05);
    }

    .materials-showcase__callout::before {
        display: none;
    }

    .materials-showcase__categories-shell {
        width: calc(100% + 24px);
    }

    .materials-showcase__categories {
        width: 100%;
        padding:
            4px
            80px
            27px
            0;

        display: flex;

        gap: 17px;

        overflow-x: auto;
        overflow-y: visible;

        scroll-snap-type: x mandatory;
        overscroll-behavior-inline: contain;

        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .materials-showcase__categories::-webkit-scrollbar {
        display: none;
    }

    .material-category-card {
        width: min(68vw, 480px);
        min-height: 300px;

        flex: 0 0 min(68vw, 480px);

        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .material-category-card:hover {
        transform: none;
    }

    .materials-showcase__slider-tools {
        padding-right: 80px;

        display: flex;
        align-items: center;
        justify-content: space-between;

        gap: 16px;
    }

    .materials-showcase__slider-tools > span {
        display: flex;
        align-items: center;

        gap: 8px;

        color: #696969;

        font-size: 13px;
        line-height: 1;
        font-weight: 600;
    }

    .materials-showcase__slider-tools b {
        color: #e7a500;

        font-size: 22px;
        line-height: 1;

        animation:
            materials-swipe-arrow
            1.35s
            ease-in-out
            infinite;
    }

    .materials-showcase__slider-dots {
        display: flex;
        align-items: center;

        gap: 7px;
    }

    .materials-showcase__slider-dots button {
        width: 8px;
        height: 8px;
        padding: 0;

        border: 0;
        border-radius: 50%;

        background: #ded8ca;

        cursor: pointer;

        transition:
            width 0.25s ease,
            border-radius 0.25s ease,
            background 0.25s ease;
    }

    .materials-showcase__slider-dots button.is-active {
        width: 24px;

        border-radius: 999px;
        background: #f0ad00;
    }

    .materials-consultation {
        grid-template-columns: 1fr;
    }

    .materials-consultation__button {
        width: 100%;
    }

    @keyframes materials-swipe-arrow {
        0%,
        100% {
            transform: translateX(0);
        }

        50% {
            transform: translateX(6px);
        }
    }
}


/* =========================================================
   MATERIALS ? 620
   ========================================================= */

@media (max-width: 620px) {
    .materials-showcase__dots {
        display: none;
    }

    .materials-showcase__inner {
        padding:
            62px
            18px
            48px;
    }

    .materials-showcase__kicker {
        margin-bottom: 21px;

        font-size: 10px;
        letter-spacing: 0.18em;
    }

    .materials-showcase__copy h2 {
        font-size: clamp(42px, 11.5vw, 51px);
        line-height: 1.03;
    }

    .materials-showcase__lead {
        margin-top: 23px;

        font-size: 16.5px;
        line-height: 1.52;
    }

    .materials-showcase__actions {
        margin-top: 27px;

        flex-direction: column;
        align-items: stretch;

        gap: 12px;
    }

    .materials-showcase__button,
    .materials-showcase__button--primary,
    .materials-showcase__button--secondary {
        width: 100%;
        min-width: 0;
        min-height: 59px;
    }

    .materials-showcase__materials {
        margin-top: 24px;

        font-size: 11px;
    }

    .materials-showcase__visual {
        margin-top: 9px;
    }

    .materials-showcase__visual-stage {
        height: clamp(570px, 148vw, 625px);
        min-height: 0;
        max-height: none;
    }

    .materials-showcase__main-image {
        top: 31%;
        left: -8%;

        width: 116%;
    }

    .materials-showcase__callouts {
        gap: 8px;
    }

    .materials-showcase__callout,
    .materials-showcase__callout--decorative,
    .materials-showcase__callout--robust,
    .materials-showcase__callout--flexible,
    .materials-showcase__callout--outdoor {
        min-height: 68px;
        padding: 10px 11px;

        border-radius: 13px;
    }

    .materials-showcase__callout strong {
        font-size: 9.5px;
    }

    .materials-showcase__callout span {
        margin-top: 5px;

        font-size: 10px;
        line-height: 1.35;
    }

    .materials-showcase__categories-shell {
        width: calc(100% + 18px);
        margin-top: 27px;
    }

    .materials-showcase__categories {
        padding:
            4px
            54px
            25px
            0;

        gap: 14px;
    }

    .material-category-card {
        width: calc(100vw - 70px);
        min-height: 395px;

        flex: 0 0 calc(100vw - 70px);

        border-radius: 20px;
    }

    .material-category-card__copy {
        width: 100%;
        min-height: inherit;

        padding:
            22px
            20px
            150px;
    }

    .material-category-card__heading {
        grid-template-columns: 51px minmax(0, 1fr);

        gap: 12px;
    }

    .material-category-card__icon {
        width: 51px;
    }

    .material-category-card h3 {
        font-size: 19px;
    }

    .material-category-card p {
        max-width: 240px;

        font-size: 12px;
    }

    .material-category-card li {
        font-size: 12px;
    }

    .material-category-card__product--cat {
        right: 5%;
        bottom: -2%;

        width: 38%;
    }

    .material-category-card__product--bracket {
        right: 4%;
        bottom: -2%;

        width: 40%;
    }

    .material-category-card__product--flexible {
        right: 6%;
        bottom: -2%;

        width: 35%;
    }

    .material-category-card__product--outdoor {
        right: 4%;
        bottom: -2%;

        width: 38%;
    }

    .materials-showcase__slider-tools {
        padding-right: 54px;
    }

    .materials-showcase__slider-tools > span {
        font-size: 12px;
    }

    .materials-showcase__slider-dots {
        gap: 5px;
    }

    .materials-showcase__slider-dots button {
        width: 7px;
        height: 7px;
    }

    .materials-showcase__slider-dots button.is-active {
        width: 20px;
    }

    .materials-consultation {
        margin-top: 36px;
        padding: 21px 19px;

        gap: 22px;

        border-radius: 19px;
    }

    .materials-consultation__main {
        align-items: flex-start;
    }

    .materials-consultation__icon {
        width: 56px;
    }

    .materials-consultation__main strong {
        font-size: 18px;
    }

    .materials-consultation__main span {
        font-size: 13px;
    }

    .materials-consultation__trust {
        display: flex;

        padding:
            3px
            44px
            17px
            0;

        gap: 12px;

        overflow-x: auto;

        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .materials-consultation__trust::-webkit-scrollbar {
        display: none;
    }

    .materials-consultation__trust article,
    .materials-consultation__trust article:first-child,
    .materials-consultation__trust article:last-child {
        width: calc(100vw - 105px);
        min-height: 82px;
        padding: 14px 15px;

        flex: 0 0 calc(100vw - 105px);

        border: 1px solid rgba(20, 20, 20, 0.06);
        border-radius: 15px;

        background: #ffffff;

        scroll-snap-align: start;
    }

    .materials-consultation__trust article::after {
        display: none;
    }

    .materials-consultation__trust img {
        width: 42px;
        height: 42px;
    }

    .materials-consultation__trust strong {
        font-size: 13px;
    }

    .materials-consultation__trust span {
        font-size: 11px;
    }

    .materials-consultation__button {
        min-width: 0;
        min-height: 58px;

        font-size: 13px;
    }
}


/* =========================================================
   MATERIALS ? 390
   ========================================================= */

@media (max-width: 390px) {
    .materials-showcase__inner {
        padding-right: 16px;
        padding-left: 16px;
    }

    .materials-showcase__categories-shell {
        width: calc(100% + 16px);
    }

    .materials-showcase__categories {
        padding-right: 48px;
    }

    .material-category-card {
        width: calc(100vw - 64px);
        flex-basis: calc(100vw - 64px);
    }

    .materials-showcase__slider-tools {
        padding-right: 48px;
    }

    .materials-showcase__visual-stage {
        height: 555px;
        min-height: 0;
    }

    .materials-showcase__main-image {
        top: 30%;
        left: -13%;

        width: 126%;
    }

    .material-category-card {
        min-height: 390px;
    }
}


/* =========================================================
   MATERIALS ? REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .materials-showcase.materials-showcase--js
    [data-materials-reveal],
    .materials-showcase__main-image,
    .material-category-card,
    .material-category-card__product,
    .materials-showcase__slider-tools b {
        animation: none !important;
        transition: none !important;
    }

    .materials-showcase.materials-showcase--js
    [data-materials-reveal] {
        opacity: 1;
        transform: none;
    }
}

/* =========================================================
   MATERIALS DETAIL
   ========================================================= */

.materials-detail {
    position: relative;
    isolation: isolate;

    width: 100%;
    min-height: 100svh;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #f7f5ef 0%,
            #fffefa 9%,
            #ffffff 90%,
            #f7f5ef 100%
        );
}

.materials-detail__background {
    position: absolute;
    inset: 0;
    z-index: -2;

    overflow: hidden;
    pointer-events: none;
}

.materials-detail__glow {
    position: absolute;

    border-radius: 50%;
}

.materials-detail__glow--left {
    top: 24%;
    left: -18%;

    width: clamp(520px, 41vw, 980px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 202, 69, 0.1),
            transparent 69%
        );
}

.materials-detail__glow--right {
    top: -16%;
    right: -13%;

    width: clamp(650px, 52vw, 1200px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 216, 117, 0.12),
            transparent 69%
        );
}

.materials-detail__dots {
    position: absolute;
    right: 2%;
    bottom: 7%;

    width: clamp(140px, 11vw, 260px);
    height: clamp(100px, 8vw, 190px);

    opacity: 0.26;

    background-image:
        radial-gradient(
            circle,
            rgba(237, 171, 0, 0.27) 1.2px,
            transparent 1.45px
        );

    background-size: 13px 13px;
}

.materials-detail__inner {
    position: relative;
    z-index: 2;

    width: 100%;
    min-height: 100svh;

    padding:
        clamp(90px, 5.5vw, 140px)
        clamp(30px, 3.8vw, 96px)
        clamp(55px, 3.7vw, 90px);
}


/* =========================================================
   MATERIALS DETAIL HEADER
   ========================================================= */

.materials-detail__header {
    width: 100%;
}

.materials-detail__label {
    width: fit-content;
    min-height: clamp(38px, 2.4vw, 52px);
    padding:
        7px
        clamp(14px, 1vw, 23px);

    display: inline-flex;
    align-items: center;
    gap: 10px;

    border: 1px solid rgba(238, 171, 0, 0.11);
    border-radius: 999px;

    background: #fff9e9;
    color: #313131;

    font-size: clamp(10px, 0.68vw, 15px);
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.17em;
    text-transform: uppercase;
}

.materials-detail__label img {
    width: clamp(20px, 1.3vw, 27px);
    height: clamp(20px, 1.3vw, 27px);

    object-fit: contain;
}

.materials-detail__header h2 {
    margin:
        clamp(25px, 1.8vw, 42px)
        0
        0;

    color: #111214;

    font-size: clamp(50px, 3.5vw, 84px);
    line-height: 1.04;
    font-weight: 640;
    letter-spacing: -0.052em;
}

.materials-detail__header h2 span {
    display: block;

    margin-top: 0.08em;

    color: #efa900;
}

.materials-detail__header > p {
    width: min(100%, 820px);
    margin:
        clamp(20px, 1.4vw, 32px)
        0
        0;

    color: #656565;

    font-size: clamp(15px, 0.95vw, 21px);
    line-height: 1.56;
}


/* =========================================================
   MATERIALS DETAIL TABS
   ========================================================= */

.materials-detail__tabs-shell {
    width: 100%;
    min-height: clamp(76px, 5.6vw, 112px);
    margin-top: clamp(35px, 2.6vw, 60px);

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        clamp(78px, 5.4vw, 112px);

    overflow: hidden;

    border: 1px solid rgba(20, 20, 20, 0.055);
    border-radius: clamp(17px, 1.2vw, 28px);

    background: rgba(255, 255, 255, 0.98);

    box-shadow:
        0 18px 48px rgba(34, 31, 23, 0.07);
}

.materials-detail__tabs {
    min-width: 0;
    min-height: inherit;

    display: flex;
    align-items: stretch;

    overflow-x: auto;
    overflow-y: hidden;

    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    overscroll-behavior-inline: contain;

    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.materials-detail__tabs::-webkit-scrollbar {
    display: none;
}

.materials-detail__tab {
    position: relative;

    min-width: 0;
    min-height: inherit;
    padding:
        0
        clamp(15px, 1.2vw, 28px);

    flex: 0 0 25%;

    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: clamp(11px, 0.9vw, 19px);

    border: 0;
    border-right: 1px solid rgba(20, 20, 20, 0.07);

    background: transparent;
    color: #292929;

    cursor: pointer;

    font-size: clamp(12px, 0.8vw, 18px);
    line-height: 1.15;
    font-weight: 680;
    white-space: nowrap;

    scroll-snap-align: start;
    scroll-snap-stop: always;

    transition:
        background 0.25s ease,
        color 0.25s ease;
}

.materials-detail__tab::after {
    content: "";

    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;

    height: 4px;

    border-radius:
        999px
        999px
        0
        0;

    background: #f1ae00;

    opacity: 0;
    transform: scaleX(0.55);

    transition:
        opacity 0.25s ease,
        transform 0.25s ease;
}

.materials-detail__tab:hover,
.materials-detail__tab:focus-visible,
.materials-detail__tab.is-active {
    background:
        linear-gradient(
            180deg,
            #fffdfa,
            #fff7e4
        );

    outline: none;
}

.materials-detail__tab.is-active::after {
    opacity: 1;
    transform: scaleX(1);
}

.materials-detail__tab img {
    width: clamp(39px, 2.7vw, 58px);
    height: clamp(39px, 2.7vw, 58px);

    flex: 0 0 auto;

    object-fit: contain;
}

.materials-detail__tabs-arrow {
    min-width: 0;
    min-height: inherit;
    padding: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 0;
    border-left: 1px solid rgba(20, 20, 20, 0.07);

    background:
        linear-gradient(
            145deg,
            #fffdf8,
            #fff7e6
        );

    color: #272727;

    cursor: pointer;

    transition:
        background 0.25s ease,
        color 0.25s ease;
}

.materials-detail__tabs-arrow span {
    display: block;

    font-size: clamp(28px, 2vw, 42px);
    line-height: 1;

    transition:
        transform 0.3s ease;
}

.materials-detail__tabs-arrow:hover,
.materials-detail__tabs-arrow:focus-visible {
    background: #fff2cf;
    color: #d99500;
    outline: none;
}

.materials-detail__tabs-arrow.is-back span {
    transform: rotate(180deg);
}

.materials-detail__tabs-arrow:disabled {
    opacity: 0.35;
    cursor: default;
}


/* =========================================================
   MATERIALS DETAIL CONTENT
   ========================================================= */

.materials-detail__content {
    width: 100%;
    margin-top: clamp(25px, 1.8vw, 42px);

    display: grid;
    grid-template-columns:
        minmax(430px, 42%)
        minmax(0, 58%);

    align-items: stretch;

    gap: clamp(20px, 1.6vw, 38px);
}

.materials-detail__product,
.materials-detail__information {
    min-width: 0;
}


/* =========================================================
   MATERIAL PRODUCT
   ========================================================= */

.materials-detail__product {
    overflow: hidden;

    border: 1px solid rgba(20, 20, 20, 0.055);
    border-radius: clamp(20px, 1.4vw, 34px);

    background: rgba(255, 255, 255, 0.98);

    box-shadow:
        0 20px 54px rgba(34, 31, 23, 0.075);
}

.materials-detail__image-stage {
    position: relative;
    isolation: isolate;

    width: 100%;
    height: clamp(470px, 31vw, 730px);

    overflow: hidden;

    background:
        radial-gradient(
            circle at 52% 46%,
            rgba(255, 209, 94, 0.13),
            transparent 55%
        ),
        linear-gradient(
            145deg,
            #fffdf9,
            #f7f4ef
        );
}

.materials-detail__image-glow {
    position: absolute;
    top: 8%;
    left: 10%;
    z-index: -1;

    width: 80%;
    aspect-ratio: 1;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255, 203, 72, 0.16),
            transparent 70%
        );
}

.materials-detail__main-image {
    position: absolute;
    top: 50%;
    left: 50%;

    width: 104%;
    max-width: none;
    height: 104%;

    object-fit: contain;
    object-position: center;

    transform:
        translate(-50%, -50%)
        scale(1);

    transition:
        opacity 0.24s ease,
        transform 0.42s cubic-bezier(0.22, 1, 0.36, 1);
}

.materials-detail__main-image.is-changing {
    opacity: 0;

    transform:
        translate(-50%, -48%)
        scale(0.97);
}

.materials-detail__colors {
    padding:
        clamp(22px, 1.6vw, 36px)
        clamp(22px, 1.7vw, 40px)
        clamp(24px, 1.7vw, 38px);

    border-top: 1px solid rgba(20, 20, 20, 0.065);
}

.materials-detail__colors-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.materials-detail__colors-header strong,
.materials-detail__colors-header span,
.materials-detail__selected-color span,
.materials-detail__selected-color small {
    display: block;
}

.materials-detail__colors-header strong {
    color: #202020;

    font-size: clamp(15px, 1vw, 22px);
    line-height: 1.2;
    font-weight: 690;
}

.materials-detail__colors-header > div:first-child span {
    margin-top: 6px;

    color: #727272;

    font-size: clamp(11px, 0.7vw, 15px);
    line-height: 1.4;
}

.materials-detail__selected-color {
    flex: 0 0 auto;

    text-align: right;
}

.materials-detail__selected-color span {
    color: #292929;

    font-size: clamp(13px, 0.86vw, 19px);
    line-height: 1.2;
    font-weight: 690;
}

.materials-detail__selected-color small {
    margin-top: 5px;

    color: #767676;

    font-size: clamp(10px, 0.62vw, 14px);
}

.materials-detail__selected-color b {
    color: #d99500;
}

.materials-detail__swatches-shell {
    width: 100%;
    margin-top: clamp(19px, 1.35vw, 30px);

    display: grid;
    grid-template-columns:
        clamp(42px, 2.8vw, 58px)
        minmax(0, 1fr)
        clamp(42px, 2.8vw, 58px);

    align-items: center;
    gap: clamp(9px, 0.7vw, 15px);
}

.materials-detail__swatches {
    min-width: 0;
    padding:
        7px
        5px
        10px;

    display: flex;
    align-items: center;
    gap: clamp(12px, 0.9vw, 19px);

    overflow-x: auto;
    overflow-y: hidden;

    scroll-behavior: smooth;
    scroll-snap-type: x proximity;
    overscroll-behavior-inline: contain;

    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.materials-detail__swatches::-webkit-scrollbar {
    display: none;
}

.materials-detail__swatch {
    width: clamp(45px, 2.8vw, 58px);
    min-width: clamp(45px, 2.8vw, 58px);
    padding: 0;

    flex: 0 0 clamp(45px, 2.8vw, 58px);

    display: flex;
    align-items: center;
    justify-content: center;

    border: 0;
    background: transparent;

    cursor: pointer;

    scroll-snap-align: center;
}

.materials-detail__swatch-circle {
    width: clamp(40px, 2.45vw, 53px);
    aspect-ratio: 1;

    display: block;

    border: 2px solid #ffffff;
    border-radius: 50%;

    background: var(--swatch-fill);

    box-shadow:
        0 0 0 1px rgba(20, 20, 20, 0.12),
        0 6px 14px rgba(28, 25, 18, 0.08);

    transition:
        transform 0.23s ease,
        box-shadow 0.23s ease;
}

.materials-detail__swatch:hover
.materials-detail__swatch-circle,
.materials-detail__swatch:focus-visible
.materials-detail__swatch-circle {
    transform: translateY(-3px);

    box-shadow:
        0 0 0 2px rgba(238, 171, 0, 0.3),
        0 9px 18px rgba(28, 25, 18, 0.11);
}

.materials-detail__swatch:focus-visible {
    outline: none;
}

.materials-detail__swatch.is-active
.materials-detail__swatch-circle {
    transform: scale(1.07);

    box-shadow:
        0 0 0 3px #ffffff,
        0 0 0 5px #f0ad00,
        0 9px 18px rgba(28, 25, 18, 0.12);
}

.materials-detail__colors-arrow {
    width: 100%;
    aspect-ratio: 1;
    padding: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(20, 20, 20, 0.08);
    border-radius: 50%;

    background: #fffaf0;
    color: #d99600;

    cursor: pointer;

    box-shadow:
        0 7px 18px rgba(34, 31, 23, 0.07);

    transition:
        transform 0.24s ease,
        border-color 0.24s ease,
        background 0.24s ease,
        opacity 0.24s ease;
}

.materials-detail__colors-arrow span {
    font-size: clamp(20px, 1.4vw, 28px);
    line-height: 1;
}

.materials-detail__colors-arrow:hover,
.materials-detail__colors-arrow:focus-visible {
    transform: translateY(-2px);

    border-color: rgba(238, 171, 0, 0.35);
    background: #fff4d6;

    outline: none;
}

.materials-detail__colors-arrow:disabled {
    opacity: 0.28;
    cursor: default;
    transform: none;
}

.materials-detail__colors-hint {
    margin-top: 12px;
}

.materials-detail__colors-hint small {
    color: #777777;

    font-size: clamp(10px, 0.65vw, 14px);
    line-height: 1.4;
}


/* =========================================================
   MATERIAL INFORMATION
   ========================================================= */

.materials-detail__information {
    min-width: 0;

    display: flex;
    flex-direction: column;
}

.materials-detail__information-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(12px, 0.9vw, 20px);
}

.materials-detail__info-card {
    min-width: 0;
    min-height: clamp(190px, 11.5vw, 265px);
    padding:
        clamp(24px, 1.65vw, 38px)
        clamp(22px, 1.55vw, 36px);

    display: grid;
    grid-template-columns:
        clamp(54px, 3.4vw, 72px)
        minmax(0, 1fr);

    align-items: start;
    gap: clamp(16px, 1.05vw, 24px);

    border: 1px solid rgba(20, 20, 20, 0.06);
    border-radius: clamp(18px, 1.2vw, 27px);

    background: rgba(255, 255, 255, 0.98);

    box-shadow:
        0 12px 30px rgba(35, 31, 23, 0.045);
}

.materials-detail__info-icon {
    width: clamp(54px, 3.4vw, 72px);
    aspect-ratio: 1;
    margin-top: 1px;

    display: flex;
    align-items: flex-start;
    justify-content: center;

    border: 0;
    background: transparent;
}

.materials-detail__info-icon img {
    width: 100%;
    height: 100%;

    object-fit: contain;
}

.materials-detail__info-card h3 {
    margin: 2px 0 0;

    color: #222222;

    font-size: clamp(17px, 1.08vw, 24px);
    line-height: 1.25;
    font-weight: 690;
    letter-spacing: -0.025em;
}

.materials-detail__info-card ul {
    margin:
        clamp(14px, 0.95vw, 21px)
        0
        0;

    padding: 0;

    display: grid;
    gap: clamp(8px, 0.58vw, 13px);

    list-style: none;
}

.materials-detail__info-card li {
    position: relative;

    padding-left: 17px;

    color: #5b5b5b;

    font-size: clamp(12px, 0.76vw, 17px);
    line-height: 1.5;
}

.materials-detail__info-card li::before {
    content: "";

    position: absolute;
    top: 0.68em;
    left: 0;

    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: #efad00;
}

.materials-detail__info-card p {
    max-width: 48ch;
    margin:
        clamp(14px, 0.95vw, 21px)
        0
        0;

    color: #5f5f5f;

    font-size: clamp(12px, 0.76vw, 17px);
    line-height: 1.62;
}

.materials-detail__business {
    width: 100%;
    margin-top: clamp(15px, 1vw, 23px);
    padding:
        clamp(22px, 1.5vw, 34px)
        clamp(23px, 1.65vw, 38px);

    display: grid;
    grid-template-columns:
        clamp(58px, 3.8vw, 80px)
        minmax(0, 1fr);

    align-items: start;
    gap: clamp(17px, 1.2vw, 27px);

    border: 1px solid rgba(238, 171, 0, 0.16);
    border-radius: clamp(18px, 1.25vw, 29px);

    background:
        linear-gradient(
            120deg,
            #fff9e9,
            #fffdf8
        );

    box-shadow:
        0 15px 38px rgba(58, 47, 23, 0.055);
}

.materials-detail__business[hidden] {
    display: none;
}

.materials-detail__business-icon {
    width: clamp(58px, 3.8vw, 80px);
    aspect-ratio: 1;
}

.materials-detail__business-icon img {
    width: 100%;
    height: 100%;

    object-fit: contain;
}

.materials-detail__business h3 {
    margin: 2px 0 0;

    color: #252525;

    font-size: clamp(17px, 1.08vw, 24px);
    line-height: 1.28;
    font-weight: 690;
}

.materials-detail__business p {
    margin: 10px 0 0;

    color: #5f5f5f;

    font-size: clamp(12px, 0.76vw, 17px);
    line-height: 1.58;
}

.materials-detail__business p strong {
    color: #292929;
    font-weight: 700;
}


/* =========================================================
   MATERIALS DETAIL FOOTER
   ========================================================= */

.materials-detail__footer {
    width: 100%;
    min-height: clamp(105px, 7.8vw, 175px);
    margin-top: clamp(27px, 2vw, 48px);
    padding:
        clamp(18px, 1.35vw, 31px)
        clamp(20px, 1.7vw, 40px);

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        auto;

    align-items: center;
    gap: clamp(20px, 1.6vw, 38px);

    border: 1px solid rgba(20, 20, 20, 0.055);
    border-radius: clamp(18px, 1.25vw, 30px);

    background: rgba(255, 255, 255, 0.98);

    box-shadow:
        0 18px 46px rgba(35, 31, 23, 0.065);
}

.materials-detail__footer-benefits {
    min-width: 0;

    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.materials-detail__footer-benefits article {
    position: relative;

    min-width: 0;
    padding-inline: clamp(13px, 1vw, 23px);

    display: flex;
    align-items: center;
    gap: clamp(11px, 0.8vw, 17px);
}

.materials-detail__footer-benefits article:first-child {
    padding-left: 0;
}

.materials-detail__footer-benefits article:last-child {
    padding-right: 0;
}

.materials-detail__footer-benefits article:not(:last-child)::after {
    content: "";

    position: absolute;
    top: 12%;
    right: 0;

    width: 1px;
    height: 76%;

    background: rgba(20, 20, 20, 0.08);
}

.materials-detail__footer-benefits img {
    width: clamp(39px, 2.7vw, 58px);
    height: clamp(39px, 2.7vw, 58px);

    flex: 0 0 auto;
    object-fit: contain;
}

.materials-detail__footer-benefits strong,
.materials-detail__footer-benefits span {
    display: block;
}

.materials-detail__footer-benefits strong {
    color: #2b2b2b;

    font-size: clamp(10px, 0.7vw, 15px);
    line-height: 1.32;
    font-weight: 690;
}

.materials-detail__footer-benefits span {
    margin-top: 5px;

    color: #757575;

    font-size: clamp(9px, 0.58vw, 13px);
    line-height: 1.4;
}

.materials-detail__footer-button {
    min-width: clamp(235px, 16vw, 360px);
    min-height: clamp(57px, 3.8vw, 84px);
    padding:
        0
        clamp(22px, 1.6vw, 38px);

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 23px;

    border-radius: clamp(12px, 0.8vw, 19px);

    background:
        linear-gradient(
            135deg,
            #ffd15a,
            #ffb400
        );

    color: #171717;

    font-size: clamp(13px, 0.85vw, 19px);
    line-height: 1;
    font-weight: 680;
    white-space: nowrap;

    box-shadow:
        0 15px 34px rgba(238, 171, 0, 0.22);

    transition:
        transform 0.27s ease,
        box-shadow 0.27s ease;
}

.materials-detail__footer-button img {
    width: clamp(21px, 1.4vw, 29px);
    height: clamp(21px, 1.4vw, 29px);

    object-fit: contain;
}

.materials-detail__footer-button:hover,
.materials-detail__footer-button:focus-visible {
    transform: translateY(-3px);

    box-shadow:
        0 21px 42px rgba(238, 171, 0, 0.31);

    outline: none;
}


/* =========================================================
   MATERIALS DETAIL ANIMATIONS
   ========================================================= */

.materials-detail.materials-detail--js
[data-materials-detail-reveal] {
    opacity: 0;
    transform: translateY(34px);

    transition:
        opacity 0.78s ease,
        transform 0.78s cubic-bezier(0.22, 1, 0.36, 1);
}

.materials-detail.materials-detail--js.is-visible
[data-materials-detail-reveal] {
    opacity: 1;
    transform: translateY(0);
}

.materials-detail.is-visible
[data-materials-detail-reveal="tabs"] {
    transition-delay: 0.08s;
}

.materials-detail.is-visible
[data-materials-detail-reveal="content"] {
    transition-delay: 0.16s;
}

.materials-detail.is-visible
[data-materials-detail-reveal="footer"] {
    transition-delay: 0.24s;
}


/* =========================================================
   MATERIALS DETAIL — 1500
   ========================================================= */

@media (max-width: 1500px) and (min-width: 1181px) {
    .materials-detail__inner {
        padding:
            88px
            42px
            62px;
    }

    .materials-detail__header h2 {
        font-size: 56px;
    }

    .materials-detail__header > p {
        font-size: 16px;
    }

    .materials-detail__content {
        grid-template-columns:
            minmax(400px, 41%)
            minmax(0, 59%);
    }

    .materials-detail__image-stage {
        height: 510px;
    }

    .materials-detail__info-card {
        min-height: 215px;
        padding: 25px 22px;
    }

    .materials-detail__info-card h3,
    .materials-detail__business h3 {
        font-size: 17px;
    }

    .materials-detail__info-card li,
    .materials-detail__info-card p,
    .materials-detail__business p {
        font-size: 13px;
    }
}


/* =========================================================
   MATERIALS DETAIL — 1180
   ========================================================= */

@media (max-width: 1180px) {
    .materials-detail {
        min-height: 0;
    }

    .materials-detail__inner {
        min-height: 0;
        padding:
            82px
            30px
            60px;
    }

    .materials-detail__header h2 {
        font-size: clamp(50px, 6vw, 70px);
    }

    .materials-detail__header > p {
        font-size: 18px;
    }

    .materials-detail__tabs-shell {
        grid-template-columns:
            minmax(0, 1fr)
            82px;
    }

    .materials-detail__content {
        grid-template-columns: 1fr;
    }

    .materials-detail__image-stage {
        height: clamp(540px, 62vw, 680px);
    }

    .materials-detail__main-image {
        width: 100%;
        height: 100%;
    }

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

    .materials-detail__info-card {
        min-height: 220px;
    }

    .materials-detail__footer {
        grid-template-columns: 1fr;
    }

    .materials-detail__footer-button {
        width: 100%;
    }
}


/* =========================================================
   MATERIALS DETAIL — 900
   ========================================================= */

@media (max-width: 900px) {
    .materials-detail__inner {
        padding:
            74px
            24px
            55px;
    }

    .materials-detail__tab {
        flex-basis: 33.333%;
    }

    .materials-detail__image-stage {
        height: clamp(470px, 72vw, 590px);
    }

    .materials-detail__main-image {
        width: 105%;
        height: 105%;
    }

    .materials-detail__information-grid {
        grid-template-columns: 1fr;
        gap: 13px;
    }

    .materials-detail__info-card {
        min-height: 0;
    }

    .materials-detail__footer-benefits {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 23px 0;
    }

    .materials-detail__footer-benefits
    article:nth-child(2)::after {
        display: none;
    }

    .materials-detail__footer-benefits
    article:nth-child(3) {
        padding-left: 0;
    }
}


/* =========================================================
   MATERIALS DETAIL — 620
   ========================================================= */

@media (max-width: 620px) {
    .materials-detail__dots {
        display: none;
    }

    .materials-detail__inner {
        padding:
            62px
            18px
            48px;
    }

    .materials-detail__label {
        min-height: 37px;

        font-size: 9.5px;
        letter-spacing: 0.15em;
    }

    .materials-detail__header h2 {
        font-size: clamp(40px, 11vw, 49px);
        line-height: 1.04;
    }

    .materials-detail__header > p {
        font-size: 16.5px;
        line-height: 1.52;
    }

    .materials-detail__tabs-shell {
        width: calc(100% + 18px);
        min-height: 78px;
        margin-top: 34px;

        grid-template-columns:
            minmax(0, 1fr)
            58px;

        border-radius:
            17px
            0
            0
            17px;
    }

    .materials-detail__tab {
        min-width: 178px;
        flex: 0 0 178px;
        padding: 0 17px;

        font-size: 13px;
    }

    .materials-detail__tab img {
        width: 46px;
        height: 46px;
    }

    .materials-detail__tabs-arrow span {
        font-size: 28px;
    }

    .materials-detail__content {
        margin-top: 21px;
        gap: 25px;
    }

    .materials-detail__product {
        border-radius: 21px;
    }

    .materials-detail__image-stage {
        height: 390px;
    }

    .materials-detail__main-image {
        width: 112%;
        height: 112%;
    }

    .materials-detail__colors {
        padding:
            21px
            18px
            23px;
    }

    .materials-detail__colors-header {
        display: grid;
        grid-template-columns:
            minmax(0, 1fr)
            auto;
    }

    .materials-detail__colors-header strong {
        font-size: 17px;
    }

    .materials-detail__colors-header > div:first-child span {
        font-size: 11px;
    }

    .materials-detail__selected-color span {
        font-size: 14px;
    }

    .materials-detail__swatches-shell {
        grid-template-columns:
            41px
            minmax(0, 1fr)
            41px;

        gap: 8px;
    }

    .materials-detail__swatches {
        gap: 12px;
    }

    .materials-detail__swatch {
        width: 48px;
        min-width: 48px;

        flex-basis: 48px;
    }

    .materials-detail__swatch-circle {
        width: 43px;
    }

    .materials-detail__information-grid {
        gap: 12px;
    }

    .materials-detail__info-card {
        padding: 22px 19px;

        grid-template-columns:
            52px
            minmax(0, 1fr);

        gap: 15px;

        border-radius: 19px;
    }

    .materials-detail__info-icon {
        width: 52px;
    }

    .materials-detail__info-card h3 {
        font-size: 18px;
    }

    .materials-detail__info-card li,
    .materials-detail__info-card p {
        font-size: 13px;
    }

    .materials-detail__business {
        margin-top: 13px;
        padding: 21px 18px;

        grid-template-columns:
            55px
            minmax(0, 1fr);

        gap: 14px;

        border-radius: 19px;
    }

    .materials-detail__business-icon {
        width: 55px;
    }

    .materials-detail__business h3 {
        font-size: 17px;
    }

    .materials-detail__business p {
        font-size: 12.5px;
    }

    .materials-detail__footer {
        margin-top: 32px;
        padding: 0;

        display: block;

        overflow: visible;

        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .materials-detail__footer-benefits {
        width: calc(100% + 18px);
        padding:
            4px
            54px
            24px
            0;

        display: flex;
        gap: 13px;

        overflow-x: auto;

        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .materials-detail__footer-benefits::-webkit-scrollbar {
        display: none;
    }

    .materials-detail__footer-benefits article,
    .materials-detail__footer-benefits article:first-child,
    .materials-detail__footer-benefits article:last-child,
    .materials-detail__footer-benefits article:nth-child(3) {
        width: calc(100vw - 70px);
        min-height: 92px;
        padding: 16px 17px;

        flex: 0 0 calc(100vw - 70px);

        border: 1px solid rgba(20, 20, 20, 0.06);
        border-radius: 16px;

        background: rgba(255, 255, 255, 0.98);

        box-shadow:
            0 10px 27px rgba(34, 31, 23, 0.06);

        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .materials-detail__footer-benefits
    article::after {
        display: none;
    }

    .materials-detail__footer-benefits img {
        width: 49px;
        height: 49px;
    }

    .materials-detail__footer-benefits strong {
        font-size: 13px;
    }

    .materials-detail__footer-benefits span {
        font-size: 11px;
    }

    .materials-detail__footer-button {
        width: 100%;
        min-width: 0;
        min-height: 59px;
        margin-top: 13px;

        font-size: 13px;
    }

}


/* =========================================================
   MATERIALS DETAIL — 390
   ========================================================= */

@media (max-width: 390px) {
    .materials-detail__inner {
        padding-right: 16px;
        padding-left: 16px;
    }

    .materials-detail__tabs-shell,
    .materials-detail__footer-benefits {
        width: calc(100% + 16px);
    }

    .materials-detail__image-stage {
        height: 345px;
    }

    .materials-detail__main-image {
        width: 116%;
        height: 116%;
    }

    .materials-detail__swatches-shell {
        grid-template-columns:
            38px
            minmax(0, 1fr)
            38px;
    }

    .materials-detail__info-card {
        grid-template-columns:
            48px
            minmax(0, 1fr);
    }

    .materials-detail__info-icon {
        width: 48px;
    }

    .materials-detail__business {
        grid-template-columns: 1fr;
    }

    .materials-detail__business-icon {
        width: 52px;
    }

    .materials-detail__footer-benefits {
        padding-right: 48px;
    }

    .materials-detail__footer-benefits article,
    .materials-detail__footer-benefits article:first-child,
    .materials-detail__footer-benefits article:last-child,
    .materials-detail__footer-benefits article:nth-child(3) {
        width: calc(100vw - 64px);
        flex-basis: calc(100vw - 64px);
    }
}


/* =========================================================
   MATERIALS DETAIL — REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .materials-detail.materials-detail--js
    [data-materials-detail-reveal],
    .materials-detail__main-image,
    .materials-detail__swatch-circle,
    .materials-detail__colors-hint > span b {
        animation: none !important;
        transition: none !important;
    }

    .materials-detail.materials-detail--js
    [data-materials-detail-reveal] {
        opacity: 1;
        transform: none;
    }
}

/* =========================================================
   TRUST SECTION
   ========================================================= */

.trust-section {
    position: relative;
    isolation: isolate;

    width: 100%;
    min-height: 100svh;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #f7f5ef 0%,
            #fffefa 11%,
            #ffffff 89%,
            #f7f5ef 100%
        );
}

.trust-section__background {
    position: absolute;
    inset: 0;
    z-index: -2;

    overflow: hidden;
    pointer-events: none;
}

.trust-section__glow {
    position: absolute;

    border-radius: 50%;
}

.trust-section__glow--left {
    top: 16%;
    left: -18%;

    width: clamp(520px, 42vw, 980px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 202, 69, 0.11),
            transparent 69%
        );
}

.trust-section__glow--right {
    top: -14%;
    right: -14%;

    width: clamp(620px, 50vw, 1150px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 217, 120, 0.12),
            transparent 69%
        );
}

.trust-section__dots {
    position: absolute;
    right: 2%;
    bottom: 8%;

    width: clamp(140px, 11vw, 260px);
    height: clamp(100px, 8vw, 190px);

    opacity: 0.28;

    background-image:
        radial-gradient(
            circle,
            rgba(237, 171, 0, 0.27) 1.2px,
            transparent 1.45px
        );

    background-size: 13px 13px;
}

.trust-section__inner {
    position: relative;
    z-index: 2;

    width: 100%;
    min-height: 100svh;

    padding:
        clamp(100px, 6vw, 150px)
        clamp(30px, 3.8vw, 96px)
        clamp(55px, 3.7vw, 90px);
}

.trust-section__main {
    width: 100%;

    display: grid;
    grid-template-columns:
        minmax(430px, 46%)
        minmax(0, 54%);

    align-items: stretch;

    gap: clamp(35px, 3vw, 72px);
}


/* =========================================================
   TRUST STORY
   ========================================================= */

.trust-section__story {
    position: relative;

    min-width: 0;

    display: flex;
    flex-direction: column;
}

.trust-section__kicker {
    margin-bottom: clamp(25px, 1.8vw, 43px);

    color: #e9a600;

    font-size: clamp(10px, 0.68vw, 16px);
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.19em;
    text-transform: uppercase;
}

.trust-section__story h2 {
    margin: 0;

    color: #111214;

    font-size: clamp(48px, 3.55vw, 82px);
    line-height: 1.03;
    font-weight: 640;
    letter-spacing: -0.052em;
}

.trust-section__story h2 span {
    display: block;

    margin-top: 0.08em;

    color: #efa900;
}

.trust-section__lead {
    width: min(100%, 700px);
    margin: clamp(25px, 1.8vw, 42px) 0 0;

    color: #626262;

    font-size: clamp(15px, 1vw, 22px);
    line-height: 1.57;
    font-weight: 400;
}

.trust-section__actions {
    margin-top: clamp(27px, 2vw, 46px);

    display: flex;
    align-items: center;

    gap: clamp(20px, 1.6vw, 36px);
}

.trust-section__button {
    min-width: clamp(210px, 14.5vw, 325px);
    min-height: clamp(55px, 3.6vw, 80px);
    padding:
        0
        clamp(21px, 1.5vw, 36px);

    display: inline-flex;
    align-items: center;
    justify-content: space-between;

    gap: 24px;

    border-radius: clamp(11px, 0.8vw, 18px);

    background:
        linear-gradient(
            135deg,
            #ffd15a,
            #ffb400
        );

    color: #171717;

    font-size: clamp(13px, 0.86vw, 20px);
    line-height: 1;
    font-weight: 680;
    white-space: nowrap;

    box-shadow:
        0 15px 34px rgba(238, 171, 0, 0.22);

    transition:
        transform 0.27s ease,
        box-shadow 0.27s ease;
}

.trust-section__button span:last-child {
    font-size: 1.45em;

    transition: transform 0.27s ease;
}

.trust-section__button:hover,
.trust-section__button:focus-visible {
    transform: translateY(-3px);

    box-shadow:
        0 21px 42px rgba(238, 171, 0, 0.31);

    outline: none;
}

.trust-section__button:hover span:last-child {
    transform: translate(4px, -4px);
}

.trust-section__proof {
    display: flex;
    align-items: center;

    gap: 11px;
}

.trust-section__proof img {
    width: clamp(31px, 2vw, 42px);
    height: clamp(31px, 2vw, 42px);

    flex: 0 0 auto;
    object-fit: contain;
}

.trust-section__proof strong,
.trust-section__proof span {
    display: block;
}

.trust-section__proof strong {
    color: #292929;

    font-size: clamp(11px, 0.72vw, 16px);
    line-height: 1.25;
    font-weight: 680;
}

.trust-section__proof span {
    margin-top: 4px;

    color: #757575;

    font-size: clamp(9px, 0.61vw, 13px);
    line-height: 1.3;
}


/* =========================================================
   TRUST MAIN IMAGE
   ========================================================= */

.trust-section__visual {
    position: relative;
    isolation: isolate;

    width: 100%;
    height: clamp(390px, 26vw, 610px);
    margin-top: clamp(18px, 1.5vw, 35px);
}

.trust-section__visual-glow {
    position: absolute;
    top: 4%;
    left: 8%;
    z-index: -1;

    width: 78%;
    aspect-ratio: 1;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255, 196, 42, 0.2),
            rgba(255, 221, 132, 0.07) 49%,
            transparent 72%
        );
}

.trust-section__main-image {
    position: absolute;
    right: -2%;
    bottom: -2%;

    width: 108%;
    max-width: none;
    height: 104%;

    object-fit: contain;
    object-position: center bottom;

    filter:
        drop-shadow(
            0 29px 25px rgba(39, 33, 21, 0.13)
        );

    animation:
        trust-main-image-float
        7s
        ease-in-out
        infinite alternate;
}

@keyframes trust-main-image-float {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(-7px);
    }
}


/* =========================================================
   TRUST FEATURE CARDS
   ========================================================= */

.trust-section__features-shell {
    min-width: 0;
}

.trust-section__features {
    width: 100%;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: clamp(16px, 1.15vw, 27px);
}

.trust-feature-card {
    position: relative;

    min-width: 0;
    min-height: clamp(150px, 10.2vw, 225px);
    padding:
        clamp(22px, 1.5vw, 34px)
        clamp(20px, 1.4vw, 32px);

    display: grid;
    grid-template-columns:
        clamp(54px, 3.6vw, 78px)
        minmax(0, 1fr);

    align-items: start;

    gap: clamp(15px, 1vw, 22px);

    overflow: hidden;

    border: 1px solid rgba(20, 20, 20, 0.055);
    border-radius: clamp(17px, 1.15vw, 27px);

    background:
        radial-gradient(
            circle at 10% 18%,
            rgba(255, 205, 78, 0.1),
            transparent 34%
        ),
        rgba(255, 255, 255, 0.98);

    box-shadow:
        0 16px 42px rgba(34, 31, 23, 0.065);

    transition:
        transform 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}

.trust-feature-card:hover {
    transform: translateY(-5px);

    border-color: rgba(238, 171, 0, 0.16);

    box-shadow:
        0 24px 50px rgba(34, 31, 23, 0.095);
}

.trust-feature-card--wide {
    grid-column: 1 / -1;

    min-height: clamp(125px, 8.6vw, 190px);

    grid-template-columns:
        clamp(54px, 3.6vw, 78px)
        minmax(0, 1fr);
}

.trust-feature-card__icon {
    width: clamp(54px, 3.6vw, 78px);
    aspect-ratio: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(238, 171, 0, 0.12);
    border-radius: 50%;

    background: #fff8e5;

    box-shadow:
        0 8px 19px rgba(70, 54, 18, 0.06);
}

.trust-feature-card__icon img {
    width: 58%;
    height: 58%;

    object-fit: contain;
}

.trust-feature-card__number {
    display: inline;

    margin-right: 5px;

    color: #e7a500;

    font-size: clamp(14px, 0.9vw, 20px);
    line-height: 1.2;
    font-weight: 760;
}

.trust-feature-card h3 {
    display: inline;

    margin: 0;

    color: #202020;

    font-size: clamp(15px, 1vw, 22px);
    line-height: 1.25;
    font-weight: 690;
    letter-spacing: -0.025em;
}

.trust-feature-card p {
    margin: clamp(10px, 0.7vw, 16px) 0 0;

    color: #626262;

    font-size: clamp(11px, 0.72vw, 16px);
    line-height: 1.55;
}

.trust-feature-card--wide p {
    max-width: 880px;
}

.trust-section__slider-tools {
    display: none;
}


/* =========================================================
   TRUST CTA
   ========================================================= */

.trust-project-cta {
    width: 100%;
    min-height: clamp(112px, 8.4vw, 185px);
    margin-top: clamp(30px, 2.2vw, 52px);
    padding:
        clamp(20px, 1.5vw, 34px)
        clamp(24px, 1.9vw, 46px);

    display: grid;
    grid-template-columns:
        minmax(370px, 1.45fr)
        auto
        minmax(290px, 0.85fr);

    align-items: center;

    gap: clamp(24px, 2vw, 48px);

    border: 1px solid rgba(238, 171, 0, 0.09);
    border-radius: clamp(18px, 1.25vw, 30px);

    background:
        linear-gradient(
            100deg,
            #fff8e5 0%,
            #ffffff 46%,
            #ffffff 100%
        );

    box-shadow:
        0 18px 46px rgba(35, 31, 23, 0.065);
}

.trust-project-cta__intro {
    display: flex;
    align-items: center;

    gap: clamp(17px, 1.3vw, 28px);
}

.trust-project-cta__icon {
    width: clamp(64px, 4.4vw, 95px);
    aspect-ratio: 1;

    flex: 0 0 auto;
}

.trust-project-cta__icon img {
    width: 100%;
    height: 100%;

    object-fit: contain;
}

.trust-project-cta__intro strong,
.trust-project-cta__intro span {
    display: block;
}

.trust-project-cta__intro strong {
    color: #202020;

    font-size: clamp(19px, 1.35vw, 30px);
    line-height: 1.2;
    font-weight: 690;
    letter-spacing: -0.035em;
}

.trust-project-cta__intro span {
    margin-top: 7px;

    color: #686868;

    font-size: clamp(11px, 0.74vw, 16px);
    line-height: 1.47;
}

.trust-project-cta__button {
    min-width: clamp(260px, 18vw, 410px);
    min-height: clamp(57px, 3.8vw, 84px);
    padding:
        0
        clamp(22px, 1.6vw, 39px);

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 23px;

    border-radius: clamp(12px, 0.8vw, 19px);

    background:
        linear-gradient(
            135deg,
            #ffd15a,
            #ffb400
        );

    color: #171717;

    font-size: clamp(13px, 0.85vw, 19px);
    line-height: 1;
    font-weight: 680;
    white-space: nowrap;

    box-shadow:
        0 15px 34px rgba(238, 171, 0, 0.22);

    transition:
        transform 0.27s ease,
        box-shadow 0.27s ease;
}

.trust-project-cta__button:hover,
.trust-project-cta__button:focus-visible {
    transform: translateY(-3px);

    box-shadow:
        0 21px 42px rgba(238, 171, 0, 0.31);

    outline: none;
}

.trust-project-cta__contact {
    display: flex;
    align-items: center;

    gap: clamp(15px, 1vw, 22px);
}

.trust-project-cta__avatars {
    display: flex;
    align-items: center;

    flex: 0 0 auto;
}

.trust-project-cta__avatars img {
    width: clamp(41px, 2.7vw, 60px);
    height: clamp(41px, 2.7vw, 60px);

    border: 3px solid #ffffff;
    border-radius: 50%;

    object-fit: cover;

    box-shadow:
        0 6px 15px rgba(30, 30, 30, 0.09);
}

.trust-project-cta__avatars img + img {
    margin-left: clamp(-13px, -0.65vw, -8px);
}

.trust-project-cta__contact strong,
.trust-project-cta__contact span {
    display: block;
}

.trust-project-cta__contact strong {
    color: #292929;

    font-size: clamp(11px, 0.74vw, 16px);
    line-height: 1.3;
    font-weight: 680;
}

.trust-project-cta__contact span {
    margin-top: 5px;

    color: #737373;

    font-size: clamp(9px, 0.61vw, 13px);
    line-height: 1.35;
}


/* =========================================================
   TRUST ANIMATIONS
   ========================================================= */

.trust-section.trust-section--js
[data-trust-reveal] {
    opacity: 0;

    transform: translateY(34px);

    transition:
        opacity 0.78s ease,
        transform 0.78s cubic-bezier(0.22, 1, 0.36, 1);
}

.trust-section.trust-section--js
[data-trust-reveal="story"] {
    transform: translateX(-38px);
}

.trust-section.trust-section--js
[data-trust-reveal="features"] {
    transform: translateX(42px);
}

.trust-section.trust-section--js.is-visible
[data-trust-reveal] {
    opacity: 1;

    transform: translate(0, 0);
}

.trust-section.is-visible
[data-trust-reveal="features"] {
    transition-delay: 0.12s;
}

.trust-section.is-visible
[data-trust-reveal="cta"] {
    transition-delay: 0.24s;
}


/* =========================================================
   TRUST ? 1500
   ========================================================= */

@media (max-width: 1500px) and (min-width: 1181px) {
    .trust-section__inner {
        padding:
            90px
            42px
            64px;
    }

    .trust-section__main {
        grid-template-columns:
            minmax(390px, 45%)
            minmax(0, 55%);

        gap: 34px;
    }

    .trust-section__story h2 {
        font-size: 52px;
    }

    .trust-section__lead {
        font-size: 16px;
    }

    .trust-section__visual {
        height: 430px;
    }

    .trust-feature-card {
        min-height: 165px;
        padding: 22px 20px;
    }

    .trust-feature-card--wide {
        min-height: 135px;
    }

    .trust-feature-card h3 {
        font-size: 16px;
    }

    .trust-feature-card p {
        font-size: 12px;
    }

    .trust-project-cta {
        grid-template-columns:
            minmax(330px, 1.3fr)
            auto
            minmax(255px, 0.8fr);
    }
}


/* =========================================================
   TRUST ? 1180
   ========================================================= */

@media (max-width: 1180px) {
    .trust-section {
        min-height: 0;
    }

    .trust-section__inner {
        min-height: 0;

        padding:
            82px
            30px
            60px;
    }

    .trust-section__main {
        grid-template-columns: 1fr;

        gap: 45px;
    }

    .trust-section__story {
        max-width: 100%;
    }

    .trust-section__story h2 {
        max-width: 900px;

        font-size: clamp(52px, 6vw, 70px);
    }

    .trust-section__lead {
        max-width: 780px;

        font-size: 18px;
    }

    .trust-section__visual {
        width: min(100%, 880px);
        height: clamp(480px, 55vw, 620px);
    }

    .trust-section__main-image {
        right: auto;
        left: -2%;

        width: 103%;
    }

    .trust-section__features {
        gap: 20px;
    }

    .trust-feature-card {
        min-height: 190px;
    }

    .trust-project-cta {
        grid-template-columns:
            minmax(0, 1fr)
            auto;
    }

    .trust-project-cta__contact {
        grid-column: 1 / -1;
        grid-row: 2;
    }
}


/* =========================================================
   TRUST ? 900
   ========================================================= */

@media (max-width: 900px) {
    .trust-section__inner {
        padding:
            74px
            24px
            55px;
    }

    .trust-section__visual {
        height: clamp(430px, 61vw, 540px);
    }

    .trust-feature-card {
        min-height: 205px;

        grid-template-columns:
            58px
            minmax(0, 1fr);
    }

    .trust-feature-card--wide {
        min-height: 160px;
    }

    .trust-project-cta {
        grid-template-columns: 1fr;
    }

    .trust-project-cta__button {
        width: 100%;
    }

    .trust-project-cta__contact {
        grid-column: auto;
        grid-row: auto;
    }
}


/* =========================================================
   TRUST ? 620
   ========================================================= */

@media (max-width: 620px) {
    .trust-section__dots {
        display: none;
    }

    .trust-section__inner {
        padding:
            62px
            18px
            48px;
    }

    .trust-section__kicker {
        margin-bottom: 21px;

        font-size: 10px;
        letter-spacing: 0.18em;
    }

    .trust-section__story h2 {
        font-size: clamp(41px, 11vw, 49px);
        line-height: 1.04;
    }

    .trust-section__lead {
        margin-top: 23px;

        font-size: 16.5px;
        line-height: 1.52;
    }

    .trust-section__actions {
        margin-top: 27px;

        flex-direction: column;
        align-items: stretch;

        gap: 16px;
    }

    .trust-section__button {
        width: 100%;
        min-width: 0;
        min-height: 59px;
    }

    .trust-section__proof {
        padding-left: 3px;
    }

    .trust-section__proof strong {
        font-size: 13px;
    }

    .trust-section__proof span {
        font-size: 11px;
    }

    .trust-section__visual {
        height: clamp(300px, 80vw, 360px);
        min-height: 0;
        max-height: none;
        margin-top: 22px;
    }

    .trust-section__main-image {
        right: 0;
        bottom: 0;
        left: 0;

        width: 100%;
        height: 100%;

        object-fit: contain;
        object-position: center bottom;
    }

    .trust-section__features-shell {
        width: calc(100% + 18px);
    }

    .trust-section__features {
        width: 100%;
        padding:
            4px
            54px
            25px
            0;

        display: flex;

        gap: 14px;

        overflow-x: auto;
        overflow-y: visible;

        scroll-snap-type: x mandatory;
        overscroll-behavior-inline: contain;

        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .trust-section__features::-webkit-scrollbar {
        display: none;
    }

    .trust-feature-card,
    .trust-feature-card--wide {
        width: calc(100vw - 70px);
        min-height: 225px;
        padding: 22px 20px;

        flex: 0 0 calc(100vw - 70px);

        grid-template-columns:
            54px
            minmax(0, 1fr);

        border-radius: 19px;

        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .trust-feature-card:hover {
        transform: none;
    }

    .trust-feature-card__icon {
        width: 54px;
    }

    .trust-feature-card__number {
        font-size: 15px;
    }

    .trust-feature-card h3 {
        font-size: 18px;
    }

    .trust-feature-card p {
        font-size: 13.5px;
        line-height: 1.52;
    }

    .trust-section__slider-tools {
        padding-right: 54px;

        display: flex;
        align-items: center;
        justify-content: space-between;

        gap: 14px;
    }

    .trust-section__slider-tools > span {
        display: flex;
        align-items: center;

        gap: 8px;

        color: #696969;

        font-size: 12px;
        line-height: 1;
        font-weight: 600;
    }

    .trust-section__slider-tools b {
        color: #e7a500;

        font-size: 21px;
        line-height: 1;

        animation:
            trust-swipe-arrow
            1.35s
            ease-in-out
            infinite;
    }

    .trust-section__slider-dots {
        display: flex;
        align-items: center;

        gap: 5px;
    }

    .trust-section__slider-dots button {
        width: 7px;
        height: 7px;
        padding: 0;

        border: 0;
        border-radius: 50%;

        background: #ded8ca;

        cursor: pointer;

        transition:
            width 0.25s ease,
            border-radius 0.25s ease,
            background 0.25s ease;
    }

    .trust-section__slider-dots button.is-active {
        width: 20px;

        border-radius: 999px;
        background: #f0ad00;
    }

    .trust-project-cta {
        margin-top: 37px;
        padding: 22px 19px;

        gap: 22px;

        border-radius: 19px;
    }

    .trust-project-cta__intro {
        align-items: flex-start;
    }

    .trust-project-cta__icon {
        width: 58px;
    }

    .trust-project-cta__intro strong {
        font-size: 21px;
    }

    .trust-project-cta__intro span {
        font-size: 13px;
    }

    .trust-project-cta__button {
        min-width: 0;
        min-height: 59px;

        font-size: 13px;
    }

    .trust-project-cta__contact {
        align-items: center;
    }

    .trust-project-cta__avatars img {
        width: 46px;
        height: 46px;
    }

    .trust-project-cta__contact strong {
        font-size: 13px;
    }

    .trust-project-cta__contact span {
        font-size: 11px;
    }

    @keyframes trust-swipe-arrow {
        0%,
        100% {
            transform: translateX(0);
        }

        50% {
            transform: translateX(6px);
        }
    }
}


/* =========================================================
   TRUST ? 390
   ========================================================= */

@media (max-width: 390px) {
    .trust-section__inner {
        padding-right: 16px;
        padding-left: 16px;
    }

    .trust-section__features-shell {
        width: calc(100% + 16px);
    }

    .trust-section__features {
        padding-right: 48px;
    }

    .trust-feature-card,
    .trust-feature-card--wide {
        width: calc(100vw - 64px);
        flex-basis: calc(100vw - 64px);
    }

    .trust-section__slider-tools {
        padding-right: 48px;
    }

    .trust-section__visual {
        height: 300px;
        min-height: 0;
    }

    .trust-section__main-image {
        right: 0;
        left: 0;

        width: 100%;
        height: 100%;
    }
}


/* =========================================================
   TRUST ? REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .trust-section.trust-section--js
    [data-trust-reveal],
    .trust-section__main-image,
    .trust-feature-card,
    .trust-section__slider-tools b {
        animation: none !important;
        transition: none !important;
    }

    .trust-section.trust-section--js
    [data-trust-reveal] {
        opacity: 1;
        transform: none;
    }
}

/* =========================================================
   PRICE CALCULATOR
   ========================================================= */

.price-calculator {
    position: relative;
    isolation: isolate;

    width: 100%;
    min-height: 100svh;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #f7f5ef 0%,
            #fffefa 10%,
            #ffffff 90%,
            #f7f5ef 100%
        );
}

.price-calculator__background {
    position: absolute;
    inset: 0;
    z-index: -2;

    overflow: hidden;
    pointer-events: none;
}

.price-calculator__glow {
    position: absolute;

    border-radius: 50%;
}

.price-calculator__glow--left {
    top: 18%;
    left: -18%;

    width: clamp(520px, 42vw, 980px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 204, 75, 0.11),
            transparent 69%
        );
}

.price-calculator__glow--right {
    top: -12%;
    right: -12%;

    width: clamp(650px, 52vw, 1200px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 215, 111, 0.12),
            transparent 69%
        );
}

.price-calculator__dots {
    position: absolute;
    right: 2%;
    bottom: 7%;

    width: clamp(140px, 11vw, 260px);
    height: clamp(100px, 8vw, 190px);

    opacity: 0.27;

    background-image:
        radial-gradient(
            circle,
            rgba(237, 171, 0, 0.27) 1.2px,
            transparent 1.45px
        );

    background-size: 13px 13px;
}

.price-calculator__inner {
    position: relative;
    z-index: 2;

    width: 100%;
    min-height: 100svh;

    padding:
        clamp(100px, 6vw, 150px)
        clamp(30px, 3.8vw, 96px)
        clamp(55px, 3.7vw, 90px);
}

.price-calculator__layout {
    width: 100%;

    display: grid;
    grid-template-columns:
        minmax(390px, 36%)
        minmax(0, 64%);

    align-items: center;

    gap: clamp(38px, 3.2vw, 76px);
}


/* =========================================================
   CALCULATOR INTRO
   ========================================================= */

.price-calculator__intro {
    min-width: 0;
}

.price-calculator__badge {
    width: fit-content;
    min-height: clamp(39px, 2.5vw, 54px);
    padding:
        7px
        clamp(14px, 1vw, 23px);

    display: inline-flex;
    align-items: center;

    gap: 10px;

    border: 1px solid rgba(238, 171, 0, 0.11);
    border-radius: 999px;

    background: #fff8e6;

    color: #d99500;

    font-size: clamp(10px, 0.68vw, 15px);
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.price-calculator__badge img {
    width: clamp(21px, 1.4vw, 29px);
    height: clamp(21px, 1.4vw, 29px);

    object-fit: contain;
}

.price-calculator__intro h2 {
    margin:
        clamp(29px, 2vw, 46px)
        0
        0;

    color: #111214;

    font-size: clamp(55px, 4.3vw, 96px);
    line-height: 1;
    font-weight: 650;
    letter-spacing: -0.055em;
}

.price-calculator__accent {
    margin:
        clamp(22px, 1.6vw, 36px)
        0
        0;

    color: #efa900;

    font-size: clamp(24px, 1.75vw, 39px);
    line-height: 1.18;
    font-weight: 650;
    letter-spacing: -0.035em;
}

.price-calculator__lead {
    width: min(100%, 660px);
    margin:
        clamp(27px, 1.9vw, 42px)
        0
        0;

    color: #626262;

    font-size: clamp(15px, 1vw, 22px);
    line-height: 1.58;
}

.price-calculator__advantages {
    margin-top: clamp(40px, 3vw, 66px);

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap:
        clamp(28px, 2vw, 45px)
        clamp(20px, 1.6vw, 36px);
}

.calculator-advantage {
    min-width: 0;

    display: grid;
    grid-template-columns:
        clamp(50px, 3.3vw, 72px)
        minmax(0, 1fr);

    align-items: center;

    gap: clamp(13px, 0.9vw, 19px);
}

.calculator-advantage__icon {
    width: clamp(50px, 3.3vw, 72px);
    aspect-ratio: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(238, 171, 0, 0.11);
    border-radius: 50%;

    background: #fff8e5;
}

.calculator-advantage__icon img {
    width: 62%;
    height: 62%;

    object-fit: contain;
}

.calculator-advantage strong,
.calculator-advantage span {
    display: block;
}

.calculator-advantage strong {
    color: #292929;

    font-size: clamp(11px, 0.73vw, 16px);
    line-height: 1.3;
    font-weight: 690;
}

.calculator-advantage span {
    margin-top: 5px;

    color: #707070;

    font-size: clamp(9px, 0.62vw, 13px);
    line-height: 1.42;
}


/* =========================================================
   CALCULATOR PANEL
   ========================================================= */

.calculator-panel {
    min-width: 0;
    margin: 0;

    overflow: hidden;

    border: 1px solid rgba(20, 20, 20, 0.055);
    border-radius: clamp(20px, 1.45vw, 34px);

    background: rgba(255, 255, 255, 0.985);

    box-shadow:
        0 26px 68px rgba(37, 32, 22, 0.1);
}

.calculator-panel__header {
    min-height: clamp(92px, 6.8vw, 140px);
    padding:
        clamp(21px, 1.6vw, 35px)
        clamp(24px, 1.8vw, 42px);

    display: flex;
    align-items: center;

    gap: clamp(16px, 1.1vw, 24px);

    border-bottom: 1px solid rgba(20, 20, 20, 0.075);
}

.calculator-panel__header-icon {
    width: clamp(55px, 3.8vw, 82px);
    aspect-ratio: 1;

    flex: 0 0 auto;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(238, 171, 0, 0.12);
    border-radius: 50%;

    background: #fff8e5;
}

.calculator-panel__header-icon img {
    width: 58%;
    height: 58%;

    object-fit: contain;
}

.calculator-panel__header strong,
.calculator-panel__header span {
    display: block;
}

.calculator-panel__header strong {
    color: #202020;

    font-size: clamp(17px, 1.15vw, 26px);
    line-height: 1.25;
    font-weight: 690;
}

.calculator-panel__header span {
    margin-top: 6px;

    color: #707070;

    font-size: clamp(11px, 0.73vw, 16px);
    line-height: 1.4;
}

.calculator-panel__content {
    padding:
        clamp(23px, 1.7vw, 38px)
        clamp(24px, 1.8vw, 42px)
        clamp(24px, 1.8vw, 42px);
}

.calculator-fieldset {
    min-width: 0;
    margin: 0;
    padding: 0;

    border: 0;
}

.calculator-panel__content > .calculator-fieldset + .calculator-fieldset,
.calculator-panel__content > .calculator-panel__row + .calculator-fieldset,
.calculator-panel__content > .calculator-fieldset + .calculator-panel__row {
    margin-top: clamp(23px, 1.6vw, 35px);
}

.calculator-fieldset legend {
    width: 100%;
    margin-bottom: clamp(12px, 0.85vw, 18px);
    padding: 0;

    color: #242424;

    font-size: clamp(13px, 0.86vw, 19px);
    line-height: 1.2;
    font-weight: 700;
}

.calculator-fieldset legend span {
    color: #e5a300;
}

.calculator-fieldset__link {
    display: inline-flex;
    align-items: center;

    margin-bottom: clamp(12px, 0.85vw, 18px);

    color: #7a4a00;

    font-size: clamp(11px, 0.72vw, 14px);
    line-height: 1.35;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.calculator-fieldset__link:hover,
.calculator-fieldset__link:focus-visible {
    color: #ff9a00;
    outline: none;
}

.calculator-options {
    display: grid;

    gap: clamp(10px, 0.72vw, 16px);
}

.price-calculator__mobile-proof,
.calculator-mobile-select__trigger,
.calculator-modeling-tools,
.calculator-result__toggle {
    display: none;
}

.calculator-options--materials {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

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

.calculator-options--urgency,
.calculator-options--shipping {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.calculator-option {
    position: relative;

    min-width: 0;
    min-height: clamp(72px, 5vw, 105px);
    padding:
        clamp(14px, 1vw, 22px)
        clamp(12px, 0.9vw, 19px);

    display: flex;
    align-items: center;

    gap: clamp(10px, 0.7vw, 15px);

    overflow: hidden;

    border: 1px solid rgba(20, 20, 20, 0.085);
    border-radius: clamp(11px, 0.75vw, 17px);

    background: #ffffff;

    cursor: pointer;

    transition:
        border-color 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease;
}

.calculator-option:hover {
    transform: translateY(-2px);

    border-color: rgba(238, 171, 0, 0.34);
}

.calculator-option.is-selected {
    border-color: #efad00;

    background:
        linear-gradient(
            135deg,
            #fffdf6,
            #fff7e2
        );

    box-shadow:
        inset 0 0 0 1px rgba(239, 173, 0, 0.16),
        0 9px 22px rgba(239, 173, 0, 0.08);
}

.calculator-option.is-disabled {
    opacity: 0.48;
    cursor: not-allowed;
}

.calculator-option.is-disabled:hover {
    transform: none;
}

.calculator-option input {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;
    pointer-events: none;
}

.calculator-option > img {
    width: clamp(29px, 1.9vw, 42px);
    height: clamp(29px, 1.9vw, 42px);

    flex: 0 0 auto;

    object-fit: contain;
}

.calculator-option__check {
    position: absolute;
    top: 8px;
    right: 8px;

    width: 20px;
    height: 20px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #f3b000;
    color: #ffffff;

    font-size: 11px;
    font-weight: 800;

    opacity: 0;
    transform: scale(0.7);

    transition:
        opacity 0.22s ease,
        transform 0.22s ease;
}

.calculator-option.is-selected
.calculator-option__check {
    opacity: 1;
    transform: scale(1);
}

.calculator-option__copy {
    min-width: 0;
}

.calculator-option__copy strong,
.calculator-option__copy small,
.calculator-option__copy em {
    display: block;
}

.calculator-option__copy strong {
    color: #242424;

    font-size: clamp(12px, 0.78vw, 17px);
    line-height: 1.25;
    font-weight: 680;
}

.calculator-option__copy small {
    margin-top: 4px;

    color: #717171;

    font-size: clamp(10px, 0.63vw, 14px);
    line-height: 1.35;
}

.calculator-option__copy em {
    margin-top: 5px;

    color: #d99500;

    font-size: clamp(9px, 0.6vw, 13px);
    line-height: 1.25;
    font-style: normal;
    font-weight: 680;
}

.calculator-option--large {
    min-height: clamp(85px, 6vw, 125px);
}

.calculator-option--vertical {
    min-height: clamp(96px, 6.7vw, 140px);

    flex-direction: column;
    justify-content: center;

    text-align: center;
}

.calculator-option__placeholder {
    width: clamp(37px, 2.5vw, 52px);
    aspect-ratio: 1;

    flex: 0 0 auto;

    border: 2px dashed rgba(35, 35, 35, 0.38);
    border-radius: 50%;
}

.calculator-panel__row {
    display: grid;
    align-items: start;

    gap: clamp(15px, 1.1vw, 24px);
}

.calculator-panel__row--weight {
    margin-top: clamp(23px, 1.6vw, 35px);

    grid-template-columns:
        minmax(0, 1.05fr)
        minmax(240px, 0.95fr);
}

.calculator-panel__row--delivery {
    margin-top: clamp(23px, 1.6vw, 35px);

    grid-template-columns:
        minmax(0, 0.9fr)
        minmax(0, 1.1fr);
}

.calculator-number-field,
.calculator-quantity {
    min-height: clamp(58px, 4vw, 82px);

    display: flex;
    align-items: center;

    border: 1px solid rgba(20, 20, 20, 0.085);
    border-radius: clamp(11px, 0.75vw, 17px);

    background: #ffffff;
}

.calculator-number-field {
    padding:
        0
        clamp(16px, 1.1vw, 24px);

    gap: 14px;
}

.calculator-number-field__icon {
    width: 32px;
    height: 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(20, 20, 20, 0.12);
    border-radius: 9px;

    color: #6d6d6d;

    font-size: 13px;
    font-weight: 700;
}

.calculator-number-field input,
.calculator-quantity input {
    min-width: 0;

    border: 0;
    outline: 0;

    background: transparent;
    color: #252525;

    font: inherit;
    font-size: clamp(15px, 1vw, 22px);
    font-weight: 680;
    text-align: center;

    appearance: textfield;
}

.calculator-number-field input {
    flex: 1;

    text-align: left;
}

.calculator-number-field input::-webkit-inner-spin-button,
.calculator-number-field input::-webkit-outer-spin-button,
.calculator-quantity input::-webkit-inner-spin-button,
.calculator-quantity input::-webkit-outer-spin-button {
    appearance: none;
    margin: 0;
}

.calculator-number-field__unit,
.calculator-quantity > span {
    color: #6f6f6f;

    font-size: clamp(11px, 0.73vw, 16px);
    font-weight: 650;
}

.calculator-quantity {
    overflow: hidden;
}

.calculator-quantity button {
    width: clamp(52px, 3.6vw, 76px);
    height: 100%;
    align-self: stretch;

    border: 0;
    background: #fafafa;
    color: #363636;

    cursor: pointer;

    font-size: clamp(20px, 1.4vw, 30px);

    transition:
        background 0.23s ease,
        color 0.23s ease;
}

.calculator-quantity button:hover,
.calculator-quantity button:focus-visible {
    background: #fff3cf;
    color: #c98e00;

    outline: none;
}

.calculator-quantity input {
    width: 72px;
    flex: 1;
}

.calculator-quantity > span {
    padding-right: clamp(14px, 1vw, 22px);
}


/* =========================================================
   CALCULATOR RESULT
   ========================================================= */

.calculator-result {
    margin-top: clamp(24px, 1.7vw, 38px);
    padding:
        clamp(18px, 1.35vw, 29px)
        clamp(18px, 1.4vw, 31px);

    display: grid;
    grid-template-columns:
        minmax(100px, 1fr)
        auto
        minmax(100px, 1fr)
        auto
        minmax(100px, 1fr)
        auto
        minmax(90px, 0.8fr)
        auto
        minmax(155px, 1.25fr);

    align-items: center;

    gap: clamp(8px, 0.7vw, 15px);

    border: 1px solid rgba(238, 171, 0, 0.08);
    border-radius: clamp(13px, 0.9vw, 20px);

    background:
        linear-gradient(
            110deg,
            #fff9e9,
            #fffdf8
        );
}

.calculator-result__item {
    text-align: center;
}

.calculator-result__item span,
.calculator-result__item strong,
.calculator-result__total span,
.calculator-result__total strong,
.calculator-result__total small {
    display: block;
}

.calculator-result__item span,
.calculator-result__total span {
    color: #555555;

    font-size: clamp(9px, 0.6vw, 13px);
    line-height: 1.25;
    font-weight: 620;
}

.calculator-result__item strong {
    margin-top: 8px;

    color: #282828;

    font-size: clamp(13px, 0.87vw, 19px);
    line-height: 1;
    font-weight: 700;
}

.calculator-result__operator {
    color: #8b8b8b;

    font-size: clamp(13px, 0.9vw, 19px);
    font-weight: 700;
}

.calculator-result__total {
    text-align: right;
}

.calculator-result__total strong {
    margin-top: 6px;

    color: #efa900;

    font-size: clamp(25px, 1.75vw, 39px);
    line-height: 1;
    font-weight: 720;
    letter-spacing: -0.035em;

    transition:
        transform 0.24s ease,
        color 0.24s ease;
}

.calculator-result__total strong.is-updated {
    color: #d89400;

    transform: scale(1.05);
}

.calculator-result__total small {
    margin-top: 7px;

    color: #717171;

    font-size: clamp(8px, 0.53vw, 12px);
    line-height: 1.25;
}

.calculator-result__total small b {
    color: #555555;
}

.calculator-panel__footer {
    margin-top: clamp(18px, 1.3vw, 29px);

    display: grid;
    grid-template-columns:
        minmax(240px, 0.9fr)
        minmax(260px, 1.1fr);

    align-items: center;

    gap: clamp(17px, 1.2vw, 26px);
}

.calculator-panel__submit {
    min-height: clamp(58px, 4vw, 86px);
    padding:
        0
        clamp(22px, 1.6vw, 38px);

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-radius: clamp(12px, 0.8vw, 18px);

    background:
        linear-gradient(
            135deg,
            #ffd15a,
            #ffb400
        );

    color: #171717;

    font-size: clamp(13px, 0.88vw, 20px);
    line-height: 1;
    font-weight: 690;

    box-shadow:
        0 15px 34px rgba(238, 171, 0, 0.22);

    transition:
        transform 0.27s ease,
        box-shadow 0.27s ease;
}

.calculator-panel__submit span:last-child {
    font-size: 1.7em;
}

.calculator-panel__submit:hover,
.calculator-panel__submit:focus-visible {
    transform: translateY(-3px);

    box-shadow:
        0 21px 42px rgba(238, 171, 0, 0.31);

    outline: none;
}

.calculator-panel__footer p {
    margin: 0;

    color: #777777;

    font-size: clamp(9px, 0.62vw, 14px);
    line-height: 1.45;
}


/* =========================================================
   CALCULATOR TRUST STRIP
   ========================================================= */

.price-calculator__trust {
    width: 100%;
    min-height: clamp(105px, 7.7vw, 165px);
    margin-top: clamp(31px, 2.3vw, 52px);
    padding:
        clamp(19px, 1.4vw, 31px)
        clamp(22px, 1.8vw, 43px);

    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    border: 1px solid rgba(20, 20, 20, 0.055);
    border-radius: clamp(18px, 1.25vw, 30px);

    background: rgba(255, 255, 255, 0.98);

    box-shadow:
        0 18px 46px rgba(35, 31, 23, 0.065);
}

.price-calculator__trust article {
    position: relative;

    min-width: 0;
    padding-inline: clamp(14px, 1.15vw, 27px);

    display: flex;
    align-items: center;

    gap: clamp(12px, 0.95vw, 20px);
}

.price-calculator__trust article:first-child {
    padding-left: 0;
}

.price-calculator__trust article:last-child {
    padding-right: 0;
}

.price-calculator__trust article:not(:last-child)::after {
    content: "";

    position: absolute;
    top: 12%;
    right: 0;

    width: 1px;
    height: 76%;

    background: rgba(20, 20, 20, 0.08);
}

.price-calculator__trust img {
    width: clamp(40px, 2.8vw, 60px);
    height: clamp(40px, 2.8vw, 60px);

    flex: 0 0 auto;

    object-fit: contain;
}

.price-calculator__trust strong,
.price-calculator__trust span {
    display: block;
}

.price-calculator__trust strong {
    color: #292929;

    font-size: clamp(11px, 0.75vw, 17px);
    line-height: 1.3;
    font-weight: 680;
}

.price-calculator__trust span {
    margin-top: 5px;

    color: #747474;

    font-size: clamp(9px, 0.61vw, 14px);
    line-height: 1.4;
}


/* =========================================================
   MODELING MODAL
   ========================================================= */

.calculator-modal-open {
    overflow: hidden;
}

.modeling-modal {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 20px;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition:
        opacity 0.3s ease,
        visibility 0.3s ease;
}

.modeling-modal[aria-hidden="false"] {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.modeling-modal__backdrop {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    padding: 0;

    border: 0;

    background: rgba(18, 18, 18, 0.55);

    cursor: pointer;
}

.modeling-modal__dialog {
    position: relative;
    z-index: 2;

    width: min(100%, 560px);
    padding:
        clamp(27px, 2vw, 42px);

    border: 1px solid rgba(20, 20, 20, 0.07);
    border-radius: 24px;

    background: #ffffff;

    box-shadow:
        0 35px 90px rgba(0, 0, 0, 0.22);

    transform: translateY(24px) scale(0.97);

    transition: transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
}

.modeling-modal[aria-hidden="false"]
.modeling-modal__dialog {
    transform: translateY(0) scale(1);
}

.modeling-modal__close {
    position: absolute;
    top: 15px;
    right: 15px;

    width: 40px;
    height: 40px;
    padding: 0;

    border: 1px solid rgba(20, 20, 20, 0.09);
    border-radius: 12px;

    background: #ffffff;
    color: #333333;

    cursor: pointer;

    font-size: 25px;
    line-height: 1;
}

.modeling-modal__icon {
    width: 68px;
    aspect-ratio: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(238, 171, 0, 0.12);
    border-radius: 50%;

    background: #fff8e5;
}

.modeling-modal__icon img {
    width: 58%;
    height: 58%;

    object-fit: contain;
}

.modeling-modal h3 {
    margin: 22px 0 0;

    color: #202020;

    font-size: clamp(25px, 1.8vw, 34px);
    line-height: 1.15;
    font-weight: 680;
    letter-spacing: -0.035em;
}

.modeling-modal p {
    margin: 16px 0 0;

    color: #686868;

    font-size: 15px;
    line-height: 1.58;
}

.modeling-modal__field {
    margin-top: 24px;

    display: block;
}

.modeling-modal__field > span {
    display: block;

    margin-bottom: 9px;

    color: #2c2c2c;

    font-size: 14px;
    font-weight: 680;
}

.modeling-modal__field > div {
    min-height: 60px;
    padding:
        0
        18px;

    display: flex;
    align-items: center;

    border: 1px solid rgba(20, 20, 20, 0.11);
    border-radius: 14px;

    background: #ffffff;
}

.modeling-modal__field input {
    min-width: 0;
    flex: 1;

    border: 0;
    outline: 0;

    color: #222222;

    font: inherit;
    font-size: 20px;
    font-weight: 680;
}

.modeling-modal__field > div > span {
    color: #6d6d6d;

    font-size: 14px;
    font-weight: 650;
}

.modeling-modal__preview {
    margin-top: 17px;
    padding:
        15px
        17px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    border-radius: 13px;

    background: #fff8e5;
}

.modeling-modal__preview span {
    color: #555555;

    font-size: 13px;
}

.modeling-modal__preview strong {
    color: #dd9c00;

    font-size: 20px;
}

.modeling-modal__actions {
    margin-top: 24px;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 12px;
}

.modeling-modal__actions button {
    min-height: 54px;

    border-radius: 13px;

    cursor: pointer;

    font-weight: 680;
}

.modeling-modal__cancel {
    border: 1px solid rgba(20, 20, 20, 0.11);

    background: #ffffff;
    color: #333333;
}

.modeling-modal__confirm {
    border: 0;

    background:
        linear-gradient(
            135deg,
            #ffd15a,
            #ffb400
        );

    color: #171717;
}


/* =========================================================
   CALCULATOR ANIMATIONS
   ========================================================= */

.price-calculator.price-calculator--js
[data-calculator-reveal] {
    opacity: 0;

    transform: translateY(34px);

    transition:
        opacity 0.78s ease,
        transform 0.78s cubic-bezier(0.22, 1, 0.36, 1);
}

.price-calculator.price-calculator--js
[data-calculator-reveal="intro"] {
    transform: translateX(-38px);
}

.price-calculator.price-calculator--js
[data-calculator-reveal="panel"] {
    transform: translateX(42px);
}

.price-calculator.price-calculator--js.is-visible
[data-calculator-reveal] {
    opacity: 1;
    transform: translate(0, 0);
}

.price-calculator.is-visible
[data-calculator-reveal="panel"] {
    transition-delay: 0.12s;
}

.price-calculator.is-visible
[data-calculator-reveal="trust"] {
    transition-delay: 0.24s;
}


/* =========================================================
   CALCULATOR ? 1500
   ========================================================= */

@media (max-width: 1500px) and (min-width: 1181px) {
    .price-calculator__inner {
        padding:
            90px
            42px
            64px;
    }

    .price-calculator__layout {
        grid-template-columns:
            minmax(360px, 35%)
            minmax(0, 65%);

        gap: 36px;
    }

    .price-calculator__intro h2 {
        font-size: 62px;
    }

    .price-calculator__accent {
        font-size: 27px;
    }

    .price-calculator__lead {
        font-size: 16px;
    }

    .calculator-panel__content {
        padding: 25px;
    }

    .calculator-option__copy strong {
        font-size: 12px;
    }

    .calculator-option__copy small {
        font-size: 10px;
    }

    .calculator-result {
        padding: 18px;
    }
}


/* =========================================================
   CALCULATOR ? 1180
   ========================================================= */

@media (max-width: 1180px) {
    .price-calculator {
        min-height: 0;
    }

    .price-calculator__inner {
        min-height: 0;

        padding:
            82px
            30px
            60px;
    }

    .price-calculator__layout {
        grid-template-columns: 1fr;

        gap: 48px;
    }

    .price-calculator__intro {
        max-width: 900px;
    }

    .price-calculator__intro h2 {
        font-size: clamp(56px, 6vw, 74px);
    }

    .price-calculator__lead {
        max-width: 760px;

        font-size: 18px;
    }

    .price-calculator__advantages {
        max-width: 850px;
    }

    .calculator-panel {
        width: 100%;
    }

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

        gap: 20px 0;
    }

    .price-calculator__trust article:nth-child(2)::after {
        display: none;
    }

    .price-calculator__trust article:nth-child(3) {
        padding-left: 0;
    }
}


/* =========================================================
   CALCULATOR ? 900
   ========================================================= */

@media (max-width: 900px) {
    .price-calculator__inner {
        padding:
            74px
            24px
            55px;
    }

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

    .calculator-options--modeling {
        grid-template-columns: 1fr;
    }

    .calculator-panel__row--delivery {
        grid-template-columns: 1fr;
    }

    .calculator-result {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));

        gap: 18px;
    }

    .calculator-result__operator {
        display: none;
    }

    .calculator-result__total {
        grid-column: 1 / -1;

        padding-top: 18px;

        border-top: 1px solid rgba(20, 20, 20, 0.08);

        text-align: center;
    }

    .calculator-panel__footer {
        grid-template-columns: 1fr;
    }

    .calculator-panel__footer p {
        text-align: center;
    }
}


/* =========================================================
   CALCULATOR ? 620
   ========================================================= */

@media (max-width: 620px) {
    .price-calculator__dots {
        display: none;
    }

    .price-calculator__inner {
        padding:
            58px
            18px
            46px;
    }

    .price-calculator__layout {
        gap: 32px;
    }

    .price-calculator__badge {
        min-height: 37px;

        font-size: 9.5px;
    }

    .price-calculator__intro h2 {
        margin-top: 24px;

        font-size: clamp(43px, 12vw, 52px);
    }

    .price-calculator__accent {
        margin-top: 17px;

        font-size: 24px;
        line-height: 1.18;
    }

    .price-calculator__lead {
        margin-top: 19px;

        font-size: 16px;
        line-height: 1.5;
    }

    /*
     * На мобильном убираем две повторяющиеся
     * группы преимуществ.
     */

    .price-calculator__advantages,
    .price-calculator__trust {
        display: none;
    }

    .price-calculator__mobile-proof {
        margin-top: 25px;
        padding: 12px 7px;

        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));

        border: 1px solid rgba(20, 20, 20, 0.06);
        border-radius: 16px;

        background: rgba(255, 255, 255, 0.97);

        box-shadow:
            0 11px 28px rgba(35, 31, 23, 0.055);
    }

    .price-calculator__mobile-proof > div {
        position: relative;

        min-width: 0;
        padding: 2px 7px;

        display: flex;
        flex-direction: column;
        align-items: center;

        gap: 7px;

        text-align: center;
    }

    .price-calculator__mobile-proof > div:not(:last-child)::after {
        content: "";

        position: absolute;
        top: 8%;
        right: 0;

        width: 1px;
        height: 84%;

        background: rgba(20, 20, 20, 0.075);
    }

    .price-calculator__mobile-proof img {
        width: 31px;
        height: 31px;

        object-fit: contain;
    }

    .price-calculator__mobile-proof span {
        color: #4d4d4d;

        font-size: 10.5px;
        line-height: 1.25;
        font-weight: 650;
    }

    /*
     * Основная панель.
     */

    .calculator-panel {
        border-radius: 21px;

        box-shadow:
            0 20px 52px rgba(37, 32, 22, 0.095);
    }

    .calculator-panel__header {
        min-height: 0;
        padding: 18px 16px;

        gap: 13px;
    }

    .calculator-panel__header-icon {
        width: 50px;
    }

    .calculator-panel__header strong {
        font-size: 17px;
    }

    .calculator-panel__header span {
        margin-top: 4px;

        font-size: 11.5px;
        line-height: 1.35;
    }

    .calculator-panel__content {
        padding:
            20px
            14px
            18px;
    }

    .calculator-panel__content > .calculator-fieldset + .calculator-fieldset,
    .calculator-panel__row + .calculator-fieldset,
    .calculator-fieldset + .calculator-panel__row {
        margin-top: 22px;
    }

    .calculator-fieldset legend {
        margin-bottom: 10px;

        font-size: 14px;
    }

    /*
     * Gewicht und Menge bleiben компактными
     * в одной строке.
     */

    .calculator-panel__row--weight {
        margin-top: 22px;

        grid-template-columns:
            minmax(0, 0.9fr)
            minmax(0, 1.1fr);

        gap: 10px;
    }

    .calculator-panel__row--delivery {
        margin-top: 22px;

        grid-template-columns: 1fr;

        gap: 22px;
    }

    .calculator-number-field,
    .calculator-quantity {
        min-height: 57px;

        border-radius: 13px;
    }

    .calculator-number-field {
        padding: 0 11px;

        gap: 8px;
    }

    .calculator-number-field__icon {
        width: 28px;
        height: 28px;

        border-radius: 8px;

        font-size: 11px;
    }

    .calculator-number-field input,
    .calculator-quantity input {
        font-size: 16px;
    }

    .calculator-number-field__unit,
    .calculator-quantity > span {
        font-size: 11px;
    }

    .calculator-quantity button {
        width: 42px;

        font-size: 22px;
    }

    .calculator-quantity > span {
        padding-right: 9px;
    }

    /*
     * Мобильные выпадающие списки.
     * Активируются следующим обновлением calculator.js.
     */

    .price-calculator.is-mobile-enhanced
    .calculator-mobile-select__trigger {
        width: 100%;
        min-height: 68px;
        padding:
            10px
            12px;

        display: grid;
        grid-template-columns:
            44px
            minmax(0, 1fr)
            28px;

        align-items: center;

        gap: 11px;

        border: 1px solid rgba(20, 20, 20, 0.095);
        border-radius: 14px;

        background:
            linear-gradient(
                135deg,
                #ffffff,
                #fffdf8
            );

        color: #222222;

        cursor: pointer;
        text-align: left;

        box-shadow:
            0 8px 20px rgba(35, 31, 23, 0.035);
    }

    .calculator-mobile-select__trigger.is-open {
        border-color: #efad00;

        background: #fffaf0;

        box-shadow:
            0 10px 24px rgba(239, 173, 0, 0.11);
    }

    .calculator-mobile-select__icon {
        width: 44px;
        height: 44px;

        display: flex;
        align-items: center;
        justify-content: center;

        border-radius: 12px;

        background: #fff7df;
    }

    .calculator-mobile-select__icon img {
        width: 29px;
        height: 29px;

        object-fit: contain;
    }

    .calculator-mobile-select__copy {
        min-width: 0;
    }

    .calculator-mobile-select__copy small,
    .calculator-mobile-select__copy strong,
    .calculator-mobile-select__copy em {
        display: block;
    }

    .calculator-mobile-select__copy small {
        color: #8b8b8b;

        font-size: 9px;
        line-height: 1.2;
        font-weight: 650;
        letter-spacing: 0.07em;
        text-transform: uppercase;
    }

    .calculator-mobile-select__copy strong {
        margin-top: 4px;

        overflow: hidden;

        color: #242424;

        font-size: 15px;
        line-height: 1.2;
        font-weight: 700;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .calculator-mobile-select__copy em {
        margin-top: 3px;

        color: #737373;

        font-size: 11px;
        line-height: 1.2;
        font-style: normal;
    }

    .calculator-mobile-select__arrow {
        color: #d99a00;

        font-size: 23px;
        line-height: 1;
        text-align: center;

        transition: transform 0.25s ease;
    }

    .calculator-mobile-select__trigger.is-open
    .calculator-mobile-select__arrow {
        transform: rotate(180deg);
    }

    .price-calculator.is-mobile-enhanced
    .calculator-options--mobile-select {
        margin-top: 8px;
        padding: 7px;

        display: none;

        gap: 5px;

        border: 1px solid rgba(20, 20, 20, 0.07);
        border-radius: 15px;

        background: #ffffff;

        box-shadow:
            0 16px 34px rgba(30, 28, 22, 0.09);
    }

    .price-calculator.is-mobile-enhanced
    .calculator-options--mobile-select.is-open {
        display: grid;

        animation:
            calculator-mobile-options-in
            0.24s
            cubic-bezier(0.22, 1, 0.36, 1)
            both;
    }

    .calculator-options--mobile-select
    .calculator-option,
    .calculator-options--mobile-select
    .calculator-option--vertical {
        min-height: 59px;
        padding: 9px 11px;

        flex-direction: row;
        justify-content: flex-start;

        gap: 10px;

        border-color: transparent;
        border-radius: 11px;

        text-align: left;

        box-shadow: none;
    }

    .calculator-options--mobile-select
    .calculator-option:hover {
        transform: none;
    }

    .calculator-options--mobile-select
    .calculator-option.is-selected {
        border-color: rgba(239, 173, 0, 0.24);

        background: #fff8e5;
    }

    .calculator-options--mobile-select
    .calculator-option > img {
        width: 32px;
        height: 32px;
    }

    .calculator-options--mobile-select
    .calculator-option__copy {
        padding-right: 28px;
    }

    .calculator-options--mobile-select
    .calculator-option__copy strong {
        font-size: 14px;
    }

    .calculator-options--mobile-select
    .calculator-option__copy small {
        font-size: 11px;
    }

    .calculator-options--mobile-select
    .calculator-option__check {
        top: 50%;
        right: 10px;

        transform:
            translateY(-50%)
            scale(0.7);
    }

    .calculator-options--mobile-select
    .calculator-option.is-selected
    .calculator-option__check {
        transform:
            translateY(-50%)
            scale(1);
    }

    /*
     * Modellирование ? отдельная карусель.
     */

    .calculator-options--modeling {
        width: calc(100% + 14px);
        padding:
            2px
            48px
            16px
            0;

        display: flex;

        gap: 10px;

        overflow-x: auto;
        overflow-y: visible;

        scroll-snap-type: x mandatory;
        overscroll-behavior-inline: contain;

        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .calculator-options--modeling::-webkit-scrollbar {
        display: none;
    }

    .calculator-options--modeling
    .calculator-option--large {
        width: calc(100% - 42px);
        min-height: 116px;
        padding: 16px 15px;

        flex: 0 0 calc(100% - 42px);

        border-radius: 15px;

        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .calculator-options--modeling
    .calculator-option--large:hover {
        transform: none;
    }

    .calculator-options--modeling
    .calculator-option > img,
    .calculator-options--modeling
    .calculator-option__placeholder {
        width: 39px;
        height: 39px;
    }

    .calculator-options--modeling
    .calculator-option__copy strong {
        font-size: 15px;
    }

    .calculator-options--modeling
    .calculator-option__copy small {
        font-size: 11.5px;
    }

    .calculator-modeling-tools {
        padding-right: 48px;

        display: flex;
        align-items: center;
        justify-content: space-between;

        gap: 12px;
    }

    .calculator-modeling-tools > span {
        display: flex;
        align-items: center;

        gap: 7px;

        color: #707070;

        font-size: 11px;
        line-height: 1;
        font-weight: 600;
    }

    .calculator-modeling-tools b {
        color: #e5a300;

        font-size: 19px;
        line-height: 1;

        animation:
            calculator-modeling-arrow
            1.35s
            ease-in-out
            infinite;
    }

    .calculator-modeling-dots {
        display: flex;
        align-items: center;

        gap: 5px;
    }

    .calculator-modeling-dots button {
        width: 7px;
        height: 7px;
        padding: 0;

        border: 0;
        border-radius: 50%;

        background: #ded8ca;

        cursor: pointer;

        transition:
            width 0.23s ease,
            border-radius 0.23s ease,
            background 0.23s ease;
    }

    .calculator-modeling-dots button.is-active {
        width: 20px;

        border-radius: 999px;
        background: #f0ad00;
    }

    /*
     * Результат: сначала только итог,
     * детализация раскрывается кнопкой.
     */

    .calculator-result {
        margin-top: 23px;
        padding: 17px 16px;

        display: flex;
        flex-direction: column;
        align-items: stretch;

        gap: 0;

        border-radius: 16px;
    }

    .calculator-result__operator {
        display: none;
    }

    .calculator-result__total {
        order: -2;

        display: grid;
        grid-template-columns:
            minmax(0, 1fr)
            auto;

        align-items: end;

        gap: 6px 15px;

        padding: 0;
        border: 0;

        text-align: left;
    }

    .calculator-result__total span {
        align-self: center;

        font-size: 11px;
    }

    .calculator-result__total strong {
        grid-column: 2;
        grid-row: 1 / span 2;

        margin-top: 0;

        font-size: 31px;
        white-space: nowrap;
    }

    .calculator-result__total small {
        grid-column: 1;

        margin-top: 0;

        font-size: 9px;
    }

    .price-calculator.is-mobile-enhanced
    .calculator-result__toggle {
        order: -1;

        width: 100%;
        margin-top: 14px;
        padding: 12px 0 0;

        display: flex;
        align-items: center;
        justify-content: space-between;

        border: 0;
        border-top: 1px solid rgba(20, 20, 20, 0.08);

        background: transparent;
        color: #555555;

        cursor: pointer;

        font-size: 11.5px;
        font-weight: 680;
    }

    .calculator-result__toggle b {
        color: #d99a00;

        font-size: 20px;
        line-height: 1;

        transition: transform 0.23s ease;
    }

    .calculator-result.is-expanded
    .calculator-result__toggle b {
        transform: rotate(180deg);
    }

    .calculator-result__item {
        width: 100%;
        padding: 10px 0;

        display: grid;
        grid-template-columns:
            minmax(0, 1fr)
            auto;

        align-items: center;

        gap: 14px;

        border-bottom: 1px solid rgba(20, 20, 20, 0.065);

        text-align: left;
    }

    .calculator-result__item span {
        font-size: 11px;
    }

    .calculator-result__item strong {
        margin-top: 0;

        font-size: 13px;
    }

    .price-calculator.is-mobile-enhanced
    .calculator-result__item {
        display: none;
    }

    .price-calculator.is-mobile-enhanced
    .calculator-result.is-expanded
    .calculator-result__item {
        display: grid;

        animation:
            calculator-result-item-in
            0.25s
            ease
            both;
    }

    /*
     * Нижняя кнопка.
     */

    .calculator-panel__footer {
        margin-top: 16px;

        grid-template-columns: 1fr;

        gap: 13px;
    }

    .calculator-panel__submit {
        min-height: 58px;
        padding: 0 18px;

        border-radius: 14px;

        font-size: 13px;
    }

    .calculator-panel__footer p {
        padding: 0 4px;

        font-size: 10px;
        line-height: 1.4;
        text-align: left;
    }

    /*
     * Модальное окно моделирования.
     */

    .modeling-modal {
        align-items: flex-end;

        padding: 8px;
    }

    .modeling-modal__dialog {
        width: 100%;
        max-height: calc(100svh - 16px);
        padding:
            25px
            18px
            18px;

        overflow-y: auto;

        border-radius: 23px;
    }

    .modeling-modal__icon {
        width: 60px;
    }

    .modeling-modal h3 {
        margin-top: 18px;

        font-size: 25px;
    }

    .modeling-modal p {
        font-size: 13px;
    }

    .modeling-modal__actions {
        grid-template-columns: 1fr;
    }

    @keyframes calculator-mobile-options-in {
        from {
            opacity: 0;
            transform: translateY(-6px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    @keyframes calculator-modeling-arrow {
        0%,
        100% {
            transform: translateX(0);
        }

        50% {
            transform: translateX(5px);
        }
    }

    @keyframes calculator-result-item-in {
        from {
            opacity: 0;
            transform: translateY(-4px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
}


/* =========================================================
   CALCULATOR ? 390
   ========================================================= */

@media (max-width: 390px) {
    .price-calculator__inner {
        padding-right: 16px;
        padding-left: 16px;
    }

    .price-calculator__mobile-proof {
        padding-right: 5px;
        padding-left: 5px;
    }

    .price-calculator__mobile-proof > div {
        padding-right: 5px;
        padding-left: 5px;
    }

    .price-calculator__mobile-proof img {
        width: 28px;
        height: 28px;
    }

    .price-calculator__mobile-proof span {
        font-size: 9.5px;
    }

    .calculator-panel__content {
        padding-right: 13px;
        padding-left: 13px;
    }

    .calculator-panel__row--weight {
        grid-template-columns: 1fr;
    }

    .calculator-options--modeling
    .calculator-option--large {
        width: calc(100% - 30px);
        flex-basis: calc(100% - 30px);
    }

    .calculator-result__total {
        grid-template-columns: 1fr;
    }

    .calculator-result__total strong {
        grid-column: 1;
        grid-row: auto;

        margin-top: 5px;

        font-size: 30px;
    }

    .calculator-result__total small {
        grid-column: 1;
    }
}


/* =========================================================
   CALCULATOR ? REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .price-calculator.price-calculator--js
    [data-calculator-reveal],
    .calculator-option,
    .calculator-result__total strong,
    .modeling-modal,
    .modeling-modal__dialog {
        animation: none !important;
        transition: none !important;
    }

    .price-calculator.price-calculator--js
    [data-calculator-reveal] {
        opacity: 1;
        transform: none;
    }
}

/* =========================================================
   FAQ SECTION
   ========================================================= */

.faq-section {
    position: relative;
    isolation: isolate;

    width: 100%;
    min-height: 100svh;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #f7f5ef 0%,
            #fffefa 10%,
            #ffffff 89%,
            #f7f5ef 100%
        );
}

.faq-section__background {
    position: absolute;
    inset: 0;
    z-index: -2;

    overflow: hidden;
    pointer-events: none;
}

.faq-section__glow {
    position: absolute;

    border-radius: 50%;
}

.faq-section__glow--left {
    top: 22%;
    left: -19%;

    width: clamp(520px, 42vw, 980px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 204, 75, 0.1),
            transparent 69%
        );
}

.faq-section__glow--right {
    top: -17%;
    right: -13%;

    width: clamp(650px, 52vw, 1200px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 216, 114, 0.13),
            transparent 69%
        );
}

.faq-section__dots {
    position: absolute;
    right: 2%;
    bottom: 7%;

    width: clamp(140px, 11vw, 260px);
    height: clamp(100px, 8vw, 190px);

    opacity: 0.27;

    background-image:
        radial-gradient(
            circle,
            rgba(237, 171, 0, 0.27) 1.2px,
            transparent 1.45px
        );

    background-size: 13px 13px;
}

.faq-section__inner {
    position: relative;
    z-index: 2;

    width: 100%;
    min-height: 100svh;

    padding:
        clamp(95px, 6vw, 150px)
        clamp(30px, 5.2vw, 130px)
        clamp(60px, 4vw, 96px);
}


/* =========================================================
   FAQ HEADER
   ========================================================= */

.faq-section__header {
    width: min(100%, 1180px);
    margin: 0 auto;

    text-align: center;
}

.faq-section__badge {
    width: fit-content;
    min-height: clamp(38px, 2.5vw, 54px);
    margin: 0 auto clamp(24px, 1.7vw, 40px);
    padding:
        7px
        clamp(17px, 1.2vw, 28px);

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(20, 20, 20, 0.045);
    border-radius: 999px;

    background: rgba(247, 245, 239, 0.96);
    color: #343434;

    font-size: clamp(10px, 0.67vw, 15px);
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.17em;
    text-transform: uppercase;
}

.faq-section__header h2 {
    margin: 0;

    color: #111214;

    font-size: clamp(50px, 4vw, 90px);
    line-height: 1.04;
    font-weight: 640;
    letter-spacing: -0.052em;
}

.faq-section__header h2 span {
    display: block;

    margin-top: 0.08em;

    color: #efa900;
}

.faq-section__header p {
    width: min(100%, 850px);
    margin:
        clamp(22px, 1.5vw, 34px)
        auto
        0;

    color: #666666;

    font-size: clamp(15px, 1vw, 22px);
    line-height: 1.55;
}


/* =========================================================
   FAQ GRID
   ========================================================= */

.faq-section__grid {
    width: 100%;
    margin-top: clamp(48px, 3.5vw, 82px);

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    align-items: start;

    gap: clamp(17px, 1.2vw, 28px);
}

.faq-card {
    position: relative;

    min-width: 0;

    overflow: hidden;

    border: 1px solid rgba(20, 20, 20, 0.052);
    border-radius: clamp(17px, 1.15vw, 27px);

    background: rgba(255, 255, 255, 0.98);

    box-shadow:
        0 16px 42px rgba(34, 31, 23, 0.062);

    transition:
        transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}

.faq-card:hover {
    transform: translateY(-4px);

    border-color: rgba(238, 171, 0, 0.15);

    box-shadow:
        0 23px 48px rgba(34, 31, 23, 0.09);
}

.faq-card--wide {
    grid-column: 1 / -1;
}

.faq-card__question {
    width: 100%;
    min-height: clamp(80px, 5.5vw, 120px);
    padding:
        clamp(18px, 1.4vw, 31px)
        clamp(20px, 1.55vw, 36px);

    display: grid;
    grid-template-columns:
        clamp(39px, 2.7vw, 59px)
        minmax(0, 1fr)
        clamp(39px, 2.7vw, 59px);

    align-items: center;

    gap: clamp(13px, 1vw, 22px);

    border: 0;
    background: transparent;
    color: #202020;

    cursor: pointer;
    text-align: left;
}

.faq-card__number {
    color: #eda900;

    font-size: clamp(19px, 1.35vw, 30px);
    line-height: 1;
    font-weight: 590;
}

.faq-card__title {
    font-size: clamp(16px, 1.1vw, 25px);
    line-height: 1.28;
    font-weight: 680;
    letter-spacing: -0.02em;
}

.faq-card__toggle-icon {
    width: clamp(39px, 2.7vw, 59px);
    aspect-ratio: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(20, 20, 20, 0.045);
    border-radius: 50%;

    background: #faf9f5;

    transition:
        transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
        background 0.3s ease;
}

.faq-card__toggle-icon img {
    width: 54%;
    height: 54%;

    object-fit: contain;
}

.faq-card.is-open
.faq-card__toggle-icon {
    transform: rotate(180deg);

    background: #fff5d8;
}

.faq-card__answer {
    display: grid;
    grid-template-rows: 0fr;

    transition:
        grid-template-rows 0.34s cubic-bezier(0.22, 1, 0.36, 1);
}

.faq-card.is-open
.faq-card__answer {
    grid-template-rows: 1fr;
}

.faq-card__answer > div {
    min-height: 0;

    overflow: hidden;
}

.faq-card__answer p {
    margin: 0;
    padding:
        0
        clamp(20px, 1.55vw, 36px)
        clamp(22px, 1.5vw, 34px)
        calc(
            clamp(20px, 1.55vw, 36px) +
            clamp(39px, 2.7vw, 59px) +
            clamp(13px, 1vw, 22px)
        );

    border-top: 1px solid rgba(20, 20, 20, 0.065);

    color: #646464;

    font-size: clamp(12px, 0.78vw, 17px);
    line-height: 1.55;
}

.faq-card.is-open
.faq-card__answer p {
    padding-top: clamp(17px, 1.15vw, 26px);
}


/* =========================================================
   FAQ CTA
   ========================================================= */

.faq-project-cta {
    width: 100%;
    min-height: clamp(112px, 8.4vw, 185px);
    margin-top: clamp(28px, 2.1vw, 50px);
    padding:
        clamp(20px, 1.5vw, 34px)
        clamp(24px, 1.9vw, 46px);

    display: grid;
    grid-template-columns:
        minmax(420px, 1fr)
        auto;

    align-items: center;

    gap: clamp(28px, 2.2vw, 52px);

    border: 1px solid rgba(20, 20, 20, 0.055);
    border-radius: clamp(18px, 1.25vw, 30px);

    background:
        linear-gradient(
            100deg,
            #fff9e9 0%,
            #ffffff 46%,
            #ffffff 100%
        );

    box-shadow:
        0 18px 46px rgba(35, 31, 23, 0.065);
}

.faq-project-cta__intro {
    display: flex;
    align-items: center;

    gap: clamp(18px, 1.4vw, 30px);
}

.faq-project-cta__icon {
    width: clamp(65px, 4.5vw, 98px);
    aspect-ratio: 1;

    flex: 0 0 auto;
}

.faq-project-cta__icon img {
    width: 100%;
    height: 100%;

    object-fit: contain;
}

.faq-project-cta__intro strong,
.faq-project-cta__intro span {
    display: block;
}

.faq-project-cta__intro strong {
    color: #202020;

    font-size: clamp(19px, 1.35vw, 30px);
    line-height: 1.2;
    font-weight: 690;
    letter-spacing: -0.035em;
}

.faq-project-cta__intro span {
    margin-top: 7px;

    color: #efa900;

    font-size: clamp(18px, 1.25vw, 28px);
    line-height: 1.2;
    font-weight: 650;
    letter-spacing: -0.025em;
}

.faq-project-cta__actions {
    display: flex;
    align-items: center;

    gap: clamp(22px, 1.7vw, 40px);
}

.faq-project-cta__button {
    min-width: clamp(235px, 16vw, 370px);
    min-height: clamp(57px, 3.8vw, 84px);
    padding:
        0
        clamp(22px, 1.6vw, 38px);

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 25px;

    border-radius: clamp(12px, 0.8vw, 19px);

    background:
        linear-gradient(
            135deg,
            #ffd15a,
            #ffb400
        );

    color: #171717;

    font-size: clamp(13px, 0.85vw, 19px);
    line-height: 1;
    font-weight: 680;
    white-space: nowrap;

    box-shadow:
        0 15px 34px rgba(238, 171, 0, 0.22);

    transition:
        transform 0.27s ease,
        box-shadow 0.27s ease;
}

.faq-project-cta__button img {
    width: clamp(20px, 1.4vw, 29px);
    height: auto;

    object-fit: contain;
}

.faq-project-cta__button:hover,
.faq-project-cta__button:focus-visible {
    transform: translateY(-3px);

    box-shadow:
        0 21px 42px rgba(238, 171, 0, 0.31);

    outline: none;
}

.faq-project-cta__link {
    padding:
        15px
        0
        11px;

    display: flex;
    align-items: center;

    gap: 13px;

    border-bottom: 2px solid #e9a600;

    color: #303030;

    font-size: clamp(12px, 0.8vw, 18px);
    line-height: 1;
    font-weight: 670;
    white-space: nowrap;
}

.faq-project-cta__link img {
    width: clamp(31px, 2.1vw, 46px);
    height: auto;

    object-fit: contain;

    transition: transform 0.26s ease;
}

.faq-project-cta__link:hover img,
.faq-project-cta__link:focus-visible img {
    transform: translateX(6px);
}


/* =========================================================
   FAQ ANIMATIONS
   ========================================================= */

.faq-section.faq-section--js
[data-faq-reveal] {
    opacity: 0;
    transform: translateY(34px);

    transition:
        opacity 0.76s ease,
        transform 0.76s cubic-bezier(0.22, 1, 0.36, 1);
}

.faq-section.faq-section--js.is-visible
[data-faq-reveal] {
    opacity: 1;
    transform: translateY(0);
}

.faq-section.is-visible
[data-faq-reveal="questions"] {
    transition-delay: 0.12s;
}

.faq-section.is-visible
[data-faq-reveal="cta"] {
    transition-delay: 0.23s;
}


/* =========================================================
   FAQ ? 1500
   ========================================================= */

@media (max-width: 1500px) and (min-width: 1181px) {
    .faq-section__inner {
        padding:
            90px
            55px
            65px;
    }

    .faq-section__header h2 {
        font-size: 58px;
    }

    .faq-section__header p {
        font-size: 16px;
    }

    .faq-card__title {
        font-size: 17px;
    }

    .faq-card__answer p {
        font-size: 13px;
    }
}


/* =========================================================
   FAQ ? 1180
   ========================================================= */

@media (max-width: 1180px) {
    .faq-section {
        min-height: 0;
    }

    .faq-section__inner {
        min-height: 0;

        padding:
            82px
            30px
            60px;
    }

    .faq-section__header h2 {
        font-size: clamp(50px, 6vw, 70px);
    }

    .faq-section__header p {
        max-width: 780px;

        font-size: 18px;
    }

    .faq-project-cta {
        grid-template-columns: 1fr;
    }

    .faq-project-cta__actions {
        justify-content: space-between;
    }
}


/* =========================================================
   FAQ ? 900
   ========================================================= */

@media (max-width: 900px) {
    .faq-section__inner {
        padding:
            74px
            24px
            55px;
    }

    .faq-section__grid {
        grid-template-columns: 1fr;
    }

    .faq-card--wide {
        grid-column: auto;
    }

    .faq-project-cta__actions {
        align-items: stretch;
    }

    .faq-project-cta__button {
        flex: 1;
    }
}


/* =========================================================
   FAQ ? 620
   ========================================================= */

@media (max-width: 620px) {
    .faq-section__dots {
        display: none;
    }

    .faq-section__inner {
        padding:
            62px
            18px
            48px;
    }

    .faq-section__header {
        text-align: left;
    }

    .faq-section__badge {
        margin-right: 0;
        margin-left: 0;

        font-size: 9.5px;
    }

    .faq-section__header h2 {
        font-size: clamp(40px, 10.8vw, 48px);
        line-height: 1.04;
    }

    .faq-section__header p {
        margin-right: 0;
        margin-left: 0;

        font-size: 16px;
        line-height: 1.52;
    }

    .faq-section__grid {
        margin-top: 34px;

        gap: 11px;
    }

    .faq-card {
        border-radius: 17px;
    }

    .faq-card:hover {
        transform: none;
    }

    .faq-card__question {
        min-height: 73px;
        padding:
            15px
            14px;

        grid-template-columns:
            33px
            minmax(0, 1fr)
            39px;

        gap: 9px;
    }

    .faq-card__number {
        font-size: 17px;
    }

    .faq-card__title {
        font-size: 14.5px;
        line-height: 1.3;
    }

    .faq-card__toggle-icon {
        width: 39px;
    }

    .faq-card__answer p {
        padding:
            15px
            14px
            18px
            56px;

        font-size: 12.5px;
        line-height: 1.5;
    }

    .faq-project-cta {
        margin-top: 28px;
        padding:
            21px
            18px;

        gap: 21px;

        border-radius: 19px;
    }

    .faq-project-cta__intro {
        align-items: flex-start;

        gap: 14px;
    }

    .faq-project-cta__icon {
        width: 57px;
    }

    .faq-project-cta__intro strong {
        font-size: 20px;
    }

    .faq-project-cta__intro span {
        margin-top: 5px;

        font-size: 17px;
        line-height: 1.25;
    }

    .faq-project-cta__actions {
        flex-direction: column;

        gap: 14px;
    }

    .faq-project-cta__button {
        width: 100%;
        min-width: 0;
        min-height: 58px;

        font-size: 13px;
    }

    .faq-project-cta__link {
        width: fit-content;
        margin: 0 auto;

        font-size: 13px;
    }
}


/* =========================================================
   FAQ ? 390
   ========================================================= */

@media (max-width: 390px) {
    .faq-section__inner {
        padding-right: 16px;
        padding-left: 16px;
    }

    .faq-card__question {
        padding-right: 12px;
        padding-left: 12px;

        grid-template-columns:
            31px
            minmax(0, 1fr)
            37px;
    }

    .faq-card__title {
        font-size: 14px;
    }

    .faq-card__answer p {
        padding-right: 12px;
        padding-left: 52px;
    }
}


/* =========================================================
   FAQ ? REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .faq-section.faq-section--js
    [data-faq-reveal],
    .faq-card,
    .faq-card__answer,
    .faq-card__toggle-icon,
    .faq-project-cta__button,
    .faq-project-cta__link img {
        animation: none !important;
        transition: none !important;
    }

    .faq-section.faq-section--js
    [data-faq-reveal] {
        opacity: 1;
        transform: none;
    }
}

/* =========================================================
   PROJECT REQUEST
   ========================================================= */

.project-request {
    position: relative;
    isolation: isolate;

    width: 100%;
    min-height: 100svh;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #f7f5ef 0%,
            #fffefa 10%,
            #ffffff 89%,
            #f7f5ef 100%
        );
}

.project-request__background {
    position: absolute;
    inset: 0;
    z-index: -2;

    overflow: hidden;
    pointer-events: none;
}

.project-request__glow {
    position: absolute;
    border-radius: 50%;
}

.project-request__glow--left {
    top: 18%;
    left: -18%;

    width: clamp(520px, 42vw, 980px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 203, 73, 0.12),
            transparent 69%
        );
}

.project-request__glow--right {
    top: -15%;
    right: -12%;

    width: clamp(650px, 52vw, 1200px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 216, 114, 0.14),
            transparent 69%
        );
}

.project-request__dots {
    position: absolute;
    right: 2%;
    bottom: 7%;

    width: clamp(140px, 11vw, 260px);
    height: clamp(100px, 8vw, 190px);

    opacity: 0.27;

    background-image:
        radial-gradient(
            circle,
            rgba(237, 171, 0, 0.27) 1.2px,
            transparent 1.45px
        );

    background-size: 13px 13px;
}

.project-request__inner {
    position: relative;
    z-index: 2;

    width: 100%;
    min-height: 100svh;

    padding:
        clamp(100px, 6vw, 150px)
        clamp(30px, 5vw, 125px)
        clamp(60px, 4vw, 96px);
}

.project-request__layout {
    width: 100%;

    display: grid;
    grid-template-columns:
        minmax(390px, 36%)
        minmax(0, 64%);

    align-items: center;

    gap: clamp(42px, 4.2vw, 105px);
}


/* =========================================================
   PROJECT REQUEST INTRO
   ========================================================= */

.project-request__intro {
    min-width: 0;
}

.project-request__badge {
    width: fit-content;
    min-height: clamp(38px, 2.5vw, 54px);
    padding: 7px clamp(17px, 1.2vw, 28px);

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(238, 171, 0, 0.11);
    border-radius: 999px;

    background: #fff8e6;
    color: #3f3f3f;

    font-size: clamp(10px, 0.67vw, 15px);
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.17em;
    text-transform: uppercase;
}

.project-request__intro h2 {
    margin: clamp(30px, 2.2vw, 48px) 0 0;

    color: #111214;

    font-size: clamp(50px, 3.75vw, 86px);
    line-height: 1.04;
    font-weight: 640;
    letter-spacing: -0.052em;
}

.project-request__intro h2 span {
    display: block;
    margin-top: 0.22em;
    color: #efa900;
}

.project-request__lead {
    width: min(100%, 680px);
    margin: clamp(28px, 2vw, 43px) 0 0;

    color: #626262;

    font-size: clamp(15px, 1vw, 22px);
    line-height: 1.62;
}

.project-request__advantages {
    margin-top: clamp(38px, 2.9vw, 64px);

    display: grid;
    gap: clamp(20px, 1.5vw, 32px);
}

.project-request-advantage {
    display: grid;
    grid-template-columns:
        clamp(60px, 4vw, 86px)
        minmax(0, 1fr);

    align-items: center;
    gap: clamp(17px, 1.2vw, 26px);
}

.project-request-advantage__icon {
    width: clamp(60px, 4vw, 86px);
    aspect-ratio: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(238, 171, 0, 0.11);
    border-radius: 50%;

    background: rgba(255, 255, 255, 0.97);

    box-shadow:
        0 12px 27px rgba(55, 45, 25, 0.07);
}

.project-request-advantage__icon img {
    width: 60%;
    height: 60%;

    object-fit: contain;
}

.project-request-advantage strong,
.project-request-advantage span {
    display: block;
}

.project-request-advantage strong {
    color: #292929;

    font-size: clamp(14px, 0.95vw, 21px);
    line-height: 1.28;
    font-weight: 690;
}

.project-request-advantage span {
    margin-top: 6px;

    color: #707070;

    font-size: clamp(11px, 0.72vw, 16px);
    line-height: 1.42;
}


/* =========================================================
   PROJECT REQUEST FORM
   ========================================================= */

.project-request__form-card {
    min-width: 0;
    padding: clamp(28px, 2.2vw, 50px);

    border: 1px solid rgba(20, 20, 20, 0.055);
    border-radius: clamp(21px, 1.5vw, 35px);

    background: rgba(255, 255, 255, 0.985);

    box-shadow:
        0 28px 72px rgba(38, 32, 22, 0.105);
}

.project-request-form {
    position: relative;
    margin: 0;
}

.project-request-form__trap {
    position: absolute !important;
    left: -10000px !important;

    width: 1px !important;
    height: 1px !important;

    overflow: hidden !important;

    opacity: 0 !important;
    pointer-events: none !important;
}

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

    gap:
        clamp(22px, 1.6vw, 35px)
        clamp(20px, 1.5vw, 32px);
}

.project-request-field {
    min-width: 0;
}

.project-request-field label {
    display: block;
    margin-bottom: clamp(9px, 0.65vw, 14px);

    color: #272727;

    font-size: clamp(12px, 0.78vw, 17px);
    line-height: 1.25;
    font-weight: 680;
}

.project-request-field label > span {
    color: #e8a500;
}

.project-request-field input,
.project-request-field select,
.project-request-field textarea {
    width: 100%;

    border: 1px solid rgba(20, 20, 20, 0.105);
    outline: 0;

    border-radius: clamp(11px, 0.75vw, 17px);

    background: #ffffff;
    color: #222222;

    font: inherit;
    font-size: clamp(12px, 0.8vw, 17px);

    transition:
        border-color 0.23s ease,
        box-shadow 0.23s ease,
        background 0.23s ease;
}

.project-request-field input,
.project-request-field select {
    min-height: clamp(57px, 4vw, 82px);
    padding: 0 clamp(15px, 1.1vw, 24px);
}

.project-request-field input::placeholder,
.project-request-field textarea::placeholder {
    color: #a3a3a3;
}

.project-request-field input:hover,
.project-request-field select:hover,
.project-request-field textarea:hover {
    border-color: rgba(238, 171, 0, 0.35);
}

.project-request-field input:focus,
.project-request-field select:focus,
.project-request-field textarea:focus {
    border-color: #e9a600;

    background: #fffefb;

    box-shadow:
        0 0 0 4px rgba(238, 171, 0, 0.1);
}

.project-request-select {
    position: relative;
}

.project-request-select select {
    padding-right: clamp(45px, 3vw, 64px);

    appearance: none;
    cursor: pointer;
}

.project-request-select > img {
    position: absolute;
    top: 50%;
    right: clamp(15px, 1.1vw, 23px);

    width: clamp(17px, 1.15vw, 24px);
    height: clamp(17px, 1.15vw, 24px);

    object-fit: contain;
    pointer-events: none;

    transform: translateY(-50%);
}

.project-request-textarea {
    position: relative;
}

.project-request-field textarea {
    min-height: clamp(118px, 8vw, 175px);
    padding: clamp(15px, 1.1vw, 24px);

    resize: vertical;
    line-height: 1.52;
}

.project-request-textarea__counter {
    position: absolute;
    right: clamp(13px, 1vw, 21px);
    bottom: clamp(11px, 0.8vw, 17px);

    padding: 3px 7px;

    border-radius: 7px;

    background: rgba(255, 255, 255, 0.94);
    color: #8a8a8a;

    font-size: clamp(9px, 0.58vw, 12px);
    line-height: 1;
}

.project-request-field__error {
    min-height: 18px;
    margin-top: 6px;

    display: block;

    color: #b42318;

    font-size: 11px;
    line-height: 1.35;
}

.project-request-field.is-invalid input,
.project-request-field.is-invalid select,
.project-request-field.is-invalid textarea,
.project-request-consent.is-invalid .project-request-consent__box,
.project-request-upload.is-invalid .project-request-upload__label {
    border-color: #d92d20;

    box-shadow:
        0 0 0 3px rgba(217, 45, 32, 0.08);
}


/* =========================================================
   PROJECT REQUEST UPLOAD
   ========================================================= */

.project-request-upload {
    margin-top: clamp(25px, 1.8vw, 40px);
}

.project-request-upload__input {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;
    pointer-events: none;
}

.project-request-upload__label {
    min-height: clamp(215px, 14vw, 310px);
    padding: clamp(25px, 2vw, 44px);

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border: 2px dashed rgba(230, 165, 0, 0.34);
    border-radius: clamp(16px, 1.1vw, 25px);

    background:
        linear-gradient(
            135deg,
            #fffdf8,
            #fffaf0
        );

    cursor: pointer;
    text-align: center;

    transition:
        border-color 0.25s ease,
        background 0.25s ease,
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.project-request-upload__label:hover,
.project-request-upload.is-dragover .project-request-upload__label {
    border-color: #e9a600;

    background: #fff6dc;

    box-shadow:
        0 14px 32px rgba(238, 171, 0, 0.1);

    transform: translateY(-2px);
}

.project-request-upload__icon {
    width: clamp(65px, 4.7vw, 100px);
    aspect-ratio: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(238, 171, 0, 0.15);
    border-radius: 50%;

    background: #ffffff;
}

.project-request-upload__icon img {
    width: 62%;
    height: 62%;

    object-fit: contain;
}

.project-request-upload__label > strong {
    margin-top: clamp(16px, 1.2vw, 25px);

    color: #252525;

    font-size: clamp(14px, 0.95vw, 21px);
    line-height: 1.3;
    font-weight: 690;
}

.project-request-upload__label > span:not(.project-request-upload__icon):not(.project-request-upload__formats) {
    margin-top: 7px;

    color: #737373;

    font-size: clamp(10px, 0.68vw, 15px);
    line-height: 1.4;
}

.project-request-upload__formats {
    margin-top: clamp(18px, 1.4vw, 30px);

    display: flex;
    flex-wrap: wrap;
    justify-content: center;

    gap: clamp(7px, 0.6vw, 12px);
}

.project-request-upload__formats > span {
    min-height: clamp(30px, 2vw, 42px);
    padding: 0 clamp(10px, 0.75vw, 16px);

    display: flex;
    align-items: center;

    gap: 7px;

    border: 1px solid rgba(20, 20, 20, 0.075);
    border-radius: 9px;

    background: #ffffff;
    color: #444444;

    font-size: clamp(9px, 0.59vw, 13px);
    font-weight: 680;
}

.project-request-upload__formats img {
    width: clamp(14px, 0.95vw, 20px);
    height: clamp(14px, 0.95vw, 20px);

    object-fit: contain;
}

.project-request-upload__list {
    display: grid;
    gap: 9px;
}

.project-request-upload__list:not(:empty) {
    margin-top: 13px;
}

.project-request-file {
    min-height: 58px;
    padding: 8px 11px 8px 13px;

    display: grid;
    grid-template-columns:
        34px
        minmax(0, 1fr)
        38px;

    align-items: center;
    gap: 11px;

    border: 1px solid rgba(20, 20, 20, 0.075);
    border-radius: 12px;

    background: #ffffff;
}

.project-request-file > img {
    width: 29px;
    height: 29px;

    object-fit: contain;
}

.project-request-file strong,
.project-request-file span {
    display: block;
}

.project-request-file strong {
    overflow: hidden;

    color: #292929;

    font-size: 12px;
    line-height: 1.25;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-request-file span {
    margin-top: 3px;

    color: #818181;

    font-size: 10px;
}

.project-request-file button {
    width: 34px;
    height: 34px;
    padding: 0;

    border: 1px solid rgba(20, 20, 20, 0.075);
    border-radius: 9px;

    background: #ffffff;
    color: #555555;

    cursor: pointer;

    font-size: 20px;
    line-height: 1;

    transition:
        border-color 0.2s ease,
        background 0.2s ease,
        color 0.2s ease;
}

.project-request-file button:hover,
.project-request-file button:focus-visible {
    border-color: rgba(217, 45, 32, 0.25);

    background: #fff1f0;
    color: #b42318;

    outline: none;
}


/* =========================================================
   PROJECT REQUEST CONSENT
   ========================================================= */

.project-request-consent {
    margin-top: clamp(20px, 1.45vw, 31px);
}

.project-request-consent > label {
    display: grid;
    grid-template-columns:
        23px
        minmax(0, 1fr);

    align-items: start;
    gap: 12px;

    cursor: pointer;
}

.project-request-consent input {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;
}

.project-request-consent__box {
    width: 23px;
    height: 23px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(20, 20, 20, 0.18);
    border-radius: 6px;

    background: #ffffff;

    transition:
        border-color 0.2s ease,
        background 0.2s ease,
        box-shadow 0.2s ease;
}

.project-request-consent__box::after {
    content: "?";

    color: #ffffff;

    font-size: 14px;
    font-weight: 800;

    opacity: 0;
    transform: scale(0.7);

    transition:
        opacity 0.2s ease,
        transform 0.2s ease;
}

.project-request-consent input:checked + .project-request-consent__box {
    border-color: #e9a600;
    background: #e9a600;
}

.project-request-consent input:checked + .project-request-consent__box::after {
    opacity: 1;
    transform: scale(1);
}

.project-request-consent input:focus-visible + .project-request-consent__box {
    box-shadow:
        0 0 0 4px rgba(238, 171, 0, 0.12);
}

.project-request-consent__text {
    color: #686868;

    font-size: clamp(10px, 0.69vw, 15px);
    line-height: 1.55;
}

.project-request-consent__text a {
    color: #d79500;

    font-weight: 680;
    text-decoration: underline;
    text-underline-offset: 3px;
}


/* =========================================================
   PROJECT REQUEST SUBMIT
   ========================================================= */

.project-request-form__submit {
    position: relative;

    width: 100%;
    min-height: clamp(64px, 4.4vw, 94px);
    margin-top: clamp(22px, 1.6vw, 35px);
    padding: 0 clamp(25px, 1.8vw, 43px);

    display: flex;
    align-items: center;
    justify-content: center;

    gap: clamp(22px, 1.7vw, 39px);

    overflow: hidden;

    border: 0;
    border-radius: clamp(13px, 0.9vw, 20px);

    background:
        linear-gradient(
            135deg,
            #ffd15a,
            #ffb400
        );

    color: #171717;

    cursor: pointer;

    font-size: clamp(15px, 1vw, 23px);
    line-height: 1;
    font-weight: 700;

    box-shadow:
        0 16px 38px rgba(238, 171, 0, 0.24);

    transition:
        transform 0.26s ease,
        box-shadow 0.26s ease,
        opacity 0.26s ease;
}

.project-request-form__submit img {
    width: clamp(23px, 1.5vw, 32px);
    height: clamp(23px, 1.5vw, 32px);

    object-fit: contain;

    transition: transform 0.26s ease;
}

.project-request-form__submit:hover,
.project-request-form__submit:focus-visible {
    transform: translateY(-3px);

    box-shadow:
        0 22px 47px rgba(238, 171, 0, 0.32);

    outline: none;
}

.project-request-form__submit:hover img {
    transform: translateX(5px);
}

.project-request-form__submit:disabled {
    cursor: wait;
    opacity: 0.72;
    transform: none;
}

.project-request-form__submit.is-loading img {
    display: none;
}

.project-request-form__submit.is-loading::after {
    content: "";

    width: 23px;
    height: 23px;

    border: 3px solid rgba(20, 20, 20, 0.22);
    border-top-color: #171717;
    border-radius: 50%;

    animation:
        project-request-spinner
        0.8s
        linear
        infinite;
}

.project-request-form__security {
    margin-top: clamp(16px, 1.2vw, 25px);

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 10px;

    color: #727272;

    font-size: clamp(9px, 0.62vw, 13px);
    line-height: 1.4;
    text-align: center;
}

.project-request-form__security img {
    width: clamp(21px, 1.4vw, 29px);
    height: clamp(21px, 1.4vw, 29px);

    flex: 0 0 auto;
    object-fit: contain;
}

.project-request-form__status {
    min-height: 0;
    margin: 0;

    border-radius: 12px;

    font-size: 13px;
    line-height: 1.45;
    text-align: center;
}

.project-request-form__status:not(:empty) {
    min-height: 48px;
    margin-top: 16px;
    padding: 13px 16px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.project-request-form__status.is-success {
    border: 1px solid rgba(3, 152, 85, 0.17);

    background: #ecfdf3;
    color: #027a48;
}

.project-request-form__status.is-error {
    border: 1px solid rgba(217, 45, 32, 0.17);

    background: #fff1f0;
    color: #b42318;
}

.project-request-form__status.is-info {
    border: 1px solid rgba(238, 171, 0, 0.18);

    background: #fff8e5;
    color: #8b6300;
}

@keyframes project-request-spinner {
    to {
        transform: rotate(360deg);
    }
}


/* =========================================================
   PROJECT REQUEST ANIMATIONS
   ========================================================= */

.project-request.project-request--js [data-request-reveal] {
    opacity: 0;

    transform: translateY(34px);

    transition:
        opacity 0.78s ease,
        transform 0.78s cubic-bezier(0.22, 1, 0.36, 1);
}

.project-request.project-request--js [data-request-reveal="intro"] {
    transform: translateX(-38px);
}

.project-request.project-request--js [data-request-reveal="form"] {
    transform: translateX(42px);
}

.project-request.project-request--js.is-visible [data-request-reveal] {
    opacity: 1;
    transform: translate(0, 0);
}

.project-request.is-visible [data-request-reveal="form"] {
    transition-delay: 0.12s;
}


/* =========================================================
   PROJECT REQUEST ? 1500
   ========================================================= */

@media (max-width: 1500px) and (min-width: 1181px) {
    .project-request__inner {
        padding:
            90px
            50px
            65px;
    }

    .project-request__layout {
        grid-template-columns:
            minmax(360px, 35%)
            minmax(0, 65%);

        gap: 45px;
    }

    .project-request__intro h2 {
        font-size: 56px;
    }

    .project-request__lead {
        font-size: 16px;
    }

    .project-request__form-card {
        padding: 30px;
    }
}


/* =========================================================
   PROJECT REQUEST ? 1180
   ========================================================= */

@media (max-width: 1180px) {
    .project-request {
        min-height: 0;
    }

    .project-request__inner {
        min-height: 0;

        padding:
            82px
            30px
            60px;
    }

    .project-request__layout {
        grid-template-columns: 1fr;

        gap: 48px;
    }

    .project-request__intro {
        max-width: 900px;
    }

    .project-request__intro h2 {
        font-size: clamp(52px, 6vw, 72px);
    }

    .project-request__lead {
        max-width: 760px;

        font-size: 18px;
    }

    .project-request__advantages {
        max-width: 900px;

        grid-template-columns: repeat(3, minmax(0, 1fr));

        gap: 18px;
    }

    .project-request-advantage {
        padding: 17px 15px;

        grid-template-columns:
            55px
            minmax(0, 1fr);

        border: 1px solid rgba(20, 20, 20, 0.055);
        border-radius: 16px;

        background: rgba(255, 255, 255, 0.97);
    }

    .project-request-advantage__icon {
        width: 55px;

        box-shadow: none;
    }

    .project-request__form-card {
        width: 100%;
    }
}


/* =========================================================
   PROJECT REQUEST ? 900
   ========================================================= */

@media (max-width: 900px) {
    .project-request__inner {
        padding:
            74px
            24px
            55px;
    }

    .project-request__advantages {
        grid-template-columns: 1fr;
    }

    .project-request-advantage {
        max-width: 560px;
    }

    .project-request-form__grid {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   PROJECT REQUEST ? 620
   ========================================================= */

@media (max-width: 620px) {
    .project-request__dots {
        display: none;
    }

    .project-request__inner {
        padding:
            62px
            18px
            48px;
    }

    .project-request__layout {
        gap: 34px;
    }

    .project-request__badge {
        font-size: 9.5px;
    }

    .project-request__intro h2 {
        font-size: clamp(40px, 10.8vw, 48px);
        line-height: 1.04;
    }

    .project-request__intro h2 br {
        display: none;
    }

    .project-request__lead {
        margin-top: 23px;

        font-size: 16px;
        line-height: 1.52;
    }

    .project-request__advantages {
        width: 100%;
        margin-top: 28px;
        padding: 3px 0 17px;

        display: grid;
        grid-template-columns: 1fr;

        gap: 12px;

        overflow: visible;
        scrollbar-width: none;
    }

    .project-request__advantages::-webkit-scrollbar {
        display: none;
    }

    .project-request-advantage {
        width: 100%;
        min-height: 94px;
        padding: 14px 15px;

        max-width: none;
        flex: none;

        grid-template-columns:
            55px
            minmax(0, 1fr);
    }

    .project-request-advantage strong {
        font-size: 14px;
    }

    .project-request-advantage span {
        font-size: 11px;
    }

    .project-request__form-card {
        padding:
            21px
            15px
            18px;

        border-radius: 20px;
    }

    .project-request-form__grid {
        gap: 17px;
    }

    .project-request-field label {
        margin-bottom: 8px;

        font-size: 13px;
    }

    .project-request-field input,
    .project-request-field select {
        min-height: 57px;
        padding: 0 14px;

        border-radius: 13px;

        font-size: 15px;
    }

    .project-request-field textarea {
        min-height: 145px;
        padding: 14px;

        border-radius: 13px;

        font-size: 15px;
    }

    .project-request-upload {
        margin-top: 20px;
    }

    .project-request-upload__label {
        min-height: 240px;
        padding: 23px 13px;

        border-radius: 16px;
    }

    .project-request-upload__icon {
        width: 66px;
    }

    .project-request-upload__label > strong {
        max-width: 260px;

        font-size: 15px;
    }

    .project-request-upload__label > span:not(.project-request-upload__icon):not(.project-request-upload__formats) {
        max-width: 270px;

        font-size: 11px;
    }

    .project-request-upload__formats {
        max-width: 290px;

        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));

        gap: 7px;
    }

    .project-request-upload__formats > span {
        min-height: 34px;
        padding: 0 8px;

        justify-content: center;

        font-size: 9px;
    }

    .project-request-consent {
        margin-top: 19px;
    }

    .project-request-consent__text {
        font-size: 11px;
        line-height: 1.48;
    }

    .project-request-form__submit {
        min-height: 60px;
        padding: 0 18px;

        border-radius: 14px;

        font-size: 13px;
    }

    .project-request-form__security {
        align-items: flex-start;

        font-size: 10px;
        text-align: left;
    }
}


/* =========================================================
   PROJECT REQUEST ? 390
   ========================================================= */

@media (max-width: 390px) {
    .project-request__inner {
        padding-right: 16px;
        padding-left: 16px;
    }

    .project-request__advantages {
        width: 100%;
        padding-right: 0;
    }

    .project-request-advantage {
        width: 100%;
        flex-basis: auto;
    }

    .project-request__form-card {
        padding-right: 13px;
        padding-left: 13px;
    }

    .project-request-upload__formats {
        width: 100%;
    }

    .project-request-form__submit {
        gap: 12px;
    }
}


/* =========================================================
   PROJECT REQUEST ? REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .project-request.project-request--js [data-request-reveal],
    .project-request-upload__label,
    .project-request-form__submit,
    .project-request-form__submit img {
        animation: none !important;
        transition: none !important;
    }

    .project-request.project-request--js [data-request-reveal] {
        opacity: 1;
        transform: none;
    }
}

/* =========================================================
   LANDING FOOTER
   ========================================================= */

.landing-footer {
    position: relative;
    isolation: isolate;

    width: 100%;

    overflow: hidden;

    border-top: 1px solid rgba(20, 20, 20, 0.06);

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fffdf7 42%,
            #f7f3e9 100%
        );
}

.landing-footer__background {
    position: absolute;
    inset: 0;
    z-index: -1;

    overflow: hidden;
    pointer-events: none;
}

.landing-footer__glow {
    position: absolute;

    border-radius: 50%;
}

.landing-footer__glow--left {
    top: -45%;
    left: -13%;

    width: clamp(420px, 36vw, 920px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 195, 38, 0.14) 0%,
            rgba(255, 219, 128, 0.05) 48%,
            transparent 72%
        );
}

.landing-footer__glow--right {
    right: -14%;
    bottom: -65%;

    width: clamp(500px, 42vw, 1050px);
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            rgba(255, 210, 91, 0.14) 0%,
            rgba(255, 228, 160, 0.05) 52%,
            transparent 73%
        );
}

.landing-footer__dots {
    position: absolute;
    top: 12%;
    right: 3%;

    width: clamp(110px, 9vw, 220px);
    height: clamp(90px, 7vw, 170px);

    opacity: 0.24;

    background-image:
        radial-gradient(
            circle,
            rgba(225, 159, 0, 0.34) 1.2px,
            transparent 1.4px
        );

    background-size: 13px 13px;
}

.landing-footer__inner {
    position: relative;
    z-index: 2;

    width: 100%;
}

.landing-footer__top {
    width: 100%;
    padding:
        clamp(68px, 5vw, 120px)
        clamp(30px, 3.8vw, 96px)
        clamp(48px, 3.5vw, 84px);

    display: grid;
    grid-template-columns:
        minmax(390px, 1.2fr)
        minmax(290px, 0.72fr)
        minmax(390px, 1fr);

    align-items: start;

    gap: clamp(36px, 3.5vw, 88px);
}


/* =========================================================
   LANDING FOOTER — BRAND
   ========================================================= */

.landing-footer__brand-column {
    min-width: 0;
}

.landing-footer__logo {
    width: clamp(245px, 17vw, 350px);

    display: inline-flex;
}

.landing-footer__logo img {
    width: 100%;
    height: auto;

    object-fit: contain;
}

.landing-footer__brand-column h2 {
    max-width: 680px;
    margin:
        clamp(30px, 2.2vw, 48px)
        0
        0;

    color: #17181a;

    font-size: clamp(34px, 2.5vw, 58px);
    line-height: 1.08;
    font-weight: 640;
    letter-spacing: -0.045em;
}

.landing-footer__brand-column h2 span {
    display: block;

    margin-top: 0.12em;

    color: #e7a500;
}

.landing-footer__description {
    max-width: 650px;
    margin:
        clamp(22px, 1.5vw, 34px)
        0
        0;

    color: #626262;

    font-size: clamp(15px, 1vw, 22px);
    line-height: 1.58;
}

.landing-footer__badges {
    margin-top: clamp(25px, 1.8vw, 38px);

    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.landing-footer__badges span {
    min-height: 42px;
    padding:
        0
        15px;

    display: inline-flex;
    align-items: center;
    gap: 9px;

    border: 1px solid rgba(225, 160, 0, 0.12);
    border-radius: 999px;

    background: rgba(255, 255, 255, 0.78);
    color: #424242;

    font-size: clamp(11px, 0.7vw, 14px);
    line-height: 1;
    font-weight: 650;
}

.landing-footer__badges svg {
    width: 19px;
    height: 19px;

    flex: 0 0 auto;

    fill: none;
    stroke: #d99a00;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.landing-footer__socials {
    max-width: 650px;
    margin-top: clamp(25px, 1.8vw, 38px);

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 12px;
}

.landing-footer__socials > a {
    min-width: 0;
    min-height: 72px;
    padding:
        10px
        14px;

    display: grid;
    grid-template-columns:
        44px
        minmax(0, 1fr)
        20px;

    align-items: center;

    gap: 12px;

    border: 1px solid rgba(20, 20, 20, 0.07);
    border-radius: 16px;

    background: rgba(255, 255, 255, 0.88);

    box-shadow:
        0 10px 27px rgba(35, 31, 23, 0.045);

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.landing-footer__socials > a:hover,
.landing-footer__socials > a:focus-visible {
    transform: translateY(-3px);

    border-color: rgba(225, 160, 0, 0.24);

    box-shadow:
        0 16px 35px rgba(35, 31, 23, 0.075);

    outline: none;
}

.landing-footer__social-icon {
    width: 44px;
    height: 44px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    background: #fff6dc;
    color: #1d1d1d;
}

.landing-footer__social-icon svg {
    width: 23px;
    height: 23px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.landing-footer__socials small,
.landing-footer__socials strong {
    display: block;
}

.landing-footer__socials small {
    color: #777777;

    font-size: 11px;
    line-height: 1.2;
    font-weight: 550;
}

.landing-footer__socials strong {
    margin-top: 4px;

    overflow: hidden;

    color: #242424;

    font-size: clamp(13px, 0.82vw, 16px);
    line-height: 1.2;
    font-weight: 680;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.landing-footer__socials b {
    color: #e3a100;

    font-size: 21px;
    line-height: 1;

    transition: transform 0.25s ease;
}

.landing-footer__socials > a:hover b {
    transform: translate(3px, -3px);
}


/* =========================================================
   LANDING FOOTER — LINKS
   ========================================================= */

.landing-footer__links-column {
    min-width: 0;

    display: grid;
    gap: clamp(38px, 3vw, 64px);
}

.landing-footer__link-group h3 {
    margin: 0 0 clamp(22px, 1.5vw, 32px);

    color: #232323;

    font-size: clamp(13px, 0.82vw, 17px);
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.landing-footer__link-group h3::after {
    content: "";

    width: 44px;
    height: 3px;
    margin-top: 13px;

    display: block;

    border-radius: 999px;

    background:
        linear-gradient(
            90deg,
            #e6a300,
            #ffc83f
        );
}

.landing-footer__link-group nav {
    display: grid;
    gap: 8px;
}

.landing-footer__link-group a {
    min-height: 48px;
    padding:
        0
        4px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;

    border-bottom: 1px solid rgba(20, 20, 20, 0.07);

    color: #4e4e4e;

    font-size: clamp(14px, 0.9vw, 18px);
    line-height: 1.2;
    font-weight: 560;

    transition:
        color 0.22s ease,
        padding-left 0.22s ease;
}

.landing-footer__link-group a b {
    color: #dfa000;

    font-size: 19px;
    line-height: 1;

    transition: transform 0.22s ease;
}

.landing-footer__link-group a:hover,
.landing-footer__link-group a:focus-visible {
    padding-left: 8px;

    color: #c98e00;

    outline: none;
}

.landing-footer__link-group a:hover b {
    transform: translateX(4px);
}


/* =========================================================
   LANDING FOOTER — CONTACT
   ========================================================= */

.landing-footer__contact-column {
    min-width: 0;
}

.landing-footer__contact-heading > span {
    color: #e3a100;

    font-size: clamp(10px, 0.68vw, 14px);
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.landing-footer__contact-heading h3 {
    margin:
        clamp(16px, 1vw, 23px)
        0
        0;

    color: #17181a;

    font-size: clamp(29px, 2vw, 45px);
    line-height: 1.1;
    font-weight: 640;
    letter-spacing: -0.042em;
}

.landing-footer__contact-heading p {
    max-width: 580px;
    margin:
        clamp(15px, 1vw, 23px)
        0
        0;

    color: #696969;

    font-size: clamp(14px, 0.86vw, 18px);
    line-height: 1.52;
}

.landing-footer__contact-card {
    margin-top: clamp(25px, 1.8vw, 38px);
    padding: clamp(20px, 1.5vw, 31px);

    border-radius: clamp(20px, 1.35vw, 29px);

    background:
        linear-gradient(
            145deg,
            #202124,
            #121315
        );

    color: #ffffff;

    box-shadow:
        0 24px 55px rgba(19, 19, 19, 0.16);
}

.landing-footer__contact-item {
    min-width: 0;
    min-height: 68px;

    display: grid;
    grid-template-columns:
        48px
        minmax(0, 1fr);

    align-items: center;

    gap: 15px;

    color: inherit;
}

.landing-footer__contact-item + .landing-footer__contact-item {
    margin-top: 10px;
    padding-top: 17px;

    border-top: 1px solid rgba(255, 255, 255, 0.09);
}

.landing-footer__contact-item > .landing-footer__contact-icon {
    width: 48px;
    height: 48px;
    margin: 0;

    flex: 0 0 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    align-self: center;

    border: 1px solid rgba(255, 190, 25, 0.16);
    border-radius: 14px;

    background: rgba(255, 188, 18, 0.1);
    color: #ffc229;

    line-height: 0;
}

.landing-footer__contact-item > .landing-footer__contact-icon svg {
    width: 24px;
    height: 24px;

    display: block;
    flex: 0 0 auto;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.landing-footer__contact-item > div > small,
.landing-footer__contact-item > div > strong,
.landing-footer__contact-item > div > span {
    display: block;
}

.landing-footer__contact-item > div > small {
    margin: 0 0 4px;

    color: rgba(255, 255, 255, 0.54);

    font-size: 10px;
    line-height: 1.2;
    font-weight: 650;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.landing-footer__contact-item > div > strong {
    margin: 0;

    color: #ffffff;

    font-size: clamp(14px, 0.9vw, 18px);
    line-height: 1.28;
    font-weight: 670;
}

.landing-footer__contact-item > div > span {
    margin: 4px 0 0;

    color: rgba(255, 255, 255, 0.68);

    font-size: clamp(12px, 0.74vw, 15px);
    line-height: 1.45;
}

a.landing-footer__contact-item {
    transition: transform 0.22s ease;
}

a.landing-footer__contact-item:hover,
a.landing-footer__contact-item:focus-visible {
    transform: translateX(4px);

    outline: none;
}

.landing-footer__contact-button {
    width: 100%;
    min-height: clamp(56px, 3.5vw, 68px);
    margin-top: clamp(22px, 1.5vw, 30px);
    padding:
        0
        clamp(19px, 1.35vw, 28px);

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            #ffd15a,
            #ffb400
        );

    color: #171717;

    font-size: clamp(13px, 0.85vw, 17px);
    line-height: 1;
    font-weight: 700;

    box-shadow:
        0 15px 32px rgba(255, 181, 0, 0.18);

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.landing-footer__contact-button b {
    font-size: 22px;
    line-height: 1;

    transition: transform 0.25s ease;
}

.landing-footer__contact-button:hover,
.landing-footer__contact-button:focus-visible {
    transform: translateY(-3px);

    box-shadow:
        0 20px 38px rgba(255, 181, 0, 0.27);

    outline: none;
}

.landing-footer__contact-button:hover b {
    transform: translate(4px, -4px);
}


/* =========================================================
   LANDING FOOTER — BOTTOM
   ========================================================= */

.landing-footer__bottom {
    width: 100%;
    padding:
        24px
        clamp(30px, 3.8vw, 96px)
        calc(24px + env(safe-area-inset-bottom));

    display: grid;
    grid-template-columns:
        minmax(230px, 1fr)
        auto
        minmax(230px, 1fr);

    align-items: center;

    gap: 20px;

    border-top: 1px solid rgba(20, 20, 20, 0.08);

    background: rgba(255, 255, 255, 0.38);
}

.landing-footer__bottom > p {
    margin: 0;

    color: #747474;

    font-size: clamp(11px, 0.72vw, 14px);
    line-height: 1.4;
}

.landing-footer__bottom > p:last-child {
    text-align: right;
}

.landing-footer__legal {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.landing-footer__legal a,
.landing-footer__legal button {
    position: relative;

    padding:
        0
        13px;

    border: 0;

    background: transparent;
    color: #626262;

    font: inherit;
    font-size: clamp(11px, 0.72vw, 14px);
    line-height: 1.4;

    cursor: pointer;

    transition: color 0.22s ease;
}

.landing-footer__legal > *:not(:last-child)::after {
    content: "";

    position: absolute;
    top: 50%;
    right: 0;

    width: 1px;
    height: 14px;

    background: rgba(20, 20, 20, 0.13);

    transform: translateY(-50%);
}

.landing-footer__legal a:hover,
.landing-footer__legal a:focus-visible,
.landing-footer__legal button:hover,
.landing-footer__legal button:focus-visible {
    color: #cb9000;

    outline: none;
}


/* =========================================================
   LANDING FOOTER — 1400
   ========================================================= */

@media (max-width: 1400px) and (min-width: 1181px) {
    .landing-footer__top {
        padding-right: 42px;
        padding-left: 42px;

        grid-template-columns:
            minmax(350px, 1.12fr)
            minmax(240px, 0.68fr)
            minmax(360px, 1fr);

        gap: 34px;
    }

    .landing-footer__bottom {
        padding-right: 42px;
        padding-left: 42px;
    }
}


/* =========================================================
   LANDING FOOTER — 1180
   ========================================================= */

@media (max-width: 1180px) {
    .landing-footer__top {
        padding:
            70px
            30px
            56px;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(360px, 0.9fr);

        gap: 48px 38px;
    }

    .landing-footer__links-column {
        grid-column: 1 / -1;

        grid-template-columns: repeat(2, minmax(0, 1fr));

        gap: 36px;
    }

    .landing-footer__bottom {
        padding-right: 30px;
        padding-left: 30px;

        grid-template-columns: 1fr;
    }

    .landing-footer__bottom > p,
    .landing-footer__bottom > p:last-child {
        text-align: center;
    }
}


/* =========================================================
   LANDING FOOTER — 900
   ========================================================= */

@media (max-width: 900px) {
    .landing-footer__top {
        padding:
            64px
            24px
            50px;

        grid-template-columns: 1fr;
    }

    .landing-footer__brand-column,
    .landing-footer__contact-column {
        max-width: 760px;
    }

    .landing-footer__links-column {
        grid-column: auto;

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

    .landing-footer__bottom {
        padding-right: 24px;
        padding-left: 24px;
    }
}


/* =========================================================
   LANDING FOOTER — 620
   ========================================================= */

@media (max-width: 620px) {
    .landing-footer__dots {
        display: none;
    }

    .landing-footer__top {
        padding:
            52px
            18px
            38px;

        gap: 40px;
    }

    .landing-footer__logo {
        width: 225px;
    }

    .landing-footer__brand-column h2 {
        margin-top: 28px;

        font-size: clamp(32px, 9vw, 40px);
    }

    .landing-footer__description {
        font-size: 15.5px;
    }

    .landing-footer__badges {
        align-items: stretch;
    }

    .landing-footer__badges span {
        width: 100%;
        justify-content: flex-start;
    }

    .landing-footer__socials {
        grid-template-columns: 1fr;
    }

    .landing-footer__socials > a {
        min-height: 68px;
    }

    .landing-footer__links-column {
        display: none;
    }

    .landing-footer__contact-heading h3 {
        font-size: 31px;
    }

    .landing-footer__contact-card {
        padding: 19px;

        border-radius: 21px;
    }

    .landing-footer__contact-item {
        grid-template-columns:
            46px
            minmax(0, 1fr);

        gap: 13px;
    }

    .landing-footer__contact-icon {
        width: 46px;
        height: 46px;
    }

    .landing-footer__contact-button {
        min-height: 58px;
        padding:
            0
            18px;

        font-size: 13px;
    }

    .landing-footer__bottom {
        padding:
            22px
            18px
            calc(22px + env(safe-area-inset-bottom));

        gap: 17px;
    }

    .landing-footer__legal {
        gap: 9px 0;
    }

    .landing-footer__legal a,
    .landing-footer__legal button {
        padding:
            0
            10px;
    }
}


/* =========================================================
   LANDING FOOTER — 390
   ========================================================= */

@media (max-width: 390px) {
    .landing-footer__top {
        padding-right: 16px;
        padding-left: 16px;
    }

    .landing-footer__logo {
        width: 210px;
    }

    .landing-footer__brand-column h2 {
        font-size: 31px;
    }

    .landing-footer__socials strong {
        font-size: 14px;
    }

    .landing-footer__contact-heading h3 {
        font-size: 29px;
    }

    .landing-footer__contact-item strong {
        font-size: 14px;
    }

    .landing-footer__contact-item span {
        font-size: 12px;
    }

    .landing-footer__bottom {
        padding-right: 16px;
        padding-left: 16px;
    }
}


/* =========================================================
   LANDING FOOTER — REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .landing-footer__socials > a,
    .landing-footer__socials b,
    .landing-footer__link-group a,
    .landing-footer__link-group a b,
    a.landing-footer__contact-item,
    .landing-footer__contact-button,
    .landing-footer__contact-button b {
        transition: none !important;
    }
}
/* =========================================================
   SITE FOOTER
   ========================================================= */

.site-footer {
    position: relative;
    isolation: isolate;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #fffefb 0%,
            #f9f6ee 100%
        );
}

.site-footer::before,
.site-footer::after {
    content: "";

    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(10px);
}

.site-footer::before {
    top: 0;
    left: -14%;

    width: clamp(280px, 32vw, 620px);
    height: clamp(280px, 32vw, 620px);

    background:
        radial-gradient(
            circle,
            rgba(255, 212, 94, 0.18),
            transparent 68%
        );
}

.site-footer::after {
    right: -10%;
    bottom: -16%;

    width: clamp(320px, 36vw, 740px);
    height: clamp(320px, 36vw, 740px);

    background:
        radial-gradient(
            circle,
            rgba(255, 226, 154, 0.2),
            transparent 72%
        );
}

.site-footer__main,
.site-footer__bottom {
    position: relative;
    z-index: 2;

    width: min(100%, 1480px);
    margin: 0 auto;
}

.site-footer__main {
    padding:
        clamp(58px, 5vw, 96px)
        clamp(18px, 4vw, 60px)
        clamp(34px, 2.9vw, 52px);

    display: grid;
    grid-template-columns:
        minmax(280px, 1.2fr)
        minmax(210px, 0.72fr)
        minmax(320px, 1fr);

    gap: clamp(28px, 3vw, 64px);
}

.site-footer__brand-column,
.site-footer__navigation-column,
.site-footer__contact-column {
    min-width: 0;
}

.site-footer__navigation-column,
.site-footer__contact-column {
    padding-left: clamp(14px, 1.8vw, 28px);

    border-left: 1px solid rgba(20, 20, 20, 0.08);
}

.site-footer__brand img {
    width: clamp(250px, 26vw, 410px);
    height: auto;

    object-fit: contain;
}

.site-footer__description {
    width: min(100%, 520px);
    margin:
        clamp(26px, 2vw, 36px)
        0
        0;

    color: #4c4c4c;

    font-size: clamp(18px, 1.45vw, 31px);
    line-height: 1.48;
    letter-spacing: -0.025em;
}

.site-footer__socials {
    width: min(100%, 460px);
    margin-top: clamp(32px, 2.5vw, 44px);

    display: grid;
    gap: 14px;
}

.site-footer__social-card {
    min-height: 78px;
    padding:
        0
        18px;

    display: grid;
    grid-template-columns:
        48px
        minmax(0, 1fr)
        28px;

    align-items: center;
    gap: 14px;

    border: 1px solid rgba(20, 20, 20, 0.08);
    border-radius: 18px;

    background: rgba(255, 255, 255, 0.92);

    box-shadow:
        0 10px 24px rgba(34, 31, 23, 0.045);

    transition:
        transform 0.24s ease,
        box-shadow 0.24s ease,
        border-color 0.24s ease;
}

.site-footer__social-card:hover,
.site-footer__social-card:focus-visible {
    transform: translateY(-2px);

    border-color: rgba(238, 171, 0, 0.22);

    box-shadow:
        0 14px 32px rgba(34, 31, 23, 0.075);

    outline: none;
}

.site-footer__social-card:hover .site-footer__social-icon,
.site-footer__social-card:focus-visible .site-footer__social-icon {
    background: #fff3cf;
}

.site-footer__social-icon,
.site-footer__contact-icon {
    color: #171717;
}

.site-footer__social-icon {
    width: 48px;
    height: 48px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 14px;

    background: #fff8e9;
}

.site-footer__social-icon svg,
.site-footer__contact-icon svg {
    width: 26px;
    height: 26px;

    stroke: currentColor;
    stroke-width: 1.8;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.site-footer__social-copy {
    color: #202020;

    font-size: clamp(18px, 1.25vw, 26px);
    line-height: 1.1;
    font-weight: 650;
}

.site-footer__social-arrow {
    color: #efad00;

    font-size: 28px;
    line-height: 1;
    text-align: center;
}

.site-footer__navigation-column h2,
.site-footer__contact-column h2 {
    margin: 0;

    color: #1e1e1e;

    font-size: clamp(22px, 1.5vw, 34px);
    line-height: 1.05;
    font-weight: 780;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.site-footer__navigation-column h2::after,
.site-footer__contact-column h2::after {
    content: "";

    display: block;

    width: 74px;
    height: 4px;
    margin-top: 18px;

    border-radius: 999px;

    background: linear-gradient(90deg, #efad00, #ffcb54);
}

.site-footer__navigation {
    margin-top: 44px;

    display: grid;
    gap: 28px;
}

.site-footer__navigation a {
    width: fit-content;

    color: #3e3e3e;

    font-size: clamp(18px, 1.35vw, 28px);
    line-height: 1.2;
    font-weight: 520;

    transition:
        color 0.2s ease,
        transform 0.2s ease;
}

.site-footer__navigation a:hover,
.site-footer__navigation a:focus-visible {
    color: #d89600;
    transform: translateX(4px);

    outline: none;
}

.site-footer__contact-card {
    margin-top: 38px;
    padding: clamp(18px, 1.5vw, 26px);

    border: 1px solid rgba(20, 20, 20, 0.08);
    border-radius: 26px;

    background: rgba(255, 255, 255, 0.93);

    box-shadow:
        0 14px 38px rgba(34, 31, 23, 0.055);
}

.site-footer__contact-item {
    min-width: 0;
    min-height: 84px;

    display: grid;
    grid-template-columns:
        56px
        minmax(0, 1fr);

    align-items: center;
    gap: 16px;
}

.site-footer__contact-item + .site-footer__contact-item {
    margin-top: 8px;
    padding-top: 18px;

    border-top: 1px solid rgba(20, 20, 20, 0.075);
}

.site-footer__contact-item--address {
    align-items: start;
}

.site-footer__contact-icon {
    width: 56px;
    height: 56px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 18px;

    background: #fffdf7;
}

.site-footer__contact-item strong,
.site-footer__contact-item span {
    display: block;
}

.site-footer__contact-item strong {
    color: #222222;

    font-size: clamp(18px, 1.35vw, 30px);
    line-height: 1.2;
    font-weight: 690;
    letter-spacing: -0.03em;
}

.site-footer__contact-item span {
    color: #555555;

    font-size: clamp(17px, 1.2vw, 25px);
    line-height: 1.38;
}

.site-footer__contact-item:not(.site-footer__contact-item--address):hover,
.site-footer__contact-item:not(.site-footer__contact-item--address):focus-visible {
    color: #d89600;

    outline: none;
}

.site-footer__contact-item:not(.site-footer__contact-item--address):hover span,
.site-footer__contact-item:not(.site-footer__contact-item--address):focus-visible span {
    color: #d89600;
}

.site-footer__contact-item:not(.site-footer__contact-item--address):hover .site-footer__contact-icon,
.site-footer__contact-item:not(.site-footer__contact-item--address):focus-visible .site-footer__contact-icon {
    color: #d89600;
    background: #fff8e5;
}

.site-footer__bottom {
    padding:
        26px
        clamp(18px, 4vw, 60px)
        calc(26px + env(safe-area-inset-bottom));

    display: grid;
    grid-template-columns:
        minmax(230px, 1fr)
        auto
        minmax(230px, 1fr);

    align-items: center;
    gap: 18px;

    border-top: 1px solid rgba(20, 20, 20, 0.08);
}

.site-footer__bottom > p,
.site-footer__legal-links a,
.site-footer__legal-links button {
    color: #666666;

    font-size: clamp(13px, 0.88vw, 18px);
    line-height: 1.35;
}

.site-footer__bottom > p:last-child {
    text-align: right;
}

.site-footer__legal-links {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;

    gap: 0;
}

.site-footer__legal-links > * {
    position: relative;

    padding:
        0
        18px;
}

.site-footer__legal-links > *:not(:last-child)::after {
    content: "";

    position: absolute;
    top: 50%;
    right: 0;

    width: 1px;
    height: 18px;

    background: rgba(20, 20, 20, 0.12);

    transform: translateY(-50%);
}

.site-footer__legal-links button {
    border: 0;
    background: transparent;
    cursor: pointer;
    font: inherit;
}

.site-footer__legal-links a:hover,
.site-footer__legal-links a:focus-visible,
.site-footer__legal-links button:hover,
.site-footer__legal-links button:focus-visible {
    color: #d89600;

    outline: none;
}


/* =========================================================
   BACK TO TOP
   ========================================================= */

.back-to-top {
    position: fixed;
    right: clamp(16px, 2vw, 28px);
    bottom: calc(16px + env(safe-area-inset-bottom));
    z-index: 2100;

    width: 62px;
    height: 62px;
    padding: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 3px solid #ffffff;
    border-radius: 18px;

    background: linear-gradient(135deg, #ffc72c, #ffb400);
    color: #171717;

    cursor: pointer;

    font-size: 31px;
    line-height: 1;
    font-weight: 760;

    box-shadow:
        0 14px 34px rgba(238, 171, 0, 0.26);

    opacity: 0;
    visibility: hidden;
    transform: translateY(14px);

    transition:
        opacity 0.24s ease,
        visibility 0.24s ease,
        transform 0.24s ease,
        box-shadow 0.24s ease;
}

.back-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.back-to-top:hover,
.back-to-top:focus-visible {
    box-shadow:
        0 18px 42px rgba(238, 171, 0, 0.34);

    outline: none;
}


/* =========================================================
   COOKIE CONSENT
   ========================================================= */

body.cookie-consent-open {
    overflow: hidden;
}

.cookie-consent {
    position: fixed;
    inset: 0;
    z-index: 3000;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 22px;
}

.cookie-consent[hidden] {
    display: none;
}

.cookie-consent__backdrop {
    position: absolute;
    inset: 0;

    border: 0;
    background: rgba(16, 16, 16, 0.44);

    cursor: default;
}

.cookie-consent__dialog {
    position: relative;
    z-index: 1;

    width: min(100%, 760px);
    padding: clamp(24px, 2vw, 36px);

    border: 1px solid rgba(20, 20, 20, 0.08);
    border-radius: 28px;

    background: rgba(255, 255, 255, 0.985);

    box-shadow:
        0 28px 88px rgba(0, 0, 0, 0.16);

    transform: translateY(24px) scale(0.97);

    transition:
        transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
        opacity 0.28s ease;
}

.cookie-consent:not([hidden]) .cookie-consent__dialog {
    transform: translateY(0) scale(1);
}

.cookie-consent__header {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        auto;

    gap: 20px;
}

.cookie-consent__eyebrow {
    display: inline-flex;
    align-items: center;

    min-height: 34px;
    padding: 0 14px;

    border-radius: 999px;

    background: #fff7e2;
    color: #cf9300;

    font-size: 10px;
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.cookie-consent__title {
    margin: 18px 0 0;

    color: #111214;

    font-size: clamp(28px, 2.3vw, 42px);
    line-height: 1.08;
    font-weight: 700;
    letter-spacing: -0.04em;
}

.cookie-consent__header p {
    margin: 16px 0 0;

    color: #666666;

    font-size: clamp(14px, 0.95vw, 18px);
    line-height: 1.58;
}

.cookie-consent__close {
    width: 46px;
    height: 46px;
    padding: 0;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(20, 20, 20, 0.08);
    border-radius: 14px;

    background: #ffffff;
    color: #404040;

    cursor: pointer;

    font-size: 28px;
    line-height: 1;
}

.cookie-consent:not(.is-closable) .cookie-consent__close {
    display: none;
}

.cookie-consent__options {
    margin-top: 24px;

    display: grid;
    gap: 12px;
}

.cookie-consent__option {
    position: relative;

    min-width: 0;
    padding: 18px 18px 18px 86px;

    display: block;

    border: 1px solid rgba(20, 20, 20, 0.08);
    border-radius: 18px;

    background: #ffffff;

    cursor: pointer;

    transition:
        border-color 0.22s ease,
        box-shadow 0.22s ease,
        background 0.22s ease;
}

.cookie-consent__option:hover {
    border-color: rgba(238, 171, 0, 0.18);

    box-shadow:
        0 10px 24px rgba(34, 31, 23, 0.05);
}

.cookie-consent__option input {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;
    pointer-events: none;
}

.cookie-consent__toggle {
    position: absolute;
    top: 50%;
    left: 18px;

    width: 54px;
    height: 32px;

    border-radius: 999px;

    background: #e4e4e4;

    transform: translateY(-50%);

    transition: background 0.22s ease;
}

.cookie-consent__toggle::after {
    content: "";

    position: absolute;
    top: 4px;
    left: 4px;

    width: 24px;
    height: 24px;

    border-radius: 50%;

    background: #ffffff;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);

    transition: transform 0.22s ease;
}

.cookie-consent__option input:checked + .cookie-consent__toggle {
    background: #efad00;
}

.cookie-consent__option input:checked + .cookie-consent__toggle::after {
    transform: translateX(22px);
}

.cookie-consent__option--locked {
    background: #fffdf7;
    cursor: default;
}

.cookie-consent__option--locked .cookie-consent__toggle {
    background: #efad00;
}

.cookie-consent__option--locked .cookie-consent__toggle::after {
    transform: translateX(22px);
}

.cookie-consent__copy strong,
.cookie-consent__copy small {
    display: block;
}

.cookie-consent__copy strong {
    color: #202020;

    font-size: clamp(16px, 1.1vw, 20px);
    line-height: 1.2;
    font-weight: 690;
}

.cookie-consent__copy small {
    margin-top: 6px;

    color: #707070;

    font-size: clamp(12px, 0.78vw, 15px);
    line-height: 1.45;
}

.cookie-consent__footer {
    margin-top: 24px;
}

.cookie-consent__footer > p {
    margin: 0;

    color: #666666;

    font-size: 13px;
    line-height: 1.5;
}

.cookie-consent__footer > p a {
    color: #d79500;

    font-weight: 680;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.cookie-consent__actions {
    margin-top: 18px;

    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;

    gap: 10px;
}

.cookie-consent__button {
    min-height: 52px;
    padding: 0 18px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 14px;

    font: inherit;
    font-size: 14px;
    font-weight: 680;

    cursor: pointer;
}

.cookie-consent__button--ghost {
    border: 1px solid rgba(20, 20, 20, 0.1);
    background: #ffffff;
    color: #333333;
}

.cookie-consent__button--secondary {
    border: 1px solid rgba(238, 171, 0, 0.18);
    background: #fff8e5;
    color: #a06f00;
}

.cookie-consent__button--primary {
    border: 0;
    background: linear-gradient(135deg, #ffd15a, #ffb400);
    color: #171717;

    box-shadow:
        0 12px 28px rgba(238, 171, 0, 0.22);
}


/* =========================================================
   LEGAL PAGES
   ========================================================= */

body.legal-page {
    min-height: 100svh;

    background:
        linear-gradient(
            180deg,
            #f7f5ef 0%,
            #fffefa 10%,
            #ffffff 88%,
            #f7f5ef 100%
        );
}

body.legal-page::before,
body.legal-page::after {
    content: "";

    position: fixed;
    z-index: -1;

    border-radius: 50%;
    filter: blur(20px);
    pointer-events: none;
}

body.legal-page::before {
    top: 40px;
    left: -180px;

    width: clamp(320px, 36vw, 720px);
    height: clamp(320px, 36vw, 720px);

    background:
        radial-gradient(
            circle,
            rgba(255, 217, 117, 0.2),
            transparent 70%
        );
}

body.legal-page::after {
    top: -120px;
    right: -150px;

    width: clamp(360px, 40vw, 780px);
    height: clamp(360px, 40vw, 780px);

    background:
        radial-gradient(
            circle,
            rgba(208, 235, 226, 0.34),
            transparent 72%
        );
}

.legal-topbar {
    position: sticky;
    top: 18px;
    z-index: 120;

    padding:
        18px
        clamp(18px, 2vw, 34px)
        0;
}

.legal-topbar__inner {
    position: relative;

    width: 100%;
    min-height: 80px;
    margin: 0;
    padding:
        12px
        clamp(18px, 1.8vw, 28px)
        12px
        clamp(20px, 2vw, 30px);

    display: grid;
    grid-template-columns:
        auto
        minmax(0, 1fr)
        auto;

    align-items: center;
    gap: clamp(18px, 1.5vw, 28px);

    border: 1px solid rgba(20, 20, 20, 0.06);
    border-radius: 24px;

    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);

    box-shadow:
        0 14px 36px rgba(34, 31, 23, 0.06);
}

.legal-topbar__brand img {
    width: clamp(188px, 18vw, 250px);
    height: auto;
}

.legal-topbar__nav {
    width: 100%;

    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;

    gap: clamp(8px, 0.7vw, 14px);
}

.legal-topbar__nav a {
    min-height: 42px;
    padding:
        0
        clamp(13px, 0.95vw, 20px);

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 999px;

    color: #555555;

    font-size: 13px;
    line-height: 1;
    font-weight: 670;
    white-space: nowrap;

    transition:
        background 0.2s ease,
        color 0.2s ease;
}

.legal-topbar__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.legal-topbar__nav a[aria-current="page"] {
    background: #edf7f3;
    color: #0f7f62;
}

.legal-topbar__nav a:hover,
.legal-topbar__nav a:focus-visible {
    color: #d89600;

    outline: none;
}

.legal-topbar__cta {
    min-height: 48px;
    padding:
        0
        20px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 14px;

    background: linear-gradient(135deg, #ffd15a, #ffb400);
    color: #171717;

    font-size: 13px;
    line-height: 1;
    font-weight: 700;
    white-space: nowrap;

    box-shadow:
        0 12px 28px rgba(238, 171, 0, 0.2);
}

.legal-topbar__toggle {
    flex: 0 0 auto;
}

.legal-main {
    padding:
        34px
        clamp(18px, 2vw, 34px)
        0;
}

.legal-hero,
.legal-document {
    width: 100%;
    margin: 0;
}

.legal-hero {
    padding-top: clamp(32px, 2.8vw, 46px);
}

.legal-hero__eyebrow {
    display: inline-flex;
    align-items: center;

    min-height: 34px;
    padding: 0 14px;

    border-radius: 999px;

    background: rgba(227, 244, 238, 0.9);
    color: #5aa18d;

    font-size: 10px;
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.legal-hero__grid {
    margin-top: 18px;

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(280px, 340px);

    gap: clamp(22px, 2vw, 34px);
}

.legal-hero__copy h1 {
    margin: 0;

    color: #111214;

    font-size: clamp(46px, 4.6vw, 78px);
    line-height: 0.98;
    font-weight: 700;
    letter-spacing: -0.055em;
}

.legal-hero__copy p {
    width: min(100%, 720px);
    margin: 20px 0 0;

    color: #6a6a6a;

    font-size: clamp(15px, 1vw, 20px);
    line-height: 1.58;
}

.legal-summary {
    padding: 22px;

    border: 1px solid rgba(20, 20, 20, 0.06);
    border-radius: 22px;

    background: rgba(255, 255, 255, 0.92);
    box-shadow:
        0 14px 36px rgba(34, 31, 23, 0.055);
}

.legal-summary__eyebrow {
    color: #8fb8aa;

    font-size: 10px;
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.legal-summary h2 {
    margin: 14px 0 0;

    color: #222222;

    font-size: 30px;
    line-height: 1.08;
    font-weight: 700;
    letter-spacing: -0.04em;
}

.legal-summary p {
    margin: 10px 0 0;

    color: #707070;

    font-size: 13px;
    line-height: 1.45;
}

.legal-summary dl {
    margin: 20px 0 0;

    display: grid;
    grid-template-columns:
        minmax(90px, 1fr)
        minmax(0, 1fr);

    gap: 12px 10px;
}

.legal-summary dt {
    color: #8a8a8a;

    font-size: 11px;
    line-height: 1.3;
    font-weight: 700;
    text-transform: uppercase;
}

.legal-summary dd {
    margin: 0;

    color: #343434;

    font-size: 12px;
    line-height: 1.4;
    font-weight: 600;
}

.legal-document {
    margin-top: 30px;
    padding-bottom: 60px;
}

.legal-document__topbar {
    min-height: 54px;
    padding:
        0
        clamp(18px, 1.5vw, 28px);

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    border: 1px solid rgba(20, 20, 20, 0.06);
    border-radius: 18px 18px 0 0;

    background: rgba(255, 255, 255, 0.9);
}

.legal-document__topbar span,
.legal-document__topbar a {
    color: #737373;

    font-size: 12px;
    line-height: 1.35;
    font-weight: 600;
}

.legal-document__topbar a {
    color: #d89600;
}

.legal-document__frame {
    padding: clamp(24px, 2vw, 40px);

    border: 1px solid rgba(20, 20, 20, 0.06);
    border-top: 0;
    border-radius: 0 0 28px 28px;

    background: rgba(255, 255, 255, 0.96);
}

.legal-document__panel {
    padding: clamp(18px, 1.6vw, 28px);

    border: clamp(12px, 0.95vw, 16px) solid #e7f4ef;
    border-radius: 26px;

    background: #fcfcfa;
}

.legal-document__panel--embed {
    padding: clamp(10px, 0.9vw, 18px);

    overflow: hidden;

    background: #ffffff;
}

.legal-document__panel--embed .itrk-legaltext {
    min-height: clamp(520px, 72vh, 1500px);
    padding: clamp(8px, 0.85vw, 16px);
    box-sizing: border-box;

    background: #ffffff;
}

.legal-document__panel--embed iframe {
    width: 100%;
    min-height: clamp(520px, 72vh, 1500px);

    display: block;

    border: 0;
    background: #ffffff;
}

.legal-document__article {
    padding: clamp(26px, 2.2vw, 42px);

    border-radius: 22px;

    background: #ffffff;
}

.legal-document__article > :first-child {
    margin-top: 0;
}

.legal-document__article > :last-child {
    margin-bottom: 0;
}

.legal-document__article h2 {
    margin: 0 0 18px;

    color: #17181a;

    font-size: clamp(30px, 2vw, 44px);
    line-height: 1.08;
    font-weight: 680;
    letter-spacing: -0.04em;
}

.legal-document__article h3 {
    margin: 30px 0 12px;

    color: #202020;

    font-size: clamp(20px, 1.25vw, 28px);
    line-height: 1.2;
    font-weight: 680;
    letter-spacing: -0.03em;
}

.legal-document__article p,
.legal-document__article li {
    color: #3f3f3f;

    font-size: clamp(15px, 0.96vw, 18px);
    line-height: 1.72;
}

.legal-document__article p {
    margin: 0 0 16px;
}

.legal-document__article ol,
.legal-document__article ul {
    margin: 0 0 18px;
    padding-left: 24px;
}

.legal-document__article li + li {
    margin-top: 8px;
}

.legal-document__article strong {
    color: #191919;
    font-weight: 700;
}

.legal-document__article a {
    color: #d89600;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.legal-document__placeholder {
    min-height: clamp(520px, 62vh, 860px);
    padding:
        clamp(28px, 2.4vw, 42px);

    display: flex;
    flex-direction: column;
    justify-content: center;

    border: 1px dashed rgba(92, 149, 133, 0.32);
    border-radius: 22px;

    background:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.82) 0%,
            rgba(247, 250, 248, 0.96) 100%
        );
}

.legal-document__badge {
    width: fit-content;
    min-height: 34px;
    padding: 0 12px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 999px;

    background: #edf7f3;
    color: #5f9f8d;

    font-size: 10px;
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.legal-document__placeholder h2 {
    margin: 18px 0 0;

    color: #232323;

    font-size: clamp(30px, 2.5vw, 46px);
    line-height: 1.04;
    font-weight: 720;
    letter-spacing: -0.04em;
}

.legal-document__placeholder p {
    width: min(100%, 720px);
    margin: 16px 0 0;

    color: #636363;

    font-size: clamp(15px, 1vw, 18px);
    line-height: 1.58;
}

.legal-document__meta {
    margin-top: 26px;

    display: flex;
    flex-wrap: wrap;

    gap: 10px;
}

.legal-document__meta span {
    min-height: 38px;
    padding:
        0
        14px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(20, 20, 20, 0.08);
    border-radius: 12px;

    background: rgba(255, 255, 255, 0.95);
    color: #4b4b4b;

    font-size: 12px;
    line-height: 1;
    font-weight: 650;
}

.success-hero__actions {
    margin-top: 28px;

    display: flex;
    flex-wrap: wrap;

    gap: 14px;
}

.success-hero__button,
.success-actions__link {
    min-height: 56px;
    padding:
        0
        24px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 16px;

    font-size: 15px;
    line-height: 1;
    font-weight: 700;
    text-align: center;
    text-decoration: none;

    transition:
        transform var(--transition),
        box-shadow var(--transition),
        border-color var(--transition),
        color var(--transition);
}

.success-hero__button--primary,
.success-actions__link--primary {
    border: 0;

    background:
        linear-gradient(
            135deg,
            #ffd45b 0%,
            #ffb400 100%
        );
    color: #1f1f1f;
    box-shadow:
        0 18px 38px rgba(255, 180, 0, 0.24);
}

.success-hero__button--secondary,
.success-actions__link--secondary {
    border: 1px solid rgba(20, 20, 20, 0.09);

    background: rgba(255, 255, 255, 0.92);
    color: #252525;
}

.success-actions__link--ghost {
    border: 1px solid rgba(98, 149, 133, 0.18);

    background: rgba(237, 247, 243, 0.92);
    color: #276d5c;
}

.success-steps {
    margin-top: 28px;

    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 18px;
}

.success-step {
    min-height: 100%;
    padding: 24px;

    border: 1px solid rgba(20, 20, 20, 0.06);
    border-radius: 20px;

    background:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.98) 0%,
            rgba(249, 250, 248, 0.98) 100%
        );
}

.success-step__number {
    width: fit-content;
    min-height: 34px;
    padding:
        0
        12px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 999px;

    background: #edf7f3;
    color: #5f9f8d;

    font-size: 11px;
    line-height: 1;
    font-weight: 760;
    letter-spacing: 0.14em;
}

.success-step h3 {
    margin: 18px 0 10px;

    font-size: clamp(20px, 1.15vw, 26px);
}

.success-step p {
    margin: 0;
}

.success-note {
    margin-top: 24px;
    padding: 18px 20px;

    border-radius: 18px;

    background: rgba(255, 248, 229, 0.95);
    color: #51463a;
}

.success-note strong {
    color: #191919;
}

.success-actions {
    margin-top: 28px;

    display: flex;
    flex-wrap: wrap;

    gap: 14px;
}

.success-hero__button:hover,
.success-hero__button:focus-visible,
.success-actions__link:hover,
.success-actions__link:focus-visible {
    transform: translateY(-2px);
}


/* =========================================================
   SITE UI ? 1180
   ========================================================= */

@media (max-width: 1180px) {
    .site-footer__main {
        grid-template-columns: 1fr;
    }

    .site-footer__navigation-column,
    .site-footer__contact-column {
        padding-left: 0;
        border-left: 0;
    }

    .site-footer__navigation {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px 24px;
    }

    .site-footer__bottom {
        grid-template-columns: 1fr;
    }

    .site-footer__bottom > p,
    .site-footer__bottom > p:last-child {
        text-align: center;
    }

    .legal-topbar__inner {
        grid-template-columns: 1fr auto;
        align-items: center;
    }

    .legal-topbar__nav {
        position: absolute;
        top: calc(100% + 10px);
        right: 0;
        left: 0;
        z-index: 10;

        padding: 14px;

        display: grid;
        gap: 0;

        border: 1px solid rgba(20, 20, 20, 0.08);
        border-radius: 20px;

        background: #ffffff;

        box-shadow:
            0 24px 65px rgba(18, 18, 18, 0.16);

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        transform:
            translateY(-15px)
            scale(0.98);

        transition:
            opacity var(--transition),
            visibility var(--transition),
            transform var(--transition);
    }

    .legal-topbar__nav.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;

        transform:
            translateY(0)
            scale(1);
    }

    .legal-topbar__nav a {
        min-height: 48px;
        padding: 16px 14px;

        justify-content: flex-start;

        border-bottom: 1px solid rgba(20, 20, 20, 0.07);
        border-radius: 0;

        font-size: 15px;
        white-space: normal;
    }

    .legal-topbar__nav a:last-child {
        border-bottom: 0;
    }

    .legal-topbar__actions {
        justify-content: flex-end;
    }

    .legal-topbar__cta {
        display: none;
    }

    .legal-hero__grid {
        grid-template-columns: 1fr;
    }

    .success-steps {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   SITE UI ? 900
   ========================================================= */

@media (max-width: 900px) {
    .site-footer__main {
        padding-right: 24px;
        padding-left: 24px;
    }

    .site-footer__description {
        font-size: 18px;
    }

    .site-footer__navigation {
        grid-template-columns: 1fr;
    }

    .cookie-consent {
        align-items: flex-end;

        padding: 12px;
    }

    .cookie-consent__dialog {
        width: 100%;
        border-radius: 24px;
    }
}


/* =========================================================
   SITE UI ? 620
   ========================================================= */

@media (max-width: 620px) {
    .site-footer__main {
        padding:
            42px
            18px
            26px;
    }

    .site-footer__brand img {
        width: 230px;
    }

    .site-footer__description {
        font-size: 16px;
    }

    .site-footer__social-card {
        min-height: 70px;
        padding-right: 16px;
        padding-left: 16px;

        grid-template-columns:
            42px
            minmax(0, 1fr)
            22px;
    }

    .site-footer__social-icon {
        width: 42px;
        height: 42px;
    }

    .site-footer__social-icon svg,
    .site-footer__contact-icon svg {
        width: 22px;
        height: 22px;
    }

    .site-footer__social-copy {
        font-size: 16px;
    }

    .site-footer__navigation-column h2,
    .site-footer__contact-column h2 {
        font-size: 18px;
    }

    .site-footer__navigation {
        margin-top: 28px;
        gap: 16px;
    }

    .site-footer__navigation a {
        font-size: 16px;
    }

    .site-footer__contact-card {
        margin-top: 24px;
        padding: 16px;

        border-radius: 20px;
    }

    .site-footer__contact-item {
        min-height: 72px;
        grid-template-columns:
            46px
            minmax(0, 1fr);
    }

    .site-footer__contact-icon {
        width: 46px;
        height: 46px;
    }

    .site-footer__contact-item strong {
        font-size: 18px;
    }

    .site-footer__contact-item span {
        font-size: 15px;
    }

    .site-footer__bottom {
        padding-right: 18px;
        padding-left: 18px;
    }

    .site-footer__legal-links {
        gap: 8px 0;
    }

    .site-footer__legal-links > * {
        padding-right: 12px;
        padding-left: 12px;
    }

    .back-to-top {
        width: 58px;
        height: 58px;

        font-size: 28px;
    }

    .cookie-consent__option {
        padding: 16px 16px 16px 78px;
    }

    .cookie-consent__actions {
        flex-direction: column;
    }

    .cookie-consent__button {
        width: 100%;
    }

    .legal-topbar {
        top: 10px;
        padding-right: 12px;
        padding-left: 12px;
    }

    .legal-main {
        padding-right: 12px;
        padding-left: 12px;
    }

    .legal-topbar__inner {
        min-height: 0;
        padding: 14px;

        border-radius: 20px;
    }

    .legal-topbar__brand img {
        width: 190px;
    }

    .legal-topbar__nav a {
        min-height: 46px;
        padding: 14px 12px;

        font-size: 14px;
    }

    .legal-document__frame {
        padding: 18px;
    }

    .legal-document__panel {
        padding: 18px;
    }

    .legal-document__panel--embed {
        padding: 8px;
    }

    .legal-document__article {
        padding: 22px 18px;
    }

    .legal-hero__copy h1 {
        font-size: 38px;
    }

    .legal-summary {
        padding: 18px;
    }

    .legal-summary h2 {
        font-size: 24px;
    }

    .legal-summary dl {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .legal-document {
        margin-top: 22px;
        padding-bottom: 42px;
    }

    .legal-document__topbar {
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;

        min-height: 70px;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .legal-document__frame {
        padding: 12px;
    }

    .legal-document__panel {
        border-width: 8px;
        border-radius: 22px;
    }

    .legal-document__placeholder {
        min-height: 420px;
        padding: 22px 18px;

        border-radius: 18px;
    }

    .legal-document__placeholder h2 {
        font-size: 28px;
    }

    .success-hero__actions,
    .success-actions {
        flex-direction: column;
    }

    .success-hero__button,
    .success-actions__link {
        width: 100%;
    }
}


/* =========================================================
   SITE UI ? 390
   ========================================================= */

@media (max-width: 390px) {
    .site-footer__main,
    .site-footer__bottom {
        padding-right: 16px;
        padding-left: 16px;
    }

    .site-footer__social-card {
        grid-template-columns:
            40px
            minmax(0, 1fr)
            18px;
    }

    .site-footer__social-copy,
    .site-footer__contact-item span {
        font-size: 14px;
    }

    .site-footer__contact-item strong {
        font-size: 17px;
    }

    .cookie-consent {
        padding: 8px;
    }

    .cookie-consent__dialog {
        padding: 18px 16px;
    }

    .cookie-consent__title {
        font-size: 24px;
    }

    .legal-topbar__brand img {
        width: 170px;
    }

    .legal-hero__copy h1 {
        font-size: 34px;
    }

    .legal-document__placeholder h2 {
        font-size: 25px;
    }
}


/* =========================================================
   SITE UI ? REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .site-footer__social-card,
    .site-footer__navigation a,
    .back-to-top,
    .cookie-consent__dialog,
    .cookie-consent__option,
    .cookie-consent__toggle,
    .cookie-consent__toggle::after,
    .legal-topbar__nav a,
    .legal-topbar__cta {
        animation: none !important;
        transition: none !important;
    }
}

/* =========================================================
   REDUCED MOTION
   ========================================================= */

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

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

    .hero.hero--js [data-hero-reveal] {
        opacity: 1;
        transform: none;
    }

    .hero__main-image {
        animation: none;
    }
}

@media (min-width: 1181px) {
    .home-page .site-header__inner {
        grid-template-columns:
            minmax(250px, 0.95fr)
            minmax(520px, 1.65fr)
            minmax(148px, auto);
    }

    .home-page .site-header__project {
        display: none;
    }
}