@font-face {
            font-family: 'Cormorant Garamond';
            src: url('../fonts/cormorant-garamond-normal.woff2?v=20260728-1') format('woff2');
            font-style: normal;
            font-weight: 300 600;
            font-display: swap;
        }

        @font-face {
            font-family: 'Cormorant Garamond';
            src: url('../fonts/cormorant-garamond-italic.woff2?v=20260728-1') format('woff2');
            font-style: italic;
            font-weight: 300 400;
            font-display: swap;
        }

        @font-face {
            font-family: 'Montserrat';
            src: url('../fonts/montserrat.woff2?v=20260728-1') format('woff2');
            font-style: normal;
            font-weight: 300 600;
            font-display: swap;
        }

        @font-face {
            font-family: 'Italianno';
            src: url('../fonts/italianno.woff2?v=20260728-1') format('woff2');
            font-style: normal;
            font-weight: 400;
            font-display: swap;
        }

        :root {
            --parchment: #f0ebb3;
            --sage: #c7d0aa;
            --olive: #3f4a30;
            --earth: #83521a;
            --gold: #b17a20;
            --soft-cream: #fff9d9;
            --shadow: rgba(54, 42, 18, 0.22);
        }

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

        .boot-screen {
            position: fixed;
            inset: 0;
            z-index: 200;
            display: grid;
            place-items: center;
            background:
                radial-gradient(circle at 50% 38%, rgba(255, 249, 217, 0.98), transparent 22rem),
                linear-gradient(145deg, #f0ebb3, #c7d0aa);
            color: var(--earth);
            opacity: 1;
            visibility: visible;
            transition: opacity 0.36s ease, visibility 0.36s ease;
        }

        .boot-screen-inner {
            width: min(230px, 70vw);
            text-align: center;
        }

        .boot-screen-mark {
            display: block;
            font-family: 'Amoresa', 'Italianno', cursive;
            font-size: clamp(2rem, 2.6vw, 3.1rem);
            font-style: normal;
            line-height: 1;
            letter-spacing: normal;
        }

        .boot-screen-line {
            display: block;
            width: 100%;
            height: 2px;
            margin-top: 20px;
            overflow: hidden;
            border-radius: 999px;
            background: rgba(131, 82, 26, 0.14);
        }

        .boot-screen-line::after {
            content: '';
            display: block;
            width: 46%;
            height: 100%;
            border-radius: inherit;
            background: var(--earth);
            animation: bootProgress 1.05s ease-in-out infinite alternate;
        }

        html.is-ready .boot-screen {
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
        }

        html:not(.is-booting):not(.is-ready) .boot-screen {
            display: none;
        }

        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        html {
            min-width: 320px;
            scroll-behavior: smooth;
        }

        body {
            min-height: 100vh;
            background:
                radial-gradient(circle at 50% -10%, rgba(255, 249, 217, 0.86), transparent 38rem),
                linear-gradient(180deg, var(--parchment) 0%, #e8df9a 42%, var(--sage) 100%);
            color: var(--olive);
            font-family: 'Cormorant Garamond', serif;
            overflow-x: hidden;
            position: relative;
        }

        body::before {
            content: '';
            position: fixed;
            inset: 0;
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.035'/%3E%3C/svg%3E");
            pointer-events: none;
            z-index: 1;
        }

        button {
            font: inherit;
        }

        .skip-link {
            position: fixed;
            top: 10px;
            left: 10px;
            z-index: 210;
            padding: 12px 16px;
            border-radius: 8px;
            background: var(--olive);
            color: var(--soft-cream);
            font-family: 'Montserrat', sans-serif;
            font-size: 0.82rem;
            font-weight: 600;
            text-decoration: none;
            transform: translateY(-160%);
            transition: transform 0.18s ease;
        }

        .skip-link:focus {
            transform: translateY(0);
            outline: 3px solid var(--soft-cream);
            outline-offset: 2px;
        }

        :where(a, button, input, textarea, select, [tabindex]):focus-visible {
            outline: 3px solid rgba(131, 82, 26, 0.82);
            outline-offset: 3px;
        }

        .site-header {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            z-index: 20;
            padding: 18px clamp(18px, 4vw, 64px);
            color: rgba(255, 249, 232, 0.96);
            background: rgba(18, 76, 91, 0.42);
            border-bottom: 1px solid rgba(255, 249, 217, 0.12);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            transition: color 0.35s ease, background 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease, padding 0.35s ease;
        }

        .site-header.is-solid {
            padding-top: 12px;
            padding-bottom: 12px;
            color: var(--earth);
            background: rgba(240, 235, 179, 0.88);
            border-color: rgba(131, 82, 26, 0.16);
            box-shadow: 0 14px 34px rgba(54, 42, 18, 0.08);
            backdrop-filter: blur(16px);
            -webkit-backdrop-filter: blur(16px);
        }

        .site-nav {
            width: min(100%, 1280px);
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr auto 1fr;
            align-items: center;
            gap: clamp(18px, 4vw, 56px);
        }

        .nav-toggle {
            display: none;
        }

        .nav-group {
            display: flex;
            align-items: center;
            gap: clamp(18px, 2.45vw, 34px);
        }

        .nav-group.right {
            justify-content: flex-end;
        }

        .nav-link {
            position: relative;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            font-family: 'Montserrat', sans-serif;
            font-size: clamp(0.72rem, 0.72vw, 0.84rem);
            font-weight: 500;
            letter-spacing: clamp(1.7px, 0.16vw, 2.4px);
            text-transform: uppercase;
            text-decoration: none;
            color: currentColor;
            white-space: nowrap;
            transition: color 0.2s ease;
        }

        .nav-brush {
            width: 0;
            height: 18px;
            color: currentColor;
            opacity: 0;
            transform: translateX(-5px) rotate(-12deg);
            transition: width 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
            flex: 0 0 auto;
        }

        .nav-link.is-active .nav-brush {
            width: 18px;
            opacity: 1;
            transform: translateX(0) rotate(-12deg);
        }

        .nav-link::after {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            bottom: -8px;
            height: 1px;
            background: rgba(255, 249, 232, 0.92);
            transform: scaleX(0);
            transform-origin: center;
            transition: transform 0.22s ease;
        }

        .site-header.is-solid .nav-link::after,
        .site-header.is-open .nav-link::after {
            background: currentColor;
        }

        .nav-link:hover,
        .nav-link:focus-visible {
            color: currentColor;
            outline: none;
        }

        .nav-link:hover::after,
        .nav-link:focus-visible::after,
        .nav-link.is-active::after {
            transform: scaleX(1);
        }

        .nav-brand {
            font-family: 'Amoresa', 'Italianno', cursive;
            font-size: clamp(2rem, 2.6vw, 3.1rem);
            line-height: 1;
            color: currentColor;
            text-decoration: none;
            white-space: nowrap;
            opacity: 0;
            visibility: hidden;
            transform: translateY(-6px);
            transition: opacity 0.28s ease, visibility 0.28s ease, transform 0.28s ease;
            pointer-events: none;
        }

        .nav-brand-signature {
            display: none;
        }

        .site-header.is-solid .nav-brand {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
            pointer-events: auto;
        }

        .nav-cta {
            --cta-rgb: 18, 76, 91;
            position: relative;
            isolation: isolate;
            overflow: hidden;
            min-height: 42px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            padding: 12px 22px 11px;
            border: 1px solid rgba(255, 249, 217, 0.4);
            border-radius: 999px;
            color: var(--soft-cream);
            background: rgba(var(--cta-rgb), 0.58);
            box-shadow: 0 10px 24px rgba(var(--cta-rgb), 0.2);
            transition: color 0.22s ease, background 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease;
        }

        .site-header .nav-group .nav-link.nav-cta::after {
            content: '';
            display: block;
            position: absolute;
            top: 0;
            right: auto;
            bottom: auto;
            left: -70%;
            z-index: 0;
            width: 55%;
            height: 100%;
            border-radius: inherit;
            pointer-events: none;
            background: linear-gradient(90deg, transparent, rgba(255, 249, 217, 0.22), transparent);
            transform: none;
            transform-origin: center;
            animation: navCtaShimmer 3s ease-in-out infinite;
            animation-delay: 1s;
        }

        .nav-cta span {
            position: relative;
            z-index: 1;
        }

        .site-header.is-solid .nav-cta {
            --cta-rgb: 214, 167, 47;
            display: inline-flex;
            flex: 0 0 auto;
            visibility: visible;
            opacity: 1;
            color: #3f3520;
            background: rgba(var(--cta-rgb), 0.88);
            border-color: rgba(131, 82, 26, 0.34);
            box-shadow: 0 12px 28px rgba(var(--cta-rgb), 0.25);
        }

        body.is-order-mode .site-header .nav-link.nav-cta {
            display: none;
        }

        .nav-cta:hover,
        .nav-cta:focus-visible {
            color: var(--soft-cream);
            background: rgba(var(--cta-rgb), 0.98);
            border-color: rgba(255, 249, 217, 0.72);
            box-shadow: 0 15px 34px rgba(var(--cta-rgb), 0.34);
            transform: translateY(-2px);
        }

        .nav-cta:focus-visible {
            outline: 3px solid rgba(255, 249, 217, 0.9);
            outline-offset: 3px;
        }

        .site-header.is-solid .nav-cta:hover,
        .site-header.is-solid .nav-cta:focus-visible {
            color: #332914;
            border-color: rgba(131, 82, 26, 0.54);
            box-shadow: 0 16px 36px rgba(var(--cta-rgb), 0.38);
        }

        .site-header.is-solid .nav-cta:focus-visible {
            outline-color: rgba(131, 82, 26, 0.82);
        }

        .site-header.is-mobile-nav {
            padding: 0;
            color: var(--earth);
            background: transparent;
            border-bottom: 0;
            box-shadow: none;
            backdrop-filter: none;
            pointer-events: none;
        }

        .site-header.is-mobile-nav.is-solid {
            padding: 0;
            background: transparent;
            border-color: transparent;
            box-shadow: none;
            backdrop-filter: none;
        }

        .site-header.is-mobile-nav.is-open {
            color: var(--earth);
            background: transparent;
            border-color: transparent;
            box-shadow: none;
            backdrop-filter: none;
            pointer-events: auto;
        }

        .site-header.is-mobile-nav .site-nav {
            position: fixed;
            top: 14px;
            left: 14px;
            right: 14px;
            width: auto;
            margin: 0;
            grid-template-columns: 1fr auto;
            column-gap: 12px;
            row-gap: 0;
            align-items: start;
            pointer-events: none;
            border-radius: 22px;
            transition: background 0.28s ease, box-shadow 0.28s ease, padding 0.28s ease, border-color 0.28s ease;
        }

        .site-header.is-mobile-nav.is-open .site-nav {
            padding: 72px 16px 18px;
            background:
                radial-gradient(circle at 92% 0%, rgba(190, 143, 32, 0.18), transparent 34%),
                linear-gradient(180deg, rgba(255, 249, 217, 0.97), rgba(239, 232, 177, 0.96));
            border: 1px solid rgba(131, 82, 26, 0.18);
            box-shadow: 0 24px 58px rgba(20, 49, 53, 0.24);
            backdrop-filter: blur(18px);
            -webkit-backdrop-filter: blur(18px);
            pointer-events: auto;
        }

        .site-header.is-mobile-nav .nav-brand,
        .site-header.is-mobile-nav.is-solid .nav-brand {
            display: none;
        }

        .site-header.is-mobile-nav .nav-toggle {
            grid-column: 2;
            justify-self: end;
            position: fixed !important;
            top: 14px !important;
            right: 14px !important;
            z-index: 999;
            pointer-events: auto;
            width: 54px;
            height: 48px;
            border: 1px solid rgba(190, 143, 32, 0.54);
            border-radius: 999px;
            background: rgba(13, 43, 50, 0.78);
            display: inline-flex !important;
            visibility: visible;
            opacity: 1;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            gap: 6px;
            box-shadow: 0 16px 34px rgba(13, 43, 50, 0.3);
            backdrop-filter: blur(14px);
            -webkit-backdrop-filter: blur(14px);
            cursor: pointer;
            -webkit-tap-highlight-color: transparent;
            transition: background 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease;
        }

        .site-header.is-mobile-nav.is-open .nav-toggle {
            border-color: rgba(131, 82, 26, 0.26);
            background: rgba(255, 249, 217, 0.96);
            box-shadow: 0 12px 26px rgba(54, 42, 18, 0.13);
            transform: translateY(1px);
        }

        .site-header.is-mobile-nav .nav-toggle span {
            width: 22px;
            height: 2px;
            border-radius: 999px;
            background: #d6a72f;
            box-shadow: 0 0 12px rgba(214, 167, 47, 0.34);
            transition: transform 0.24s ease, opacity 0.2s ease, width 0.22s ease, background 0.22s ease;
        }

        .site-header.is-mobile-nav .nav-toggle span:nth-child(2) {
            width: 15px;
        }

        .site-header.is-mobile-nav.is-open .nav-toggle span {
            background: var(--earth);
            box-shadow: none;
            width: 22px;
        }

        .site-header.is-mobile-nav.is-open .nav-toggle span:nth-child(1) {
            transform: translateY(6px) rotate(42deg);
        }

        .site-header.is-mobile-nav.is-open .nav-toggle span:nth-child(2) {
            opacity: 0;
        }

        .site-header.is-mobile-nav.is-open .nav-toggle span:nth-child(3) {
            transform: translateY(-6px) rotate(-42deg);
        }

        .site-header.is-mobile-nav .nav-group {
            grid-column: 1 / -1;
            width: 100%;
            display: none;
            flex-direction: column;
            align-items: stretch;
            justify-content: flex-start;
            gap: 6px;
            padding: 0;
            flex-wrap: nowrap;
        }

        .site-header.is-mobile-nav.is-open .nav-group {
            display: flex;
        }

        .site-header.is-mobile-nav .nav-group.right {
            justify-content: flex-start;
        }

        .site-header.is-mobile-nav .nav-link {
            width: 100%;
            min-height: 50px;
            justify-content: flex-start;
            padding: 14px 15px;
            border-top: 0;
            border-radius: 14px;
            font-size: 0.76rem;
            letter-spacing: 1.9px;
            background: rgba(255, 249, 217, 0.3);
            transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
        }

        .site-header.is-mobile-nav .nav-link:hover,
        .site-header.is-mobile-nav .nav-link:focus-visible,
        .site-header.is-mobile-nav .nav-link.is-active {
            background: rgba(255, 249, 217, 0.82);
            box-shadow: inset 0 0 0 1px rgba(131, 82, 26, 0.08);
            transform: translateX(2px);
        }

        .site-header.is-mobile-nav .nav-link::after {
            left: 14px;
            right: 14px;
            bottom: 8px;
            background: rgba(131, 82, 26, 0.42);
        }

        .site-header.is-mobile-nav .nav-cta {
            --cta-rgb: 18, 76, 91;
            min-height: 44px;
            margin-top: 10px;
            padding: 12px 18px 11px;
            justify-content: center;
            background: rgba(var(--cta-rgb), 0.86);
            color: var(--soft-cream);
            border-color: rgba(255, 249, 217, 0.42);
            box-shadow: 0 14px 30px rgba(var(--cta-rgb), 0.24);
        }

        .page {
            position: relative;
            z-index: 2;
        }

        .hero {
            --hero-bg: url('../hero-desktop.webp?v=20260728-1');
            min-height: 100vh;
            min-height: 100svh;
            display: flex;
            align-items: flex-end;
            justify-content: center;
            padding: clamp(58px, 8vw, 108px) 20px clamp(54px, 8vw, 92px);
            text-align: center;
            position: relative;
            overflow: hidden;
            background-image:
                linear-gradient(180deg, rgba(16, 53, 60, 0.1) 0%, rgba(17, 55, 60, 0.08) 56%, rgba(12, 38, 43, 0.28) 100%),
                var(--hero-bg);
            background-position: center;
            background-size: cover;
            background-repeat: no-repeat;
        }

        .container {
            width: min(100%, 920px);
            position: relative;
            z-index: 2;
        }

        .subtitle-top {
            font-size: clamp(1.35rem, 4.8vw, 2.2rem);
            font-weight: 300;
            font-style: italic;
            color: var(--earth);
            letter-spacing: clamp(1px, 0.45vw, 2px);
            margin-bottom: clamp(8px, 1.4vw, 14px);
            opacity: 0;
            animation: fadeInDown 1.1s ease forwards;
        }

        .name-wrapper {
            display: flex;
            align-items: center;
            justify-content: center;
            margin: clamp(14px, 3vw, 22px) 0 clamp(24px, 4vw, 34px);
            opacity: 0;
            animation: fadeInUp 1.1s ease 0.2s forwards;
        }

        .name {
            font-family: 'Amoresa', 'Italianno', cursive;
            font-size: clamp(4.2rem, 16vw, 8rem);
            color: var(--earth);
            line-height: 0.92;
            text-shadow: 1px 1px 2px rgba(131, 82, 26, 0.08);
            transition: transform 0.3s ease, text-shadow 0.3s ease;
            cursor: default;
        }

        .name:hover {
            transform: scale(1.02);
            text-shadow: 2px 2px 4px rgba(131, 82, 26, 0.12);
        }

        .divider {
            width: min(26vw, 96px);
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(131, 82, 26, 0.45), transparent);
            margin: clamp(32px, 7vw, 54px) auto;
            opacity: 0;
            animation: fadeIn 1.1s ease 0.55s forwards;
        }

        .bottom-section {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: clamp(18px, 5vw, 50px);
            width: min(100%, 560px);
            margin: 0 auto;
            opacity: 1;
            color: var(--soft-cream);
            text-shadow: 0 2px 14px rgba(13, 43, 50, 0.42);
        }

        .bottom-text {
            font-family: 'Montserrat', sans-serif;
            font-size: clamp(0.64rem, 2.2vw, 0.76rem);
            font-weight: 500;
            letter-spacing: clamp(1.2px, 0.58vw, 3px);
            text-transform: uppercase;
            color: rgba(255, 249, 217, 0.94);
            line-height: 1.75;
            text-align: center;
            flex: 0 1 168px;
            min-width: 0;
        }

        .logo-container {
            width: clamp(38px, 8vw, 52px);
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .logo-symbol {
            font-family: 'Amoresa', 'Italianno', cursive;
            font-size: clamp(2.4rem, 7vw, 3.2rem);
            color: var(--soft-cream);
            line-height: 1;
            text-shadow: 0 2px 14px rgba(13, 43, 50, 0.42);
        }

        .gallery-section {
            min-height: 100vh;
            min-height: 100svh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: clamp(78px, 7vw, 96px) 16px clamp(22px, 4vw, 42px);
            scroll-margin-top: 90px;
        }

        .gallery-inner {
            width: min(100%, 980px);
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            justify-items: center;
            gap: clamp(18px, 4vw, 34px);
        }

        .gallery-heading {
            max-width: 620px;
            text-align: center;
            font-family: 'Amoresa', 'Italianno', cursive;
            font-size: clamp(3rem, 5.8vw, 5rem);
            font-weight: 300;
            font-style: normal;
            line-height: 1;
            color: rgba(131, 82, 26, 0.78);
            margin: 0 auto clamp(14px, 2vw, 24px);
            transform: rotate(4deg);
            transform-origin: center;
        }

        .gallery-stage {
            width: min(100%, 1040px);
            display: grid;
            place-items: center;
            position: relative;
        }

        .frame-carousel {
            width: min(80vw, 420px);
            aspect-ratio: 1122 / 1402;
            position: relative;
            isolation: isolate;
            z-index: 4;
            touch-action: pan-y;
        }

        .frame-carousel:focus-visible {
            outline: 3px solid rgba(190, 143, 32, 0.78);
            outline-offset: 7px;
            border-radius: 46% 46% 42% 42%;
        }

        .paint-preview {
            position: absolute;
            top: 58%;
            z-index: 2;
            width: clamp(150px, 13.5vw, 230px);
            aspect-ratio: 1 / 1;
            border: 0;
            padding: 0;
            background: transparent;
            cursor: pointer;
            opacity: 0.72;
            transform-origin: center;
            transition: opacity 0.25s ease, transform 0.25s ease, filter 0.25s ease;
            -webkit-tap-highlight-color: transparent;
            border-radius: 50%;
            overflow: hidden;
        }

        .paint-preview.prev {
            right: calc(50% + min(17vw, 205px));
            transform: translateY(-50%);
        }

        .paint-preview.next {
            left: calc(50% + min(17vw, 205px));
            transform: translateY(-50%);
        }

        .paint-preview:hover,
        .paint-preview:focus-visible {
            opacity: 0.92;
            outline: none;
        }

        .paint-preview.prev:hover,
        .paint-preview.prev:focus-visible {
            transform: translateY(-50%) scale(1.03);
        }

        .paint-preview.next:hover,
        .paint-preview.next:focus-visible {
            transform: translateY(-50%) scale(1.03);
        }

        .paint-preview:focus-visible,
        .carousel-control:focus-visible {
            outline: 3px solid rgba(190, 143, 32, 0.86);
            outline-offset: 4px;
        }

        .paint-preview.prev:active,
        .paint-preview.next:active {
            transform: translateY(-50%) scale(0.97);
        }

        .paint-preview img {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
            object-position: center;
        }

        .portrait-window {
            position: absolute;
            top: 17.15%;
            right: 21.85%;
            bottom: 14.65%;
            left: 21.85%;
            border-radius: 50%;
            overflow: hidden;
            background: rgba(255, 249, 217, 0.72);
            box-shadow: inset 0 0 22px rgba(56, 38, 14, 0.22);
            contain: paint;
            z-index: 1;
        }

        .carousel-track {
            height: 100%;
            display: flex;
        }

        .carousel-slide {
            position: relative;
            min-width: 100%;
            height: 100%;
            overflow: hidden;
        }

        .carousel-image.is-active {
            z-index: 1;
            opacity: 1;
        }

        .carousel-image.is-incoming {
            z-index: 2;
            opacity: 0;
            transition: opacity 0.28s ease;
        }

        .carousel-slide.is-resetting .carousel-image.is-incoming {
            transition: none;
        }

        .carousel-slide.is-crossfading .carousel-image.is-incoming {
            opacity: 1;
        }

        .carousel-slide img {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
            object-position: center;
        }

        .frame-image {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: contain;
            filter: drop-shadow(0 24px 34px rgba(58, 43, 18, 0.28));
            pointer-events: none;
            z-index: 2;
        }

        .carousel-control {
            position: absolute;
            top: 50%;
            z-index: 3;
            width: clamp(42px, 10vw, 48px);
            height: clamp(42px, 10vw, 48px);
            border: 1px solid rgba(255, 249, 217, 0.58);
            border-radius: 50%;
            background: rgba(63, 74, 48, 0.72);
            color: var(--soft-cream);
            display: grid;
            place-items: center;
            cursor: pointer;
            transform: translateY(-50%);
            box-shadow: 0 12px 24px rgba(40, 30, 12, 0.22);
            transition: background 0.2s ease, transform 0.2s ease;
            -webkit-tap-highlight-color: transparent;
        }

        .carousel-control:hover,
        .carousel-control:focus-visible {
            background: rgba(63, 74, 48, 0.92);
            transform: translateY(-50%) scale(1.04);
        }

        .carousel-control:active {
            transform: translateY(-50%) scale(0.96);
        }

        .carousel-control svg {
            width: 20px;
            height: 20px;
            stroke: currentColor;
            stroke-width: 2.4;
            fill: none;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .carousel-control.prev {
            left: -10px;
        }

        .carousel-control.next {
            right: -10px;
        }

        .carousel-dots {
            position: relative;
            z-index: 6;
            display: flex;
            justify-content: center;
            gap: 0;
            margin-top: clamp(16px, 3vw, 22px);
        }

        .carousel-dot {
            position: relative;
            width: 28px;
            height: 44px;
            border: 0;
            background: transparent;
            cursor: pointer;
            padding: 0;
            -webkit-tap-highlight-color: transparent;
        }

        .carousel-dot::before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 10px;
            height: 10px;
            border: 1px solid rgba(63, 74, 48, 0.58);
            border-radius: 50%;
            background: transparent;
            transform: translate(-50%, -50%);
            transition: background 0.2s ease, transform 0.2s ease;
        }

        .carousel-dot[aria-current="true"]::before {
            background: var(--olive);
            transform: translate(-50%, -50%) scale(1.18);
        }

        .carousel-dot:focus-visible {
            border-radius: 999px;
        }

        .carousel-dot:active::before {
            transform: translate(-50%, -50%) scale(0.88);
        }

        .booking-section {
            min-height: 70vh;
            min-height: 70svh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: clamp(42px, 6vw, 76px) 18px clamp(92px, 11vw, 142px);
            scroll-margin-top: 92px;
            position: relative;
            overflow: hidden;
        }

        .booking-section::before {
            content: '';
            position: absolute;
            inset: auto 8% 12% auto;
            width: clamp(120px, 16vw, 220px);
            height: clamp(70px, 9vw, 120px);
            border-bottom: 1px solid rgba(63, 74, 48, 0.26);
            border-right: 1px solid rgba(63, 74, 48, 0.16);
            transform: rotate(-18deg);
            opacity: 0.52;
            pointer-events: none;
        }

        .booking-inner {
            width: min(100%, 980px);
            margin: 0 auto;
            text-align: center;
            color: var(--olive);
            position: relative;
            z-index: 2;
        }

        .booking-kicker {
            font-family: 'Amoresa', 'Italianno', cursive;
            display: inline-block;
            font-size: clamp(3rem, 5.8vw, 5rem);
            line-height: 1;
            color: rgba(131, 82, 26, 0.78);
            margin-bottom: clamp(18px, 2.4vw, 28px);
            transform: rotate(-4deg);
            transform-origin: center;
        }

        .booking-title {
            max-width: 880px;
            margin: 0 auto;
            font-size: clamp(2.45rem, 6vw, 5.35rem);
            font-weight: 300;
            line-height: 0.98;
            letter-spacing: 0;
            text-transform: uppercase;
            color: var(--olive);
        }

        .booking-action {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            margin-top: clamp(38px, 5vw, 58px);
            padding-bottom: 5px;
            font-family: 'Montserrat', sans-serif;
            font-size: clamp(0.72rem, 0.85vw, 0.9rem);
            font-weight: 500;
            letter-spacing: clamp(2px, 0.24vw, 3.2px);
            text-transform: uppercase;
            text-decoration: none;
            color: rgba(131, 82, 26, 0.9);
            border-bottom: 1px solid rgba(131, 82, 26, 0.42);
            transition: color 0.22s ease, border-color 0.22s ease, transform 0.22s ease;
        }

        .booking-action:hover,
        .booking-action:focus-visible {
            color: var(--olive);
            border-color: var(--olive);
            transform: translateY(-2px);
            outline: none;
        }

        .booking-quote {
            position: relative;
            overflow: hidden;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 48px;
            margin-top: clamp(34px, 4vw, 46px);
            padding: 15px 30px 14px;
            border: 1px solid rgba(131, 82, 26, 0.54);
            border-radius: 999px;
            background: rgba(131, 82, 26, 0.92);
            color: var(--soft-cream);
            box-shadow: 0 16px 34px rgba(54, 42, 18, 0.18);
            font-family: 'Montserrat', sans-serif;
            font-size: clamp(0.76rem, 0.86vw, 0.92rem);
            font-weight: 600;
            letter-spacing: clamp(1.4px, 0.16vw, 2.2px);
            text-transform: uppercase;
            text-decoration: none;
            cursor: pointer;
            -webkit-tap-highlight-color: transparent;
            transition: transform 0.22s ease, box-shadow 0.22s ease, background 0.22s ease, color 0.22s ease, border-color 0.22s ease;
        }

        .booking-quote::before {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(115deg, transparent 0%, rgba(255, 249, 217, 0.38) 46%, transparent 70%);
            transform: translateX(-120%);
            transition: transform 0.5s ease;
        }

        .booking-quote:hover,
        .booking-quote:focus-visible {
            background: rgba(255, 249, 217, 0.9);
            color: var(--earth);
            border-color: rgba(131, 82, 26, 0.72);
            box-shadow: 0 18px 38px rgba(54, 42, 18, 0.18);
            transform: translateY(-3px);
            outline: none;
        }

        .booking-quote:hover::before,
        .booking-quote:focus-visible::before {
            transform: translateX(120%);
        }

        .booking-quote:active {
            transform: translateY(0) scale(0.98);
            box-shadow: 0 10px 24px rgba(54, 42, 18, 0.16);
        }

        .site-footer {
            position: relative;
            overflow: hidden;
            padding: clamp(74px, 9vw, 118px) 18px clamp(42px, 6vw, 68px);
            background:
                radial-gradient(circle at 50% 0%, rgba(255, 249, 217, 0.5), transparent 34rem),
                linear-gradient(180deg, rgba(199, 208, 170, 0.62), rgba(240, 235, 179, 0.96));
            color: var(--olive);
            text-align: center;
            border-top: 1px solid rgba(131, 82, 26, 0.14);
        }

        .site-footer::before {
            content: '';
            position: absolute;
            left: 50%;
            top: 34px;
            width: min(260px, 56vw);
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(131, 82, 26, 0.38), transparent);
            transform: translateX(-50%);
        }

        .footer-inner {
            width: min(100%, 920px);
            margin: 0 auto;
            position: relative;
            z-index: 2;
        }

        .footer-quote {
            max-width: 820px;
            margin: 0 auto clamp(34px, 4vw, 52px);
            font-size: clamp(1.55rem, 3.5vw, 3.2rem);
            font-weight: 300;
            font-style: italic;
            line-height: 1.16;
            color: var(--olive);
        }

        .footer-source {
            display: block;
            margin-top: clamp(14px, 2vw, 20px);
            font-family: 'Montserrat', sans-serif;
            font-size: clamp(0.64rem, 0.8vw, 0.78rem);
            font-weight: 500;
            letter-spacing: clamp(1.6px, 0.22vw, 2.8px);
            text-transform: uppercase;
            color: rgba(131, 82, 26, 0.8);
        }

        .footer-contact {
            display: grid;
            gap: 10px;
            justify-items: center;
            margin-bottom: clamp(24px, 3vw, 36px);
            font-family: 'Montserrat', sans-serif;
            font-size: clamp(0.78rem, 0.95vw, 0.96rem);
            letter-spacing: 1.2px;
        }

        .footer-contact a {
            position: relative;
            display: inline-flex;
            align-items: center;
            padding: 4px 3px 10px;
            color: rgba(63, 74, 48, 0.92);
            text-decoration: none;
            transform-origin: center;
            transition: color 0.2s ease, transform 0.2s ease;
        }

        .footer-contact a::after {
            content: '';
            position: absolute;
            left: 2px;
            right: 2px;
            bottom: 0;
            height: 9px;
            border-radius: 60% 45% 58% 42% / 72% 64% 50% 58%;
            background: linear-gradient(90deg, #b98217 0%, #d6a72f 52%, #e4c65c 100%);
            box-shadow: 0 4px 10px rgba(190, 143, 32, 0.16);
            clip-path: polygon(0 38%, 8% 23%, 19% 34%, 34% 16%, 51% 29%, 68% 11%, 84% 26%, 100% 18%, 99% 76%, 82% 70%, 64% 88%, 45% 69%, 27% 91%, 9% 71%, 0 81%);
            opacity: 0;
            transform: scaleX(0);
            transform-origin: left center;
        }

        .footer-contact a::before {
            content: '';
            position: absolute;
            left: 10px;
            right: 16px;
            bottom: 5px;
            z-index: 1;
            height: 2px;
            border-radius: 999px;
            background: linear-gradient(90deg, transparent, rgba(255, 249, 217, 0.46), transparent);
            opacity: 0;
            transform: scaleX(0);
            transform-origin: left center;
        }

        .footer-contact-brush {
            position: absolute;
            left: -15px;
            bottom: -7px;
            z-index: 2;
            width: 23px;
            height: 23px;
            color: #9c6a13;
            opacity: 0;
            filter: drop-shadow(0 3px 5px rgba(54, 42, 18, 0.18));
            transform: translateY(-5px) rotate(38deg);
            transform-origin: 44% 92%;
            pointer-events: none;
        }

        .footer-contact a:hover,
        .footer-contact a:focus-visible {
            color: var(--earth);
            transform: translateY(-1px);
            outline: none;
        }

        .footer-social {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            border: 1px solid rgba(131, 82, 26, 0.38);
            border-radius: 50%;
            color: var(--earth);
            background: rgba(255, 249, 217, 0.36);
            box-shadow: 0 12px 26px rgba(54, 42, 18, 0.1);
            transition: transform 0.22s ease, background 0.22s ease, color 0.22s ease, box-shadow 0.22s ease;
        }

        .footer-social svg {
            width: 20px;
            height: 20px;
        }

        .footer-social:hover,
        .footer-social:focus-visible {
            background: var(--earth);
            color: var(--soft-cream);
            box-shadow: 0 16px 34px rgba(54, 42, 18, 0.18);
            transform: translateY(-3px);
            outline: none;
        }

        .order-section,
        .portfolio-section,
        .about-section,
        .contact-section {
            display: none;
            min-height: 100vh;
            min-height: 100svh;
            padding: clamp(96px, 10vw, 132px) 18px clamp(58px, 8vw, 92px);
            position: relative;
            overflow: hidden;
        }

        body.is-order-mode,
        body.is-portfolio-mode,
        body.is-about-mode,
        body.is-contact-mode,
        body.is-coming-soon-mode {
            overflow-x: hidden;
        }

        body.is-order-mode .page > section:not(.order-section),
        body.is-portfolio-mode .page > section:not(.portfolio-section),
        body.is-about-mode .page > section:not(.about-section),
        body.is-contact-mode .page > section:not(.contact-section),
        body.is-coming-soon-mode .page > section:not(.coming-soon-section) {
            display: none;
        }

        body.is-order-mode .order-section {
            display: block;
            animation: fadeInUp 0.55s ease both;
        }

        body.is-portfolio-mode .portfolio-section {
            display: block;
            animation: fadeInUp 0.55s ease both;
        }

        body.is-about-mode .about-section {
            display: block;
            animation: fadeInUp 0.55s ease both;
        }

        body.is-contact-mode .contact-section {
            display: block;
            animation: fadeInUp 0.55s ease both;
        }

        body.is-coming-soon-mode .coming-soon-section {
            display: grid;
            animation: fadeInUp 0.55s ease both;
        }

        body.is-order-mode .site-header,
        body.is-portfolio-mode .site-header,
        body.is-about-mode .site-header,
        body.is-contact-mode .site-header,
        body.is-coming-soon-mode .site-header {
            color: var(--earth);
            background: rgba(240, 235, 179, 0.9);
            border-color: rgba(131, 82, 26, 0.16);
            box-shadow: 0 14px 34px rgba(54, 42, 18, 0.08);
            backdrop-filter: blur(16px);
        }

        body.is-order-mode .site-header .nav-link::after,
        body.is-portfolio-mode .site-header .nav-link::after,
        body.is-about-mode .site-header .nav-link::after,
        body.is-contact-mode .site-header .nav-link::after,
        body.is-coming-soon-mode .site-header .nav-link::after {
            background: currentColor;
        }

        body.is-view-loading {
            overflow: hidden;
            cursor: wait;
        }

        body.is-view-loading .page,
        body.is-view-loading .site-footer {
            filter: blur(7px) saturate(0.82);
            transform: scale(0.995);
            transition: filter 0.2s ease, transform 0.2s ease;
            pointer-events: none;
        }

        body.is-view-loading .site-header {
            filter: blur(2px);
            transition: filter 0.2s ease;
            pointer-events: none;
        }

        .page-loader {
            position: fixed;
            inset: 0;
            z-index: 1200;
            display: grid;
            place-items: center;
            padding: clamp(16px, 4vw, 32px);
            background:
                radial-gradient(circle at 50% 46%, rgba(255, 249, 217, 0.58), transparent 18rem),
                rgba(18, 76, 91, 0.3);
            backdrop-filter: blur(9px);
            -webkit-backdrop-filter: blur(9px);
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.18s ease, visibility 0.18s ease;
        }

        body.is-view-loading .page-loader {
            opacity: 1;
            visibility: visible;
            pointer-events: auto;
        }

        .brush-loader {
            width: min(330px, calc(100vw - 32px));
            padding: clamp(22px, 5vw, 30px) clamp(20px, 6vw, 34px) 24px;
            border: 1px solid rgba(255, 249, 217, 0.62);
            border-radius: 20px;
            background: rgba(255, 249, 217, 0.9);
            box-shadow: 0 26px 68px rgba(20, 49, 53, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.72);
            text-align: center;
            color: var(--earth);
            transform: translateY(8px) scale(0.98);
            transition: transform 0.2s ease;
        }

        body.is-view-loading .brush-loader {
            transform: translateY(0) scale(1);
        }

        .brush-loader-stage {
            position: relative;
            width: min(210px, 68vw);
            height: 64px;
            margin: 0 auto 12px;
        }

        .brush-loader-stroke {
            position: absolute;
            left: 8px;
            right: 8px;
            bottom: 12px;
            height: 12px;
            border-radius: 60% 45% 58% 42% / 72% 64% 50% 58%;
            background: linear-gradient(90deg, #b98217 0%, #d6a72f 52%, #e4c65c 100%);
            box-shadow: 0 5px 14px rgba(190, 143, 32, 0.2);
            transform-origin: left;
            transform: scaleX(0);
            opacity: 0;
        }

        .brush-loader-stroke::after {
            content: '';
            position: absolute;
            right: -1px;
            top: 3px;
            width: 24%;
            height: 3px;
            border-radius: inherit;
            background: rgba(255, 249, 217, 0.42);
            transform: rotate(-2deg);
        }

        .brush-loader-icon {
            position: absolute;
            left: 2px;
            bottom: 21px;
            width: 38px;
            height: 38px;
            color: #9c6a13;
            transform: rotate(-18deg);
            opacity: 0;
            filter: drop-shadow(0 8px 10px rgba(54, 42, 18, 0.2));
        }

        body.is-view-loading .brush-loader-stroke {
            animation: loaderStroke 0.78s cubic-bezier(0.55, 0, 0.2, 1) infinite;
        }

        body.is-view-loading .brush-loader-icon {
            animation: loaderBrush 0.78s cubic-bezier(0.55, 0, 0.2, 1) infinite;
        }

        .brush-loader-text {
            font-family: 'Montserrat', sans-serif;
            font-size: clamp(0.66rem, 2.5vw, 0.74rem);
            font-weight: 600;
            line-height: 1.5;
            letter-spacing: clamp(1.4px, 0.4vw, 2px);
            text-transform: uppercase;
            color: rgba(63, 74, 48, 0.82);
        }

        .order-section::before,
        .portfolio-section::before,
        .about-section::before,
        .contact-section::before {
            content: '';
            position: absolute;
            inset: 0;
            background:
                radial-gradient(circle at 18% 8%, rgba(255, 249, 217, 0.72), transparent 26rem),
                radial-gradient(circle at 88% 22%, rgba(199, 208, 170, 0.42), transparent 24rem);
            pointer-events: none;
        }

        .order-inner,
        .portfolio-inner,
        .about-inner,
        .contact-inner {
            width: min(100%, 980px);
            margin: 0 auto;
            position: relative;
            z-index: 2;
        }

        .order-back,
        .portfolio-back,
        .about-back,
        .contact-back {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            border: 0;
            background: transparent;
            color: var(--earth);
            font-family: 'Montserrat', sans-serif;
            font-size: 0.72rem;
            font-weight: 600;
            letter-spacing: 1.7px;
            text-transform: uppercase;
            cursor: pointer;
            margin-bottom: clamp(24px, 4vw, 38px);
        }

        .order-back::before,
        .portfolio-back::before,
        .about-back::before,
        .contact-back::before {
            content: '<';
            font-size: 1rem;
            line-height: 1;
        }

        .order-back:hover,
        .order-back:focus-visible,
        .portfolio-back:hover,
        .portfolio-back:focus-visible,
        .about-back:hover,
        .about-back:focus-visible,
        .contact-back:hover,
        .contact-back:focus-visible {
            color: var(--olive);
            outline: none;
        }

        .contact-section {
            background:
                radial-gradient(circle at 24% 28%, rgba(255, 250, 221, 0.96), transparent 25rem),
                radial-gradient(circle at 86% 70%, rgba(199, 208, 170, 0.58), transparent 31rem),
                linear-gradient(155deg, #f5efbe 0%, #eae49e 52%, #cbd3ac 100%);
        }

        .contact-section::after {
            content: '';
            position: absolute;
            inset: auto auto 6% 8%;
            width: clamp(180px, 28vw, 410px);
            aspect-ratio: 1;
            border-radius: 50%;
            background: rgba(255, 249, 217, 0.17);
            filter: blur(2px);
            pointer-events: none;
        }

        .contact-inner {
            width: min(100%, 1120px);
        }

        .contact-layout {
            display: grid;
            grid-template-columns: minmax(0, 1.03fr) minmax(340px, 0.77fr);
            align-items: center;
            gap: clamp(46px, 7vw, 96px);
        }

        .contact-intro {
            text-align: center;
        }

        .contact-phone {
            width: min(100%, 430px);
            margin: clamp(-32px, -2vw, -12px) auto -12px;
            filter: drop-shadow(0 24px 22px rgba(54, 42, 18, 0.13));
        }

        .contact-phone img {
            display: block;
            width: 100%;
            height: auto;
        }

        body.is-contact-mode .contact-phone img {
            transform-origin: 50% 76%;
            animation: contactPhoneRing 7s ease-in-out 1.2s infinite;
        }

        @keyframes contactPhoneRing {
            0%,
            12%,
            100% {
                transform: translateX(0) rotate(0);
            }

            1.5% {
                transform: translateX(-3px) rotate(-1.8deg);
            }

            3% {
                transform: translateX(3px) rotate(1.8deg);
            }

            4.5% {
                transform: translateX(-4px) rotate(-2.2deg);
            }

            6% {
                transform: translateX(4px) rotate(2.2deg);
            }

            7.5% {
                transform: translateX(-3px) rotate(-1.5deg);
            }

            9% {
                transform: translateX(3px) rotate(1.5deg);
            }

            10.5% {
                transform: translateX(-1px) rotate(-0.6deg);
            }
        }

        .contact-kicker {
            display: inline-block;
            margin: 0 0 8px;
            color: rgba(131, 82, 26, 0.82);
            font-family: 'Amoresa', 'Italianno', cursive;
            font-size: clamp(3.4rem, 6vw, 5.65rem);
            font-weight: 400;
            line-height: 0.92;
            transform: rotate(-3deg);
        }

        .contact-title {
            margin: 0;
            color: var(--olive);
            font-size: clamp(3rem, 5.5vw, 5.2rem);
            font-weight: 300;
            line-height: 0.9;
            letter-spacing: -0.025em;
            text-transform: uppercase;
        }

        .contact-copy {
            width: min(100%, 500px);
            margin: clamp(24px, 3vw, 34px) auto 0;
            color: rgba(63, 74, 48, 0.86);
            font-size: clamp(1.08rem, 1.45vw, 1.28rem);
            line-height: 1.65;
        }

        .contact-cards {
            display: grid;
            gap: 16px;
        }

        .contact-card {
            min-height: 166px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 28px 24px;
            border: 1px solid rgba(131, 82, 26, 0.14);
            border-radius: 28px;
            background: rgba(255, 249, 217, 0.68);
            box-shadow:
                0 20px 42px rgba(54, 42, 18, 0.08),
                inset 0 1px 0 rgba(255, 255, 255, 0.6);
            color: var(--earth);
            text-align: center;
            text-decoration: none;
            transition: transform 0.24s ease, background 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease;
        }

        .contact-card:hover,
        .contact-card:focus-visible {
            border-color: rgba(131, 82, 26, 0.3);
            background: rgba(255, 249, 217, 0.9);
            box-shadow:
                0 25px 52px rgba(54, 42, 18, 0.13),
                inset 0 1px 0 rgba(255, 255, 255, 0.78);
            transform: translateY(-4px);
            outline: none;
        }

        .contact-card-icon {
            width: 42px;
            height: 42px;
            display: grid;
            place-items: center;
            margin-bottom: 10px;
            font-family: Georgia, serif;
            font-size: 2rem;
            font-weight: 400;
            line-height: 1;
        }

        .contact-card-instagram svg {
            width: 32px;
            height: 32px;
        }

        .contact-card-label {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.72rem;
            font-weight: 600;
            letter-spacing: 2.1px;
            line-height: 1.4;
            text-transform: uppercase;
        }

        .contact-card-value {
            margin-top: 10px;
            color: rgba(63, 74, 48, 0.88);
            font-family: 'Montserrat', sans-serif;
            font-size: clamp(0.76rem, 1.05vw, 0.9rem);
            font-weight: 400;
            line-height: 1.55;
            overflow-wrap: anywhere;
        }

        .order-header,
        .portfolio-header,
        .about-header {
            text-align: center;
            margin-bottom: clamp(34px, 5vw, 54px);
        }

        .order-kicker,
        .portfolio-kicker,
        .about-kicker {
            display: inline-block;
            font-family: 'Amoresa', 'Italianno', cursive;
            font-size: clamp(3rem, 6vw, 5.2rem);
            line-height: 1;
            color: rgba(131, 82, 26, 0.78);
            transform: rotate(-4deg);
            margin-bottom: 12px;
        }

        .order-title,
        .portfolio-title,
        .about-title {
            max-width: 760px;
            margin: 0 auto;
            font-size: clamp(2.25rem, 5vw, 4.7rem);
            font-weight: 300;
            line-height: 1;
            text-transform: uppercase;
            color: var(--olive);
        }

        .about-inner {
            width: min(100%, 1200px);
        }

        .about-header {
            margin-bottom: clamp(42px, 6vw, 70px);
        }

        .about-layout {
            display: grid;
            grid-template-columns: minmax(250px, 330px) minmax(0, 680px);
            align-items: stretch;
            justify-content: center;
            gap: clamp(42px, 6vw, 82px);
        }

        .about-aside {
            width: 100%;
            max-width: 330px;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .about-portrait {
            width: 100%;
            flex: 0 0 auto;
            margin: 0;
            aspect-ratio: 1 / 1;
            padding: 4px;
            border: 1px solid rgba(131, 82, 26, 0.16);
            border-radius: 50%;
            background: rgba(255, 249, 217, 0.46);
            box-shadow: 0 14px 30px rgba(54, 42, 18, 0.11);
            overflow: hidden;
        }

        .about-portrait img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: 50% 24%;
            border-radius: 50%;
        }

        .about-botanical {
            width: min(84%, 270px);
            min-height: 560px;
            flex: 1 1 auto;
            display: flex;
            align-items: stretch;
            justify-content: center;
            margin: clamp(32px, 4vw, 48px) auto 0;
            overflow: hidden;
        }

        .about-botanical img {
            display: block;
            width: auto;
            max-width: 100%;
            height: 100%;
            object-fit: contain;
            object-position: top center;
        }

        .about-copy {
            width: 100%;
            max-width: 680px;
            padding: 8px 0 0;
            border: 0;
            border-radius: 0;
            background: transparent;
            box-shadow: none;
            color: rgba(63, 74, 48, 0.94);
            font-size: clamp(1.08rem, 1.42vw, 1.24rem);
            line-height: 1.75;
        }

        .about-copy p {
            margin: 0;
        }

        .about-copy p + p {
            margin-top: clamp(20px, 2.5vw, 30px);
        }

        .about-copy p:first-child {
            color: var(--olive);
            font-size: 1.1em;
            line-height: 1.65;
        }

        .about-copy p:first-child::first-letter {
            float: left;
            margin: 0.08em 0.1em 0 0;
            color: rgba(131, 82, 26, 0.82);
            font-family: 'Cormorant Garamond', serif;
            font-size: 3.75em;
            font-weight: 300;
            line-height: 0.72;
        }

        .about-copy em,
        .about-copy cite {
            color: var(--earth);
        }

        .about-signature {
            margin-top: clamp(30px, 4vw, 44px) !important;
            padding-top: 22px;
            border-top: 1px solid rgba(131, 82, 26, 0.18);
            text-align: right;
        }

        .about-signature strong {
            display: block;
            margin-top: 5px;
            color: rgba(131, 82, 26, 0.82);
            font-family: 'Amoresa', 'Italianno', cursive;
            font-size: clamp(2rem, 3.5vw, 3rem);
            font-weight: 400;
            line-height: 1;
        }

        .portfolio-filters {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 10px;
            margin: 0 auto clamp(26px, 4vw, 42px);
            width: min(100%, 940px);
        }

        .portfolio-filter {
            min-height: 44px;
            border: 1px solid rgba(131, 82, 26, 0.32);
            border-radius: 999px;
            padding: 12px 17px 11px;
            background: rgba(255, 249, 217, 0.42);
            color: var(--earth);
            font-family: 'Montserrat', sans-serif;
            font-size: 0.72rem;
            font-weight: 700;
            letter-spacing: 1.3px;
            text-transform: uppercase;
            cursor: pointer;
            transition: background 0.22s ease, color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
        }

        .portfolio-filter:hover,
        .portfolio-filter:focus-visible,
        .portfolio-filter.is-active {
            background: rgba(131, 82, 26, 0.92);
            color: var(--soft-cream);
            box-shadow: 0 14px 28px rgba(54, 42, 18, 0.14);
            transform: translateY(-2px);
            outline: none;
        }

        .portfolio-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: clamp(12px, 2vw, 20px);
        }

        .portfolio-status {
            display: none;
            margin: 0 auto clamp(18px, 3vw, 28px);
            padding: 16px 18px;
            width: min(100%, 640px);
            border: 1px solid rgba(131, 82, 26, 0.18);
            border-radius: 8px;
            background: rgba(255, 249, 217, 0.54);
            color: rgba(63, 74, 48, 0.82);
            text-align: center;
            font-family: 'Montserrat', sans-serif;
            font-size: 0.82rem;
            line-height: 1.6;
        }

        .portfolio-status.is-visible {
            display: block;
        }

        .coming-soon-section {
            display: none;
            min-height: 100vh;
            min-height: 100svh;
            place-items: stretch;
            padding: 0;
            background: transparent;
            overflow: hidden;
        }

        .coming-soon-media {
            width: 100%;
            min-height: 100vh;
            min-height: 100svh;
            display: grid;
            place-items: center;
            overflow: hidden;
            padding: clamp(74px, 9vw, 112px) clamp(18px, 5vw, 70px) clamp(42px, 7vw, 82px);
            background: transparent;
        }

        .coming-soon-media img,
        .coming-soon-media video {
            width: min(84vw, 860px);
            max-height: min(78vh, 700px);
            max-height: min(78svh, 700px);
            height: auto;
            display: block;
            object-fit: contain;
            object-position: center;
        }

        .coming-soon-media img,
        .coming-soon-media video {
            padding: 0;
            background: var(--olive);
            filter: drop-shadow(0 24px 30px rgba(23, 30, 18, 0.2));
        }

        .portfolio-card {
            position: relative;
            aspect-ratio: 1 / 1;
            overflow: hidden;
            border: 1px solid rgba(131, 82, 26, 0.16);
            border-radius: 8px;
            background: rgba(255, 249, 217, 0.42);
            box-shadow: 0 18px 34px rgba(54, 42, 18, 0.11);
            animation: portfolioReveal 0.42s ease both;
            cursor: zoom-in;
        }

        .portfolio-card.is-hidden {
            display: none;
        }

        .portfolio-card img,
        .portfolio-card video {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
            object-position: center;
            transition: transform 0.45s ease, filter 0.45s ease;
        }

        .portfolio-card video {
            background: rgba(63, 74, 48, 0.16);
            pointer-events: none;
        }

        .portfolio-card[data-media="video"]::before {
            content: 'Vídeo';
            position: absolute;
            top: 12px;
            right: 12px;
            z-index: 2;
            padding: 7px 9px;
            border-radius: 999px;
            background: rgba(255, 249, 217, 0.84);
            color: var(--earth);
            font-family: 'Montserrat', sans-serif;
            font-size: 0.62rem;
            font-weight: 800;
            letter-spacing: 1px;
            text-transform: uppercase;
        }

        .portfolio-card:hover img,
        .portfolio-card:focus-within img,
        .portfolio-card:hover video,
        .portfolio-card:focus-within video {
            transform: scale(1.045);
            filter: saturate(1.04) contrast(1.03);
        }

        .portfolio-lightbox {
            position: fixed;
            inset: 0;
            z-index: 120;
            display: grid;
            place-items: center;
            padding: clamp(14px, 3vw, 34px);
            background: rgba(22, 40, 38, 0.64);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.24s ease, visibility 0.24s ease;
        }

        body.is-lightbox-open {
            overflow: hidden;
        }

        .portfolio-lightbox.is-open {
            opacity: 1;
            visibility: visible;
            pointer-events: auto;
        }

        .lightbox-shell {
            position: relative;
            width: min(96vw, 1240px);
            height: min(94svh, 900px);
            display: grid;
            grid-template-rows: auto minmax(0, 1fr) auto;
            gap: 12px;
            padding: clamp(12px, 2vw, 18px);
            border: 1px solid rgba(255, 249, 217, 0.24);
            border-radius: 10px;
            background:
                radial-gradient(circle at 12% 0%, rgba(255, 249, 217, 0.24), transparent 24rem),
                linear-gradient(180deg, rgba(240, 235, 179, 0.96), rgba(199, 208, 170, 0.92));
            box-shadow: 0 32px 80px rgba(15, 28, 24, 0.38);
            transform: translateY(12px) scale(0.98);
            transition: transform 0.24s ease;
        }

        .portfolio-lightbox.is-open .lightbox-shell {
            transform: translateY(0) scale(1);
        }

        .lightbox-topbar,
        .lightbox-toolbar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }

        .lightbox-title {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.72rem;
            font-weight: 700;
            letter-spacing: 1.8px;
            text-transform: uppercase;
            color: var(--earth);
        }

        .lightbox-button {
            width: 44px;
            height: 44px;
            display: inline-grid;
            place-items: center;
            border: 1px solid rgba(131, 82, 26, 0.28);
            border-radius: 50%;
            background: rgba(255, 249, 217, 0.64);
            color: var(--earth);
            font-family: 'Montserrat', sans-serif;
            font-size: 1rem;
            font-weight: 700;
            cursor: pointer;
            transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease, opacity 0.2s ease;
        }

        .lightbox-button:hover,
        .lightbox-button:focus-visible {
            background: var(--earth);
            color: var(--soft-cream);
            transform: translateY(-1px);
            outline: none;
        }

        .lightbox-button[disabled] {
            opacity: 0.38;
            cursor: default;
            transform: none;
        }

        .lightbox-stage {
            position: relative;
            min-height: 0;
            overflow: hidden;
            display: grid;
            place-items: center;
            border-radius: 8px;
            background: rgba(255, 249, 217, 0.3);
            border: 1px solid rgba(131, 82, 26, 0.12);
        }

        .lightbox-media {
            position: relative;
            width: 100%;
            height: 100%;
            display: grid;
            place-items: center;
            overflow: hidden;
        }

        .lightbox-media img,
        .lightbox-media video {
            width: auto;
            height: auto;
            max-width: none;
            max-height: none;
            display: block;
            object-fit: contain;
            object-position: center;
            border-radius: 0;
            box-shadow: none;
        }

        .lightbox-media img {
            transform: translate3d(var(--lightbox-pan-x, 0px), var(--lightbox-pan-y, 0px), 0) scale(var(--lightbox-zoom, 1));
            transition: transform 0.18s ease;
            cursor: zoom-in;
            transform-origin: center;
            user-select: none;
            -webkit-user-drag: none;
            touch-action: none;
        }

        .lightbox-media.is-zoomed img {
            cursor: grab;
        }

        .lightbox-media.is-dragging img {
            cursor: grabbing;
            transition: none;
        }

        .lightbox-media video {
            width: auto;
            height: auto;
            max-width: none;
            max-height: none;
            object-fit: contain;
            background: rgba(22, 40, 38, 0.28);
            transform: none !important;
        }

        .lightbox-sound-toggle {
            position: absolute;
            top: 14px;
            right: 14px;
            z-index: 5;
            min-height: 44px;
            padding: 10px 15px;
            border: 1px solid rgba(255, 249, 217, 0.5);
            border-radius: 999px;
            background: rgba(63, 74, 48, 0.86);
            color: var(--soft-cream);
            box-shadow: 0 10px 24px rgba(20, 30, 18, 0.24);
            font-family: 'Montserrat', sans-serif;
            font-size: 0.66rem;
            font-weight: 700;
            letter-spacing: 1.2px;
            text-transform: uppercase;
            cursor: pointer;
            transition: background 0.2s ease, transform 0.2s ease;
        }

        .lightbox-sound-toggle:hover,
        .lightbox-sound-toggle:focus-visible,
        .lightbox-sound-toggle[aria-pressed="true"] {
            background: rgba(131, 82, 26, 0.94);
            transform: translateY(-1px);
            outline: none;
        }

        .lightbox-arrow {
            position: absolute;
            top: 50%;
            z-index: 2;
            transform: translateY(-50%);
        }

        .lightbox-arrow:hover,
        .lightbox-arrow:focus-visible {
            transform: translateY(-50%) translateY(-1px);
        }

        .lightbox-prev {
            left: 12px;
        }

        .lightbox-next {
            right: 12px;
        }

        .lightbox-zoom-controls {
            display: inline-flex;
            align-items: center;
            gap: 8px;
        }

        .lightbox-count {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.72rem;
            font-weight: 700;
            letter-spacing: 1.2px;
            color: rgba(63, 74, 48, 0.78);
        }

        @keyframes portfolioReveal {
            from {
                opacity: 0;
                transform: translateY(14px) scale(0.98);
            }
            to {
                opacity: 1;
                transform: translateY(0) scale(1);
            }
        }

        .order-form {
            display: grid;
            gap: 18px;
            width: min(100%, 820px);
            margin: 0 auto;
        }

        .order-progress {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 12px;
            margin: 0 auto clamp(18px, 3vw, 28px);
            font-family: 'Montserrat', sans-serif;
            font-size: 0.72rem;
            font-weight: 600;
            letter-spacing: 1.8px;
            text-transform: uppercase;
            color: rgba(131, 82, 26, 0.82);
        }

        .order-progress-bar {
            width: min(220px, 42vw);
            height: 1px;
            background: rgba(131, 82, 26, 0.18);
            overflow: hidden;
        }

        .order-progress-fill {
            display: block;
            width: var(--wizard-progress, 14.28%);
            height: 100%;
            background: var(--earth);
            transition: width 0.28s ease;
        }

        .form-step {
            display: none;
            padding: clamp(20px, 3vw, 30px);
            margin: 0;
            border: 1px solid rgba(131, 82, 26, 0.18);
            border-radius: 8px;
            background: rgba(255, 249, 217, 0.42);
            box-shadow: 0 16px 34px rgba(54, 42, 18, 0.08);
            animation: fadeInUp 0.45s ease both;
        }

        .form-step.is-active {
            display: block;
        }

        .form-step-title {
            display: block;
            width: 100%;
            padding: 0;
            margin: 0 0 14px;
            font-family: 'Cormorant Garamond', serif;
            font-size: clamp(1.35rem, 2.3vw, 2rem);
            font-weight: 400;
            line-height: 1.1;
            color: var(--olive);
        }

        .conditional-step.is-skipped {
            display: none !important;
        }

        .conditional-field {
            display: grid;
            grid-template-rows: 0fr;
            opacity: 0;
            margin-top: 0;
            transition: grid-template-rows 0.28s ease, opacity 0.28s ease, margin-top 0.28s ease;
        }

        .conditional-field > * {
            overflow: hidden;
        }

        .conditional-field.is-visible {
            grid-template-rows: 1fr;
            opacity: 1;
            margin-top: 14px;
        }

        .conditional-field[aria-hidden="true"] {
            pointer-events: none;
        }

        .step-error {
            display: none;
            margin-top: 14px;
            font-family: 'Montserrat', sans-serif;
            font-size: 0.76rem;
            font-weight: 600;
            line-height: 1.5;
            color: var(--earth);
        }

        .form-step.has-error {
            border-color: rgba(131, 82, 26, 0.56);
            box-shadow: 0 16px 34px rgba(131, 82, 26, 0.12);
        }

        .form-step.has-error .step-error {
            display: block;
        }

        .form-hint {
            margin: -6px 0 16px;
            font-family: 'Montserrat', sans-serif;
            font-size: 0.78rem;
            line-height: 1.6;
            color: rgba(63, 74, 48, 0.72);
        }

        .input-field,
        .textarea-field {
            width: 100%;
            border: 1px solid rgba(131, 82, 26, 0.24);
            border-radius: 8px;
            background: rgba(255, 249, 217, 0.68);
            color: var(--olive);
            font: 500 0.92rem 'Montserrat', sans-serif;
            padding: 14px 15px;
            outline: none;
            transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
        }

        .textarea-field {
            min-height: 116px;
            resize: vertical;
            line-height: 1.7;
        }

        .input-field:focus,
        .textarea-field:focus {
            border-color: rgba(131, 82, 26, 0.64);
            background: rgba(255, 249, 217, 0.9);
            box-shadow: 0 0 0 4px rgba(131, 82, 26, 0.08);
        }

        .file-field {
            display: grid;
            gap: 12px;
        }

        .file-drop {
            display: grid;
            place-items: center;
            min-height: 138px;
            padding: 20px;
            border: 1px dashed rgba(131, 82, 26, 0.42);
            border-radius: 8px;
            background: rgba(255, 249, 217, 0.46);
            color: rgba(63, 74, 48, 0.86);
            font-family: 'Montserrat', sans-serif;
            font-size: 0.82rem;
            line-height: 1.55;
            text-align: center;
            cursor: pointer;
            transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
        }

        .file-drop:hover,
        .file-drop:focus-within {
            border-color: rgba(131, 82, 26, 0.74);
            background: rgba(255, 249, 217, 0.72);
            transform: translateY(-1px);
        }

        .file-drop input {
            position: absolute;
            opacity: 0;
            pointer-events: none;
        }

        .file-preview {
            display: none;
            align-items: center;
            gap: 12px;
            font-family: 'Montserrat', sans-serif;
            font-size: 0.78rem;
            color: rgba(63, 74, 48, 0.86);
        }

        .file-preview.is-visible {
            display: flex;
        }

        .file-preview img {
            width: 58px;
            height: 58px;
            border-radius: 8px;
            object-fit: cover;
            border: 1px solid rgba(131, 82, 26, 0.18);
        }

        .choice-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
        }

        .choice-card {
            position: relative;
            display: flex;
            align-items: center;
            min-height: 54px;
            padding: 13px 14px 13px 44px;
            border: 1px solid rgba(131, 82, 26, 0.18);
            border-radius: 8px;
            background: rgba(255, 249, 217, 0.46);
            color: rgba(63, 74, 48, 0.92);
            font-family: 'Montserrat', sans-serif;
            font-size: 0.82rem;
            line-height: 1.35;
            cursor: pointer;
            transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
        }

        .choice-card input {
            position: absolute;
            opacity: 0;
            pointer-events: none;
        }

        .choice-card::before {
            content: '';
            position: absolute;
            left: 14px;
            top: 50%;
            width: 16px;
            height: 16px;
            border: 1px solid rgba(131, 82, 26, 0.52);
            border-radius: 50%;
            transform: translateY(-50%);
            background: rgba(255, 249, 217, 0.5);
        }

        .choice-card:has(input[type="checkbox"])::before {
            border-radius: 5px;
        }

        .choice-card:has(input:checked) {
            border-color: rgba(131, 82, 26, 0.56);
            background: rgba(240, 235, 179, 0.76);
            box-shadow: 0 10px 22px rgba(54, 42, 18, 0.08);
            transform: translateY(-1px);
        }

        .choice-card:has(input:checked)::before {
            background: var(--earth);
            box-shadow: inset 0 0 0 4px var(--soft-cream);
        }

        .date-row,
        .contact-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px;
        }

        .contact-grid {
            grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
            align-items: end;
        }

        .contact-divider {
            display: grid;
            place-items: center;
            min-height: 47px;
            padding: 0 2px;
            font-family: 'Amoresa', 'Italianno', cursive;
            font-size: 2rem;
            line-height: 1;
            color: rgba(131, 82, 26, 0.78);
        }

        .contact-option {
            position: relative;
            display: grid;
            gap: 8px;
        }

        .contact-option span {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.75rem;
            font-weight: 600;
            letter-spacing: 1.4px;
            text-transform: uppercase;
            color: rgba(131, 82, 26, 0.86);
        }

        .order-actions {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            padding-top: 12px;
        }

        .order-prev,
        .order-next,
        .order-submit {
            min-height: 52px;
            padding: 16px 28px 15px;
            border: 1px solid rgba(131, 82, 26, 0.52);
            border-radius: 999px;
            font-family: 'Montserrat', sans-serif;
            font-size: 0.8rem;
            font-weight: 700;
            letter-spacing: 2px;
            text-transform: uppercase;
            cursor: pointer;
            transition: transform 0.22s ease, background 0.22s ease, color 0.22s ease, box-shadow 0.22s ease;
        }

        .order-prev {
            background: rgba(255, 249, 217, 0.55);
            color: var(--earth);
            box-shadow: none;
        }

        .order-next,
        .order-submit {
            background: rgba(131, 82, 26, 0.92);
            color: var(--soft-cream);
            box-shadow: 0 18px 38px rgba(54, 42, 18, 0.18);
        }

        .order-prev:hover,
        .order-prev:focus-visible,
        .order-next:hover,
        .order-next:focus-visible,
        .order-submit:hover,
        .order-submit:focus-visible {
            background: rgba(255, 249, 217, 0.92);
            color: var(--earth);
            box-shadow: 0 20px 42px rgba(54, 42, 18, 0.18);
            transform: translateY(-3px);
            outline: none;
        }

        .order-prev[hidden],
        .order-next[hidden],
        .order-submit[hidden] {
            display: none;
        }

        .review-list {
            display: grid;
            gap: 10px;
        }

        .review-item {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 14px;
            align-items: center;
            padding: 14px;
            border: 1px solid rgba(131, 82, 26, 0.16);
            border-radius: 8px;
            background: rgba(255, 249, 217, 0.44);
        }

        .review-label {
            display: block;
            margin-bottom: 5px;
            font-family: 'Montserrat', sans-serif;
            font-size: 0.66rem;
            font-weight: 700;
            letter-spacing: 1.4px;
            text-transform: uppercase;
            color: rgba(131, 82, 26, 0.78);
        }

        .review-value {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.86rem;
            line-height: 1.55;
            color: rgba(63, 74, 48, 0.9);
        }

        .review-edit {
            border: 0;
            border-bottom: 1px solid currentColor;
            background: transparent;
            color: var(--earth);
            font-family: 'Montserrat', sans-serif;
            font-size: 0.68rem;
            font-weight: 700;
            letter-spacing: 1.3px;
            text-transform: uppercase;
            cursor: pointer;
        }

        .review-edit:hover,
        .review-edit:focus-visible {
            color: var(--olive);
            outline: none;
        }

        .order-success {
            display: none;
            margin: 0 0 18px;
            padding: 18px 20px;
            border: 1px solid rgba(63, 74, 48, 0.22);
            border-radius: 8px;
            background: rgba(255, 249, 217, 0.76);
            color: var(--olive);
            text-align: center;
            font-family: 'Montserrat', sans-serif;
            line-height: 1.6;
            box-shadow: 0 14px 28px rgba(54, 42, 18, 0.08);
        }

        .order-section.is-sent .order-success {
            display: block;
            animation: fadeInUp 0.35s ease both;
        }

        .order-success.is-visible {
            display: block;
            animation: fadeInUp 0.35s ease both;
        }

        .order-success.is-error {
            border-color: rgba(131, 82, 26, 0.34);
            background: rgba(255, 249, 217, 0.9);
            color: var(--earth);
        }

        .order-success strong {
            font-weight: 800;
            color: var(--earth);
        }

        .order-section.is-sent .order-form {
            display: none;
        }

        .sr-only {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border: 0;
        }

        @keyframes fadeInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes bootProgress {
            from { transform: translateX(-105%); }
            to { transform: translateX(220%); }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }

        @keyframes navCtaShimmer {
            0%, 35% {
                left: -70%;
            }
            65%, 100% {
                left: 115%;
            }
        }

        @keyframes loaderBrush {
            0% {
                transform: translateX(0) translateY(2px) rotate(-22deg);
                opacity: 0;
            }
            12% {
                opacity: 1;
            }
            72% {
                transform: translateX(166px) translateY(-2px) rotate(-12deg);
                opacity: 1;
            }
            88% {
                transform: translateX(166px) translateY(-2px) rotate(-12deg);
                opacity: 0;
            }
            100% {
                transform: translateX(166px) translateY(-2px) rotate(-12deg);
                opacity: 0;
            }
        }

        @keyframes loaderStroke {
            0% {
                transform: scaleX(0);
                opacity: 0;
            }
            12% {
                opacity: 0.72;
            }
            72% {
                transform: scaleX(1);
                opacity: 1;
            }
            88% {
                transform: scaleX(1);
                opacity: 0;
            }
            100% {
                transform: scaleX(1);
                opacity: 0;
            }
        }

        @keyframes navBrandUnderline {
            0% {
                opacity: 0;
                transform: rotate(-1deg) scaleX(0);
            }
            12% {
                opacity: 0.52;
            }
            78%,
            100% {
                opacity: 0.82;
                transform: rotate(-1deg) scaleX(1);
            }
        }

        @keyframes navBrandBrush {
            0% {
                left: -7px;
                opacity: 0;
                transform: translateY(-3px) rotate(-19deg);
            }
            12% {
                opacity: 1;
            }
            78% {
                left: calc(100% - 21px);
                opacity: 1;
                transform: translateY(-4px) rotate(-13deg);
            }
            90%,
            100% {
                left: calc(100% - 21px);
                opacity: 0;
                transform: translateY(-4px) rotate(-13deg);
            }
        }

        @media (min-width: 900px) {
            .container {
                transform: none;
            }

            .bottom-section {
                width: min(100%, 740px);
                gap: clamp(64px, 6vw, 104px);
            }

            .bottom-text {
                flex-basis: 220px;
                font-size: clamp(0.86rem, 0.78vw, 1rem);
                letter-spacing: 4.2px;
                line-height: 1.85;
            }

            .logo-container {
                width: 72px;
            }

            .logo-symbol {
                font-size: 3.8rem;
            }
        }

        @media (min-width: 901px) and (max-width: 1180px) {
            .site-header {
                padding-inline: 16px;
            }

            .site-nav {
                gap: 14px;
            }

            .nav-group {
                gap: clamp(8px, 1vw, 12px);
            }

            .nav-link {
                gap: 5px;
                font-size: 0.65rem;
                letter-spacing: 1.05px;
            }

            .nav-brand {
                font-size: 2.05rem;
            }

            .nav-cta {
                min-height: 38px;
                padding: 10px 14px 9px;
            }
        }

        @media (max-width: 820px) {
            .about-header {
                margin-bottom: 34px;
            }

            .about-layout {
                grid-template-columns: 1fr;
                gap: 42px;
            }

            .about-aside {
                width: min(74vw, 320px);
                margin: 0 auto;
            }

            .about-botanical {
                display: none;
            }

            .about-copy {
                max-width: 640px;
                margin: 0 auto;
            }
        }

        @media (max-width: 900px) {
            .contact-section {
                padding: 96px 20px 72px;
            }

            .contact-layout {
                width: min(100%, 720px);
                margin: 0 auto;
                grid-template-columns: 1fr;
                gap: 42px;
            }

            .contact-phone {
                width: min(76vw, 350px);
                margin-top: -26px;
            }

            .contact-copy {
                width: min(100%, 520px);
            }

            .contact-cards {
                grid-template-columns: repeat(3, minmax(0, 1fr));
                gap: 12px;
            }

            .contact-card {
                min-height: 156px;
                padding-inline: 14px;
            }
        }

        @media (max-width: 900px) {
            .site-header {
                padding: 0;
                color: var(--earth);
                background: transparent;
                border-bottom: 0;
                box-shadow: none;
                backdrop-filter: none;
                pointer-events: none;
            }

            .site-header.is-solid {
                padding: 0;
                background: transparent;
                border-color: transparent;
                box-shadow: none;
                backdrop-filter: none;
            }

            .site-header.is-open {
                color: var(--earth);
                background: transparent;
                border-color: transparent;
                box-shadow: none;
                backdrop-filter: none;
                pointer-events: auto;
            }

            .site-nav {
                position: fixed;
                top: 14px;
                left: 14px;
                right: 14px;
                width: auto;
                margin: 0;
                grid-template-columns: 1fr auto;
                column-gap: 12px;
                row-gap: 0;
                align-items: start;
                pointer-events: none;
                border-radius: 22px;
                transition: background 0.28s ease, box-shadow 0.28s ease, padding 0.28s ease, border-color 0.28s ease;
            }

            .site-header.is-open .site-nav {
                padding: 72px 16px 18px;
                background:
                    radial-gradient(circle at 92% 0%, rgba(190, 143, 32, 0.18), transparent 34%),
                    linear-gradient(180deg, rgba(255, 249, 217, 0.97), rgba(239, 232, 177, 0.96));
                border: 1px solid rgba(131, 82, 26, 0.18);
                box-shadow: 0 24px 58px rgba(20, 49, 53, 0.24);
                backdrop-filter: blur(18px);
                pointer-events: auto;
            }

            .nav-brand {
                grid-column: 1;
                justify-self: start;
                font-size: 2.15rem;
                display: none;
            }

            .site-header.is-solid .nav-brand {
                display: none;
            }

            .nav-toggle {
                grid-column: 2;
                justify-self: end;
                position: fixed;
                top: 14px;
                right: 14px;
                z-index: 25;
                pointer-events: auto;
                width: 54px;
                height: 48px;
                border: 1px solid rgba(190, 143, 32, 0.54);
                border-radius: 999px;
                background: rgba(13, 43, 50, 0.78);
                display: inline-flex !important;
                align-items: center;
                justify-content: center;
                flex-direction: column;
                gap: 6px;
                box-shadow: 0 16px 34px rgba(13, 43, 50, 0.3);
                backdrop-filter: blur(14px);
                cursor: pointer;
                -webkit-tap-highlight-color: transparent;
                transition: background 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease;
            }

            .site-header.is-open .nav-toggle {
                border-color: rgba(131, 82, 26, 0.26);
                background: rgba(255, 249, 217, 0.96);
                box-shadow: 0 12px 26px rgba(54, 42, 18, 0.13);
                transform: translateY(1px);
            }

            .nav-toggle span {
                width: 22px;
                height: 2px;
                border-radius: 999px;
                background: #d6a72f;
                box-shadow: 0 0 12px rgba(214, 167, 47, 0.34);
                transition: transform 0.24s ease, opacity 0.2s ease, width 0.22s ease, background 0.22s ease;
            }

            .nav-toggle span:nth-child(2) {
                width: 15px;
            }

            .site-header.is-open .nav-toggle span {
                background: var(--earth);
                box-shadow: none;
                width: 22px;
            }

            .site-header.is-open .nav-toggle span:nth-child(1) {
                transform: translateY(6px) rotate(42deg);
            }

            .site-header.is-open .nav-toggle span:nth-child(2) {
                opacity: 0;
            }

            .site-header.is-open .nav-toggle span:nth-child(3) {
                transform: translateY(-6px) rotate(-42deg);
            }

            .nav-group {
                grid-column: 1 / -1;
                width: 100%;
                display: none;
                flex-direction: column;
                align-items: stretch;
                justify-content: flex-start;
                gap: 6px;
                padding: 0;
                flex-wrap: nowrap;
            }

            .site-header.is-open .nav-group {
                display: flex;
            }

            .nav-group.right {
                justify-content: flex-start;
            }

            .nav-link {
                width: 100%;
                min-height: 50px;
                justify-content: flex-start;
                padding: 14px 15px;
                border-top: 0;
                border-radius: 14px;
                font-size: 0.76rem;
                letter-spacing: 1.9px;
                background: rgba(255, 249, 217, 0.3);
                transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
            }

            .nav-link:hover,
            .nav-link:focus-visible,
            .nav-link.is-active {
                background: rgba(255, 249, 217, 0.82);
                box-shadow: inset 0 0 0 1px rgba(131, 82, 26, 0.08);
                transform: translateX(2px);
            }

            .nav-link::after {
                left: 14px;
                right: 14px;
                bottom: 8px;
                background: rgba(131, 82, 26, 0.42);
            }

            .nav-cta {
                min-height: 44px;
                margin-top: 10px;
                padding: 12px 18px 11px;
                justify-content: center;
                background: rgba(131, 82, 26, 0.92);
                color: var(--soft-cream);
                border-color: rgba(131, 82, 26, 0.42);
                box-shadow: 0 14px 30px rgba(131, 82, 26, 0.18);
            }
        }

        @media (max-width: 720px) {
            body::before {
                display: none;
            }

            .contact-section {
                padding: 88px 16px 54px;
            }

            .contact-back {
                margin-bottom: 10px;
                font-size: 0.66rem;
            }

            .contact-layout {
                gap: 36px;
            }

            .contact-phone {
                width: min(78vw, 310px);
                margin: -18px auto -8px;
                filter: drop-shadow(0 18px 17px rgba(54, 42, 18, 0.12));
            }

            .contact-kicker {
                margin-bottom: 8px;
                font-size: clamp(3.25rem, 15vw, 4.55rem);
            }

            .contact-title {
                font-size: clamp(2.75rem, 12vw, 3.8rem);
                line-height: 0.94;
            }

            .contact-copy {
                max-width: 32rem;
                margin-top: 24px;
                padding-inline: 10px;
                font-size: clamp(1.02rem, 4.6vw, 1.16rem);
                line-height: 1.58;
            }

            .contact-cards {
                grid-template-columns: 1fr;
                gap: 14px;
            }

            .contact-card {
                min-height: 146px;
                padding: 24px 18px;
                border-radius: 24px;
            }

            .hero {
                --hero-bg: url('../hero-mobile.webp?v=20260728-1');
                min-height: 100vh;
                min-height: 100svh;
                min-height: 100dvh;
                padding: 44px 18px calc(72px + env(safe-area-inset-bottom));
                background-position: center;
            }

            .bottom-section {
                display: grid;
                grid-template-columns: minmax(0, 1fr) clamp(44px, 12vw, 58px) minmax(0, 1fr);
                gap: clamp(14px, 4vw, 24px);
                width: min(100%, 420px);
                transform: translateY(-7vh);
            }

            .bottom-text {
                width: 100%;
                min-width: 0;
                font-size: clamp(0.72rem, 3vw, 0.94rem);
                letter-spacing: clamp(1.5px, 0.75vw, 2.6px);
                line-height: 1.8;
            }

            .logo-container {
                width: 100%;
            }

            .logo-symbol {
                font-size: clamp(3rem, 12vw, 4rem);
            }

            .gallery-section {
                min-height: auto;
                padding: 38px 16px 26px;
                scroll-margin-top: 78px;
            }

            .gallery-heading {
                font-size: clamp(3rem, 15vw, 4.3rem);
                max-width: 10ch;
            }

            .gallery-stage {
                width: 100%;
            }

            .paint-preview {
                display: block;
                top: 57%;
                width: clamp(70px, 22vw, 90px);
                border: 1px solid rgba(177, 122, 32, 0.26);
                background: rgba(255, 249, 217, 0.68);
                box-shadow: none;
                opacity: 0.64;
                filter: none;
            }

            .paint-preview::after {
                content: none;
            }

            .paint-preview.prev {
                right: calc(50% + min(36vw, 195px) - 44px);
                transform: translateY(-50%) scale(0.94);
            }

            .paint-preview.next {
                left: calc(50% + min(36vw, 195px) - 44px);
                transform: translateY(-50%) scale(0.94);
            }

            .paint-preview:hover,
            .paint-preview:focus-visible {
                opacity: 0.86;
                filter: none;
            }

            .paint-preview.prev:hover,
            .paint-preview.prev:focus-visible,
            .paint-preview.next:hover,
            .paint-preview.next:focus-visible {
                transform: translateY(-50%) scale(0.98);
            }

            .frame-carousel {
                width: min(72vw, 390px);
            }

            .carousel-control.prev {
                left: 2px;
            }

            .carousel-control.next {
                right: 2px;
            }

            .booking-section {
                min-height: 66vh;
                min-height: 66svh;
                padding: 44px 18px 82px;
                scroll-margin-top: 76px;
            }

            .booking-section::before {
                width: 116px;
                height: 64px;
                right: 4%;
                bottom: 14%;
                opacity: 0.34;
            }

            .booking-kicker {
                margin-bottom: 18px;
                font-size: clamp(3rem, 15vw, 4.3rem);
                transform: rotate(-5deg);
            }

            .booking-title {
                font-size: clamp(2.2rem, 12vw, 3.75rem);
                line-height: 1.02;
                width: 100%;
                max-width: none;
                text-align: center;
                overflow-wrap: normal;
                word-break: normal;
            }

            .booking-title-main {
                display: block;
                width: min(100%, 14ch);
                margin-inline: auto;
            }

            .booking-title-final {
                display: block;
                width: 100%;
                text-align: center;
                white-space: nowrap;
            }

            .booking-action {
                margin-top: 34px;
                font-size: 0.68rem;
                letter-spacing: 2px;
            }

            .booking-quote {
                min-height: 46px;
                margin-top: 30px;
                padding: 14px 22px 13px;
                font-size: 0.68rem;
                letter-spacing: 1.4px;
            }

            .site-footer {
                padding: 64px 18px 46px;
            }

            .footer-quote {
                font-size: clamp(1.45rem, 7vw, 2.2rem);
                line-height: 1.18;
                max-width: 11.5em;
            }

            .footer-contact {
                font-size: 0.72rem;
                letter-spacing: 0.8px;
            }

            .order-section {
                padding: 84px 14px 58px;
            }

            .portfolio-section {
                padding: 84px 14px 58px;
            }

            .about-section {
                padding: 84px 18px 64px;
            }

            .order-back {
                margin-bottom: 22px;
                font-size: 0.66rem;
            }

            .portfolio-back {
                margin-bottom: 22px;
                font-size: 0.66rem;
            }

            .about-back {
                margin-bottom: 22px;
                font-size: 0.66rem;
            }

            .order-header {
                margin-bottom: 30px;
            }

            .portfolio-header {
                margin-bottom: 30px;
            }

            .about-header {
                margin-bottom: 30px;
            }

            .order-kicker {
                font-size: clamp(2.9rem, 14vw, 4.2rem);
            }

            .portfolio-kicker {
                font-size: clamp(2.9rem, 14vw, 4.2rem);
            }

            .about-kicker {
                font-size: clamp(2.9rem, 14vw, 4.2rem);
            }

            .order-title {
                font-size: clamp(2rem, 10vw, 3.15rem);
            }

            .portfolio-title {
                font-size: clamp(2rem, 10vw, 3.15rem);
            }

            .about-title {
                font-size: clamp(2rem, 10vw, 3.15rem);
            }

            .about-layout {
                gap: 36px;
            }

            .about-aside {
                width: min(76vw, 310px);
            }

            .about-portrait {
                padding: 4px;
                border-radius: 50%;
            }

            .about-portrait img {
                height: 100%;
                border-radius: 50%;
                object-position: 50% 24%;
            }

            .about-copy {
                max-width: 620px;
                margin: 0 auto;
                padding: 0;
                font-size: clamp(1.06rem, 4.8vw, 1.2rem);
                line-height: 1.68;
            }

            .about-copy p + p {
                margin-top: 26px;
            }

            .portfolio-filters {
                justify-content: flex-start;
                flex-wrap: nowrap;
                overflow-x: auto;
                padding-bottom: 8px;
                scrollbar-width: thin;
            }

            .portfolio-filter {
                flex: 0 0 auto;
                min-height: 44px;
                padding-inline: 14px;
                font-size: 0.66rem;
                letter-spacing: 1.1px;
            }

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

            .form-step {
                padding: 18px 16px;
            }

            .choice-grid,
            .date-row,
            .contact-grid {
                grid-template-columns: 1fr;
            }

            .contact-divider {
                min-height: 18px;
                padding: 0;
            }

            .choice-card {
                min-height: 50px;
                font-size: 0.78rem;
            }

            .input-field,
            .textarea-field {
                font-size: 1rem;
            }

            .portfolio-lightbox {
                -webkit-backdrop-filter: none;
                backdrop-filter: none;
            }

            .order-submit {
                width: 100%;
                padding-inline: 22px;
            }

            .order-actions {
                flex-direction: column-reverse;
            }

            .order-prev,
            .order-next {
                width: 100%;
            }

            .review-item {
                grid-template-columns: 1fr;
            }

            .review-edit {
                justify-self: start;
            }
        }

        @media (max-width: 430px) {
            .about-aside {
                width: min(78vw, 286px);
            }

            .about-copy {
                padding: 0;
            }

            .contact-section {
                padding-inline: 15px;
            }

            .contact-phone {
                width: min(82vw, 292px);
            }

            .contact-card {
                min-height: 140px;
            }

            .hero {
                min-height: 100vh;
                min-height: 100svh;
                min-height: 100dvh;
                padding-inline: 14px;
                background-position: center;
            }

            .bottom-section {
                grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1fr);
                width: min(100%, 360px);
                max-width: none;
                gap: 8px;
                transform: translateY(-6vh);
            }

            .bottom-text {
                font-size: 0.68rem;
                letter-spacing: 1.15px;
                line-height: 1.72;
            }

            .logo-container {
                width: 100%;
            }

            .logo-symbol {
                font-size: 3.25rem;
            }

            .frame-carousel {
                width: min(72vw, 350px);
            }

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

            .portfolio-lightbox {
                padding: 10px;
            }

            .lightbox-shell {
                width: 100%;
                height: 94vh;
                height: 94svh;
                height: 94dvh;
                padding: 10px;
                gap: 10px;
            }

            .lightbox-button {
                width: 44px;
                height: 44px;
            }

            .lightbox-prev {
                left: 8px;
            }

            .lightbox-next {
                right: 8px;
            }

            .lightbox-toolbar {
                align-items: center;
            }

            .carousel-control {
                top: 53%;
            }
        }

        @media (max-width: 900px) {
            body::before {
                display: none;
            }

            body.is-menu-open {
                overflow: hidden;
                overscroll-behavior: none;
            }

            body.is-view-loading .page,
            body.is-view-loading .site-footer {
                filter: none;
                transform: none;
                opacity: 0.82;
                transition: opacity 0.16s ease;
            }

            body.is-view-loading .site-header {
                filter: none;
            }

            .page-loader {
                background: rgba(18, 76, 91, 0.42);
                -webkit-backdrop-filter: none;
                backdrop-filter: none;
            }

            .site-header.is-mobile-nav,
            .site-header.is-mobile-nav.is-solid,
            .site-header.is-mobile-nav.is-open {
                padding: 0;
                color: var(--earth);
                background: transparent;
                border: 0;
                box-shadow: none;
                backdrop-filter: none;
                pointer-events: none;
            }

            .site-header.is-mobile-nav .site-nav {
                position: fixed;
                top: max(12px, env(safe-area-inset-top));
                left: max(12px, env(safe-area-inset-left));
                right: max(12px, env(safe-area-inset-right));
                width: auto;
                margin: 0;
                display: flex;
                flex-direction: column;
                align-items: stretch;
                gap: 8px;
                padding: 0;
                border: 1px solid transparent;
                border-radius: 24px;
                background: transparent;
                box-shadow: none;
                backdrop-filter: none;
                max-height: calc(100vh - 24px);
                max-height: calc(100dvh - 24px);
                overflow-x: hidden;
                overflow-y: auto;
                overscroll-behavior: contain;
                -webkit-overflow-scrolling: touch;
                pointer-events: none;
                transition: none;
            }

            .site-header.is-mobile-nav.is-open .site-nav {
                padding: 76px 14px 16px;
                border-color: rgba(131, 82, 26, 0.18);
                background: linear-gradient(180deg, #fff9d9, #f0ebb3);
                box-shadow: 0 12px 28px rgba(28, 45, 39, 0.14);
                -webkit-backdrop-filter: none;
                backdrop-filter: none;
                pointer-events: auto;
            }

            .site-header.is-mobile-nav .nav-brand,
            .site-header.is-mobile-nav.is-solid .nav-brand {
                position: fixed;
                top: max(24px, calc(env(safe-area-inset-top) + 6px));
                left: max(18px, env(safe-area-inset-left));
                z-index: 1000;
                display: inline-flex !important;
                align-items: center;
                min-height: 44px;
                padding: 1px 13px 9px;
                border: 1px solid rgba(190, 143, 32, 0.34);
                border-radius: 999px;
                color: var(--earth);
                background: rgba(255, 249, 217, 0.9);
                box-shadow: 0 12px 30px rgba(18, 76, 91, 0.14);
                font-family: 'Amoresa', 'Italianno', cursive;
                font-size: clamp(2.1rem, 9vw, 2.75rem);
                line-height: 0.9;
                opacity: 0;
                visibility: hidden;
                transform: none;
                pointer-events: none;
                -webkit-backdrop-filter: none;
                backdrop-filter: none;
                transition: none;
            }

            .site-header.is-mobile-nav.is-open .nav-brand {
                border-color: transparent;
                background: transparent;
                box-shadow: none;
                color: var(--earth);
                opacity: 1;
                visibility: visible;
                pointer-events: auto;
            }

            .site-header.is-mobile-nav .nav-brand-signature {
                display: none;
            }

            .site-header.is-mobile-nav .nav-brand-underline {
                position: absolute;
                left: 0;
                right: 13px;
                bottom: 1px;
                height: 7px;
                border-radius: 60% 45% 58% 42% / 72% 64% 50% 58%;
                background: linear-gradient(90deg, #b98217 0%, #d6a72f 52%, #e4c65c 100%);
                box-shadow: 0 4px 10px rgba(190, 143, 32, 0.18);
                opacity: 0;
                transform: rotate(-1deg) scaleX(0);
                transform-origin: left center;
            }

            .site-header.is-mobile-nav .nav-brand-underline::after {
                content: '';
                position: absolute;
                top: 2px;
                right: -1px;
                width: 24%;
                height: 2px;
                border-radius: inherit;
                background: rgba(255, 249, 217, 0.42);
                transform: rotate(-2deg);
            }

            .site-header.is-mobile-nav .nav-brand-brush {
                position: absolute;
                left: -7px;
                bottom: 0;
                width: 17px;
                height: 17px;
                color: #9c6a13;
                opacity: 0;
                filter: drop-shadow(0 3px 4px rgba(54, 42, 18, 0.16));
                transform: translateY(-3px) rotate(-19deg);
            }

            .site-header.is-mobile-nav.is-open .nav-brand-underline {
                animation: none;
            }

            .site-header.is-mobile-nav.is-open .nav-brand-brush {
                animation: none;
            }

            .site-header.is-mobile-nav .nav-toggle {
                position: fixed !important;
                top: max(14px, env(safe-area-inset-top)) !important;
                right: max(14px, env(safe-area-inset-right)) !important;
                z-index: 1000;
                width: 52px;
                height: 52px;
                display: inline-flex !important;
                align-items: center;
                justify-content: center;
                border: 1px solid rgba(190, 143, 32, 0.5);
                border-radius: 50%;
                background: #fff9d9;
                box-shadow: 0 6px 16px rgba(18, 76, 91, 0.14);
                -webkit-backdrop-filter: none;
                backdrop-filter: none;
                cursor: pointer;
                pointer-events: auto;
                -webkit-tap-highlight-color: transparent;
                transition: background-color 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
            }

            .site-header.is-mobile-nav .nav-toggle:hover,
            .site-header.is-mobile-nav .nav-toggle:focus-visible {
                transform: translateY(-1px);
            }

            .site-header.is-mobile-nav .nav-toggle:focus-visible,
            .site-header.is-mobile-nav .nav-link:focus-visible {
                outline: 3px solid rgba(131, 82, 26, 0.82);
                outline-offset: 3px;
            }

            .site-header.is-mobile-nav.is-open .nav-toggle {
                background: rgba(131, 82, 26, 0.94);
                border-color: rgba(255, 249, 217, 0.56);
                box-shadow: 0 6px 16px rgba(54, 42, 18, 0.14);
            }

            .site-header.is-mobile-nav .nav-toggle span {
                position: absolute;
                left: 15px;
                width: 22px;
                height: 2px;
                border-radius: 999px;
                background: #be8f20;
                box-shadow: none;
                opacity: 1;
                transform: none;
                transition: opacity 0.14s ease, transform 0.16s ease, background-color 0.16s ease;
            }

            .site-header.is-mobile-nav .nav-toggle span:nth-child(1) {
                top: 18px;
            }

            .site-header.is-mobile-nav .nav-toggle span:nth-child(2) {
                top: 25px;
                left: 20px;
                width: 17px;
            }

            .site-header.is-mobile-nav .nav-toggle span:nth-child(3) {
                top: 32px;
            }

            .site-header.is-mobile-nav.is-open .nav-toggle span {
                background: var(--soft-cream);
            }

            .site-header.is-mobile-nav.is-open .nav-toggle span:nth-child(1) {
                transform: translateY(7px) rotate(45deg);
            }

            .site-header.is-mobile-nav.is-open .nav-toggle span:nth-child(2) {
                opacity: 0;
                transform: scaleX(0.2);
            }

            .site-header.is-mobile-nav.is-open .nav-toggle span:nth-child(3) {
                transform: translateY(-7px) rotate(-45deg);
            }

            .site-header.is-mobile-nav .nav-group,
            .site-header.is-mobile-nav .nav-group.right {
                grid-column: auto;
                width: 100%;
                display: flex !important;
                flex-direction: column;
                align-items: stretch;
                justify-content: flex-start;
                gap: 8px;
                padding: 0;
                opacity: 0;
                visibility: hidden;
                transform: translateY(-8px);
                pointer-events: none;
                transition: opacity 0.16s ease, transform 0.16s ease;
            }

            .site-header.is-mobile-nav.is-open .nav-group,
            .site-header.is-mobile-nav.is-open .nav-group.right {
                opacity: 1;
                visibility: visible;
                transform: translateY(0);
                pointer-events: auto;
            }

            .site-header.is-mobile-nav.is-open .nav-group.left {
                transition-delay: 0s;
            }

            .site-header.is-mobile-nav.is-open .nav-group.right {
                transition-delay: 0s;
            }

            .site-header.is-mobile-nav .nav-link {
                width: 100%;
                min-height: 48px;
                display: inline-flex;
                align-items: center;
                justify-content: flex-start;
                gap: 10px;
                padding: 13px 14px;
                border: 1px solid rgba(131, 82, 26, 0.1);
                border-radius: 16px;
                background: rgba(255, 249, 217, 0.36);
                color: var(--earth);
                font-size: 0.74rem;
                font-weight: 600;
                letter-spacing: 1.7px;
                text-decoration: none;
                box-shadow: none;
                transform: none;
                transition: background-color 0.14s ease, border-color 0.14s ease, color 0.14s ease;
            }

            .site-header.is-mobile-nav .nav-link::after {
                display: none;
            }

            .site-header.is-mobile-nav .nav-brush {
                width: 16px;
                height: 16px;
                opacity: 0;
                transform: translateX(-4px) rotate(-12deg);
            }

            .site-header.is-mobile-nav .nav-link.is-active .nav-brush {
                width: 16px;
                opacity: 1;
                transform: translateX(0) rotate(-12deg);
            }

            .site-header.is-mobile-nav .nav-link:hover,
            .site-header.is-mobile-nav .nav-link:focus-visible,
            .site-header.is-mobile-nav .nav-link.is-active {
                background: rgba(255, 249, 217, 0.82);
                border-color: rgba(131, 82, 26, 0.2);
                color: var(--earth);
                transform: none;
            }

            .site-header.is-mobile-nav .nav-cta {
                --cta-rgb: 214, 167, 47;
                justify-content: center;
                min-height: 50px;
                margin-top: 4px;
                border-color: rgba(131, 82, 26, 0.36);
                background: rgba(var(--cta-rgb), 0.92);
                color: #332914;
                box-shadow: none;
            }

            .site-header.is-mobile-nav.is-solid .nav-cta {
                border-color: rgba(131, 82, 26, 0.36);
                background: rgba(var(--cta-rgb), 0.92);
                color: #332914;
            }

            .site-header.is-mobile-nav .nav-cta:hover,
            .site-header.is-mobile-nav .nav-cta:focus-visible {
                background: rgba(var(--cta-rgb), 0.98);
                color: #332914;
                box-shadow: none;
                transform: none;
            }

            .site-header.is-mobile-nav.is-solid .nav-cta:hover,
            .site-header.is-mobile-nav.is-solid .nav-cta:focus-visible {
                color: #332914;
            }
        }

        @media (hover: none) {
            .portfolio-card:hover img,
            .portfolio-card:hover video {
                transform: none;
                filter: none;
            }
        }

        @media (prefers-reduced-motion: reduce) {
            .contact-phone img {
                animation: none !important;
            }

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