:root {
    --bg: #fff1de;
    --bg-soft: #fff8f0;
    --surface: rgba(255, 248, 238, 0.86);
    --surface-strong: #fffaf4;
    --text: #2f1f16;
    --muted: #76594a;
    --accent: #f08a24;
    --accent-deep: #c55a11;
    --accent-soft: #ffd58f;
    --line: rgba(120, 69, 23, 0.14);
    --shadow: 0 22px 50px rgba(137, 74, 21, 0.16);
    --shadow-soft: 0 14px 32px rgba(137, 74, 21, 0.1);
    --radius-lg: 28px;
    --radius-md: 20px;
    --radius-sm: 14px;
    --max-width: 1180px;
    --transition: 220ms ease;
}

* {
    box-sizing: border-box;
}

[hidden] {
    display: none !important;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: "Manrope", sans-serif;
    color: var(--text);
    background:
        radial-gradient(circle at top left, rgba(255, 184, 92, 0.48), transparent 28%),
        radial-gradient(circle at 85% 20%, rgba(255, 126, 66, 0.22), transparent 24%),
        radial-gradient(circle at bottom right, rgba(255, 205, 96, 0.28), transparent 32%),
        linear-gradient(180deg, #fff6eb 0%, #ffe7cb 42%, #f9dbc0 100%);
    overflow-x: hidden;
}

body::before,
body::after {
    content: "";
    position: fixed;
    width: 240px;
    height: 240px;
    border-radius: 48% 52% 61% 39% / 42% 42% 58% 58%;
    background: radial-gradient(circle at 30% 30%, rgba(255, 218, 170, 0.58), rgba(255, 168, 105, 0.12));
    filter: blur(10px);
    z-index: -2;
    pointer-events: none;
}

body::before {
    top: 160px;
    right: -70px;
}

body::after {
    left: -90px;
    bottom: 220px;
}

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

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

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

button {
    cursor: pointer;
    border: 0;
}

.page-glow {
    position: fixed;
    width: 260px;
    height: 260px;
    border-radius: 999px;
    background: rgba(255, 170, 58, 0.28);
    filter: blur(18px);
    pointer-events: none;
    z-index: -1;
}

.page-glow-left {
    top: 80px;
    left: -120px;
}

.page-glow-right {
    right: -100px;
    bottom: 140px;
}

.petal {
    position: fixed;
    width: 140px;
    height: 140px;
    border-radius: 60% 40% 70% 30% / 45% 55% 45% 55%;
    background: linear-gradient(145deg, rgba(255, 236, 213, 0.7), rgba(255, 172, 123, 0.18));
    border: 1px solid rgba(255, 207, 154, 0.32);
    filter: blur(2px);
    z-index: -1;
    pointer-events: none;
}

.petal-one {
    top: 110px;
    right: 6%;
    transform: rotate(18deg);
}

.petal-two {
    bottom: 160px;
    left: 4%;
    transform: rotate(-18deg);
}

.site-header,
main,
.site-footer {
    width: min(calc(100% - 24px), var(--max-width));
    margin-inline: auto;
}

.site-header {
    position: sticky;
    top: 12px;
    z-index: 30;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 18px;
    margin-top: 12px;
    background: rgba(255, 249, 240, 0.72);
    border: 1px solid rgba(201, 117, 34, 0.12);
    border-radius: 999px;
    backdrop-filter: blur(14px);
    box-shadow: var(--shadow-soft);
}

.brand,
h1,
h2,
h3,
.footer-brand,
.chat-title {
    font-family: "Cormorant Garamond", serif;
}

.brand {
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    background: linear-gradient(135deg, #b84f11 0%, #ff8f2c 55%, #a93b0e 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.site-nav {
    display: none;
    gap: 18px;
    font-size: 0.95rem;
    color: var(--muted);
}

.site-nav a {
    position: relative;
    padding: 8px 12px;
    border-radius: 999px;
    letter-spacing: 0.02em;
    transition: color var(--transition);
}

.site-nav a:hover,
.site-nav a:focus-visible {
    color: var(--accent-deep);
    background: rgba(255, 241, 219, 0.78);
}

main {
    display: grid;
    gap: 28px;
    padding: 24px 0 88px;
}

section {
    position: relative;
}

.hero-section,
.about-section,
.reservation-section,
.final-cta-section {
    background: linear-gradient(180deg, rgba(255, 248, 239, 0.9), rgba(255, 237, 213, 0.78));
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
}

.hero-section {
    display: grid;
    gap: 28px;
    padding: 32px 20px;
    overflow: hidden;
}

.hero-section::before {
    content: "";
    position: absolute;
    inset: 18px;
    border-radius: calc(var(--radius-lg) - 10px);
    border: 1px solid rgba(255, 208, 147, 0.34);
    pointer-events: none;
}

.section-kicker {
    margin: 0 0 10px;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #c84f14;
    opacity: 0.9;
}

.hero-copy h1 {
    margin: 0;
    font-size: clamp(3.4rem, 16vw, 5.8rem);
    line-height: 0.88;
    color: #8f3e12;
}

.hero-copy h2,
.section-heading h2,
.final-cta-section h2 {
    margin: 10px 0 0;
    font-size: clamp(2rem, 7vw, 3.6rem);
    line-height: 0.95;
}

.hero-description,
.about-section p,
.reservation-copy p,
.final-cta-section p,
.testimonial-card p,
.product-content p {
    color: var(--muted);
    line-height: 1.75;
}

.hero-description,
.section-copy,
.reservation-copy p,
.final-cta-section p {
    max-width: 62ch;
}

.hero-copy {
    align-self: center;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px;
}

.horoscope-trigger-button {
    background: rgba(255, 244, 228, 0.95);
}

.primary-button,
.secondary-button,
.card-button,
.chat-form button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 12px 20px;
    border-radius: 999px;
    transition: transform var(--transition), box-shadow var(--transition), background var(--transition), color var(--transition);
}

.primary-button,
.card-button,
.chat-form button {
    color: #fff9f2;
    background: linear-gradient(135deg, #ff9b2f 0%, #ff6b2c 48%, #c94a10 100%);
    box-shadow: 0 16px 30px rgba(201, 74, 16, 0.28);
}

.secondary-button {
    color: #b54f14;
    background: rgba(255, 248, 239, 0.92);
    border: 1px solid rgba(201, 74, 16, 0.18);
}

.primary-button:hover,
.primary-button:focus-visible,
.secondary-button:hover,
.secondary-button:focus-visible,
.card-button:hover,
.card-button:focus-visible,
.chat-form button:hover,
.chat-form button:focus-visible {
    transform: translateY(-2px);
}

.hero-visual {
    display: grid;
    gap: 20px;
}

.hero-details {
    display: grid;
    gap: 14px;
    align-content: start;
}

.candle-scene {
    position: relative;
    min-height: 360px;
    display: grid;
    overflow: hidden;
    align-items: stretch;
    border-radius: calc(var(--radius-lg) - 6px);
    background:
        linear-gradient(180deg, rgba(59, 39, 23, 0.03) 0%, rgba(86, 57, 30, 0.1) 100%),
        linear-gradient(180deg, #fff7eb 0%, #ffd9ab 100%);
}

.candle-scene::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255, 241, 220, 0.08), rgba(74, 39, 14, 0.18));
}

.hero-photo {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    min-height: 360px;
    object-fit: cover;
    object-position: center 34%;
}

.hero-photo-glow {
    position: absolute;
    inset: auto 8% 18px;
    z-index: 2;
    height: 30px;
    border-radius: 999px;
    background: rgba(132, 90, 47, 0.18);
    filter: blur(10px);
}

.scene-orbit {
    position: absolute;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.36);
    backdrop-filter: blur(4px);
}

.orbit-left {
    top: 24px;
    left: 20px;
    width: 64px;
    height: 64px;
    background: radial-gradient(circle at 50% 50%, rgba(255, 248, 221, 0.64), rgba(255, 158, 77, 0.12));
}

.orbit-right {
    right: 18px;
    bottom: 38px;
    width: 88px;
    height: 88px;
    background: radial-gradient(circle at 50% 50%, rgba(255, 239, 216, 0.42), rgba(255, 172, 79, 0.12));
}

.candle {
    position: relative;
    width: 88px;
    border-radius: 22px 22px 16px 16px;
    background: linear-gradient(180deg, #fff7eb 0%, #ffd59f 72%, #f0b778 100%);
    box-shadow: inset -12px 0 18px rgba(191, 117, 45, 0.18), 0 18px 22px rgba(111, 74, 36, 0.14);
}

.candle::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 50%;
    width: 6px;
    height: 16px;
    background: #5b4230;
    border-radius: 999px;
    transform: translateX(-50%);
}

.candle-tall {
    height: 240px;
}

.candle-medium {
    height: 200px;
}

.candle-small {
    height: 156px;
}

.flame {
    position: absolute;
    top: -24px;
    left: 50%;
    width: 20px;
    height: 34px;
    transform: translateX(-50%);
    border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
    background: radial-gradient(circle at 50% 35%, #fff8d4 0%, #ffe178 34%, #ff9c29 62%, rgba(255, 111, 34, 0.22) 100%);
    box-shadow: 0 0 20px rgba(255, 168, 43, 0.95), 0 0 44px rgba(255, 137, 39, 0.38);
    animation: flicker 2.8s ease-in-out infinite;
}

.hero-badge {
    display: grid;
    gap: 4px;
    padding: 18px;
    background: rgba(255, 247, 236, 0.92);
    border: 1px solid rgba(82, 58, 36, 0.08);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-soft);
}

.hero-note {
    display: grid;
    gap: 6px;
    padding: 18px;
    border-radius: var(--radius-md);
    background: linear-gradient(180deg, rgba(255, 234, 202, 0.88), rgba(255, 248, 239, 0.94));
    border: 1px solid rgba(201, 117, 34, 0.14);
    box-shadow: var(--shadow-soft);
}

.note-label {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #c84f14;
}

.hero-badge strong {
    font-size: 1rem;
}

.hero-badge span {
    color: var(--muted);
    line-height: 1.6;
}

.about-section,
.story-section,
.reservation-section,
.final-cta-section,
.site-footer {
    padding: 28px 20px;
}

.section-heading {
    margin-bottom: 16px;
    max-width: 760px;
}

.about-highlights {
    display: grid;
    gap: 16px;
    margin-top: 24px;
}

.story-section {
    background: linear-gradient(180deg, rgba(255, 249, 242, 0.92), rgba(255, 238, 217, 0.82));
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
}

.story-grid {
    display: grid;
    gap: 18px;
}

.story-copy-card,
.story-value-card {
    padding: 22px;
    border-radius: var(--radius-md);
    background: rgba(255, 247, 236, 0.92);
    border: 1px solid rgba(201, 117, 34, 0.12);
    box-shadow: var(--shadow-soft);
}

.story-copy-card {
    display: grid;
    gap: 14px;
}

.story-copy-card p,
.story-value-card p {
    margin: 0;
    color: var(--muted);
    line-height: 1.8;
}

.story-values {
    display: grid;
    gap: 14px;
}

.story-value-card h3 {
    margin: 0 0 8px;
    font-size: 1.55rem;
}

.highlight-card {
    position: relative;
    padding: 22px;
    background: linear-gradient(180deg, rgba(255, 247, 235, 0.92), rgba(255, 239, 214, 0.86));
    border: 1px solid rgba(201, 117, 34, 0.12);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-soft);
}

.highlight-card h3 {
    margin: 8px 0;
    font-size: 1.7rem;
}

.highlight-card p {
    margin: 0;
}

.highlight-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 999px;
    background: linear-gradient(135deg, #ffcf85 0%, #ff9f46 100%);
    color: #7c330f;
    font-size: 0.9rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.products-grid,
.testimonials-grid {
    display: grid;
    gap: 18px;
}

.products-showcase-section {
    display: grid;
    gap: 22px;
}

.products-dropdown-section {
    background: linear-gradient(180deg, rgba(255, 248, 239, 0.9), rgba(255, 237, 213, 0.78));
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    overflow: hidden;
}

.products-dropdown-summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 28px 20px;
    cursor: pointer;
    transition: background var(--transition), box-shadow var(--transition);
}

.products-dropdown-summary:hover,
.products-dropdown-summary:focus-visible {
    background: rgba(255, 244, 226, 0.7);
    box-shadow: inset 0 0 0 1px rgba(201, 117, 34, 0.14);
}

.products-dropdown-hint {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 14px 0 0;
    padding: 8px 12px;
    border-radius: 999px;
    border: 1px solid rgba(201, 117, 34, 0.24);
    background: rgba(255, 232, 199, 0.9);
    color: #9a3e0f;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.03em;
}

.products-dropdown-hint::before {
    content: "\2192";
    font-size: 0.95rem;
}

.products-dropdown-summary::-webkit-details-marker {
    display: none;
}

.products-dropdown-icon {
    flex: 0 0 auto;
    width: 48px;
    height: 48px;
    border-radius: 999px;
    background: rgba(255, 245, 229, 0.95);
    border: 1px solid rgba(201, 117, 34, 0.14);
    box-shadow: var(--shadow-soft);
    position: relative;
    animation: dropdownPulse 1.6s ease-in-out infinite;
}

.products-dropdown-icon::before,
.products-dropdown-icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 2px;
    border-radius: 999px;
    background: #b14b12;
    transition: transform var(--transition);
}

.products-dropdown-icon::before {
    transform: translate(-65%, -50%) rotate(45deg);
}

.products-dropdown-icon::after {
    transform: translate(-35%, -50%) rotate(-45deg);
}

.products-dropdown-section[open] .products-dropdown-icon::before {
    transform: translate(-65%, -50%) rotate(-45deg);
}

.products-dropdown-section[open] .products-dropdown-icon::after {
    transform: translate(-35%, -50%) rotate(45deg);
}

.products-dropdown-section[open] .products-dropdown-icon {
    animation: none;
}

@keyframes dropdownPulse {
    0%,
    100% {
        transform: scale(1);
        box-shadow: var(--shadow-soft);
    }

    50% {
        transform: scale(1.08);
        box-shadow: 0 0 0 10px rgba(255, 202, 131, 0.18);
    }
}

.products-dropdown-panel {
    display: grid;
    gap: 28px;
    padding: 0 20px 28px;
}

.product-subsection {
    display: grid;
    gap: 18px;
}

.product-subsection + .product-subsection {
    padding-top: 8px;
    border-top: 1px solid rgba(201, 117, 34, 0.12);
}

.product-subsection .section-heading {
    margin-bottom: 0;
}

.product-subsection h3 {
    margin: 0;
    font-size: clamp(1.8rem, 5vw, 2.5rem);
    line-height: 0.98;
}

.products-grid-expanded {
    gap: 20px;
}

.bouquet-carousel {
    grid-column: 1 / -1;
    display: grid;
    gap: 14px;
    padding: 10px 0 4px;
}

.bouquet-heading {
    margin-bottom: 0;
}

.bouquet-carousel-shell {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 42px;
    align-items: center;
    gap: 10px;
}

.bouquet-viewport {
    overflow: hidden;
}

.bouquet-track {
    display: flex;
    transition: transform 280ms ease;
    will-change: transform;
}

.bouquet-slide {
    min-width: 100%;
}

.bouquet-zoom {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
}

.bouquet-zoom:focus-visible {
    outline: 2px solid rgba(177, 75, 18, 0.55);
    outline-offset: -2px;
}

.bouquet-nav {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    border: 1px solid rgba(201, 74, 16, 0.2);
    background: rgba(255, 244, 226, 0.94);
    color: #a84412;
    font-size: 1.2rem;
    line-height: 1;
    box-shadow: var(--shadow-soft);
    transition: transform var(--transition), background var(--transition);
}

.bouquet-nav:hover,
.bouquet-nav:focus-visible {
    transform: translateY(-1px);
    background: rgba(255, 233, 201, 0.98);
}

.bouquet-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
}

.bouquet-dot {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: rgba(177, 75, 18, 0.25);
}

.bouquet-dot.is-active {
    background: rgba(177, 75, 18, 0.8);
}

.bouquet-lightbox {
    position: fixed;
    inset: 0;
    z-index: 95;
    display: grid;
    place-items: center;
    padding: 16px;
    background: rgba(39, 22, 14, 0.74);
}

.bouquet-lightbox-card {
    position: relative;
    width: min(92vw, 920px);
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid rgba(255, 224, 186, 0.35);
    box-shadow: 0 22px 52px rgba(0, 0, 0, 0.36);
    background: rgba(255, 246, 234, 0.98);
}

.bouquet-lightbox-image {
    width: 100%;
    max-height: 86vh;
    object-fit: contain;
    background: radial-gradient(circle at top, #ffe9c8, #ffd9a2);
}

.bouquet-lightbox-close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 40px;
    height: 40px;
    border-radius: 999px;
    border: 1px solid rgba(201, 74, 16, 0.22);
    background: rgba(255, 250, 243, 0.92);
    color: #8f3e12;
    font-size: 1.5rem;
    line-height: 1;
}

.section-copy {
    max-width: 680px;
    margin: 12px 0 0;
    color: var(--muted);
    line-height: 1.75;
}

.testimonials-carousel {
    position: relative;
    display: grid;
    gap: 16px;
}

.testimonials-viewport {
    position: relative;
    min-height: 230px;
    overflow: hidden;
}

.testimonials-track {
    position: relative;
    min-height: 230px;
}

.product-card,
.testimonial-card {
    background: rgba(255, 247, 236, 0.92);
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-soft);
    overflow: hidden;
}

.product-card {
    position: relative;
    transition: transform var(--transition), box-shadow var(--transition);
}

.product-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 30%, rgba(255, 243, 223, 0.16) 100%);
    pointer-events: none;
}

.product-card:hover,
.product-card:focus-within {
    transform: translateY(-4px);
    box-shadow: 0 24px 42px rgba(201, 90, 20, 0.18);
}

.product-image {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    background: linear-gradient(135deg, #ffe4b6 0%, #ffc173 100%);
}

.product-content {
    display: grid;
    gap: 12px;
    padding: 22px;
}

.product-actions-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 52px;
    gap: 10px;
    align-items: stretch;
}

.cart-add-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    border-radius: 18px;
    background: rgba(255, 242, 221, 0.98);
    border: 1px solid rgba(201, 74, 16, 0.18);
    color: #b14b12;
    font-size: 1.5rem;
    font-weight: 700;
    transition: transform var(--transition), background var(--transition);
}

.cart-add-button:hover,
.cart-add-button:focus-visible {
    transform: translateY(-2px);
    background: rgba(255, 232, 199, 0.98);
}

.product-content h3,
.testimonial-card footer {
    margin: 0;
    font-size: 1.8rem;
}

.product-content h3 {
    line-height: 0.95;
}

.reservation-section {
    display: grid;
    gap: 24px;
}

.reservation-points {
    margin: 20px 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 12px;
}

.reservation-points li {
    position: relative;
    padding-left: 18px;
    color: var(--muted);
}

.reservation-points li::before {
    content: "";
    position: absolute;
    top: 11px;
    left: 0;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--accent);
}

.reservation-form {
    padding: 22px;
    background: rgba(255, 249, 242, 0.9);
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-soft);
}

.form-grid {
    display: grid;
    gap: 16px;
    margin-bottom: 18px;
}

.reservation-form label {
    display: grid;
    gap: 8px;
    font-size: 0.95rem;
    font-weight: 600;
    color: #5e4334;
}

.reservation-form input,
.reservation-form select,
.reservation-form textarea,
.chat-form input {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid rgba(82, 58, 36, 0.12);
    border-radius: 16px;
    background: rgba(255, 250, 243, 0.96);
    color: var(--text);
    transition: border-color var(--transition), box-shadow var(--transition);
}

.reservation-form input:focus,
.reservation-form select:focus,
.reservation-form textarea:focus,
.chat-form input:focus {
    outline: none;
    border-color: rgba(185, 138, 75, 0.8);
    box-shadow: 0 0 0 4px rgba(185, 138, 75, 0.14);
}

.full-width {
    grid-column: 1 / -1;
}

.form-success {
    margin: 16px 0 0;
    padding: 14px 16px;
    border-radius: 16px;
    background: rgba(255, 223, 184, 0.8);
    color: #8a420d;
    border: 1px solid rgba(201, 117, 34, 0.14);
}

.testimonial-card {
    padding: 24px;
}

.testimonial-slide {
    position: absolute;
    inset: 0;
    display: grid;
    align-content: center;
    opacity: 0;
    transform: translateX(30px) scale(0.98);
    transition: opacity 420ms ease, transform 420ms ease;
    pointer-events: none;
}

.testimonial-slide.is-active {
    opacity: 1;
    transform: translateX(0) scale(1);
    pointer-events: auto;
}

.testimonial-card p {
    font-size: 1.02rem;
}

.testimonial-card footer {
    margin-top: 18px;
    color: var(--accent-deep);
}

.testimonials-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
}

.testimonial-dot {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: rgba(197, 90, 17, 0.22);
    transition: transform var(--transition), background var(--transition);
}

.testimonial-dot.is-active {
    background: linear-gradient(135deg, #ff9b2f 0%, #c94a10 100%);
    transform: scale(1.25);
}

.final-cta-section {
    display: grid;
    gap: 20px;
    align-items: center;
}

.site-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 110px;
    color: var(--muted);
}

.footer-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ceo-access-button {
    min-height: 34px;
    padding: 8px 12px;
    border-radius: 999px;
    border: 1px solid rgba(82, 58, 36, 0.12);
    background: rgba(255, 255, 255, 0.08);
    color: rgba(71, 42, 24, 0.58);
    backdrop-filter: blur(8px);
    box-shadow: none;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.72;
}

.ceo-access-button:hover,
.ceo-access-button:focus-visible {
    background: rgba(255, 255, 255, 0.16);
    opacity: 1;
}

.footer-brand {
    margin: 0 0 6px;
    color: var(--text);
    font-size: 2rem;
}

.site-footer p:last-child {
    margin: 0;
}

.footer-links {
    display: flex;
    gap: 12px;
}

.footer-links a,
.floating-whatsapp,
.chat-toggle,
.floating-install,
.floating-cart {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 999px;
    background: rgba(255, 246, 232, 0.94);
    border: 1px solid rgba(82, 58, 36, 0.12);
    box-shadow: var(--shadow-soft);
}

.floating-whatsapp,
.chat-widget,
.floating-install,
.floating-cart {
    position: fixed;
    bottom: 20px;
    z-index: 40;
}

.floating-cart {
    left: 20px;
    bottom: 88px;
    right: auto;
    background: linear-gradient(135deg, #fff4de 0%, #ffd89f 100%);
}

.floating-cart-icon {
    display: block;
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a84a15' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.4'/%3E%3Ccircle cx='18' cy='20' r='1.4'/%3E%3Cpath d='M3 4h2l2.2 10.3a1 1 0 0 0 1 .7h8.9a1 1 0 0 0 1-.8L20 7H7.4'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.floating-cart-count {
    position: absolute;
    top: -6px;
    right: -3px;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #c94a10;
    color: #fff8f0;
    font-size: 0.75rem;
    font-weight: 800;
}

.floating-install {
    left: 50%;
    transform: translateX(-50%);
    width: auto;
    min-width: 176px;
    padding: 0 18px;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: #fff9f2;
    background: linear-gradient(135deg, #ffb24e 0%, #ff8b2d 48%, #d5550f 100%);
    box-shadow: 0 16px 30px rgba(201, 74, 16, 0.24);
}

.floating-install:hover,
.floating-install:focus-visible {
    transform: translateX(-50%) translateY(-2px);
}

.floating-whatsapp {
    right: 20px;
}

.chat-widget {
    left: 20px;
}

.chat-toggle {
    position: relative;
    background: linear-gradient(135deg, #ffd88f 0%, #ffb25a 55%, #ff8440 100%);
}

.chat-toggle-badge {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 24px;
    height: 24px;
    padding: 0 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: linear-gradient(135deg, #8f3e12 0%, #c94a10 100%);
    color: #fff9f2;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    box-shadow: 0 10px 18px rgba(92, 34, 6, 0.22);
}

.chat-panel {
    position: absolute;
    bottom: 70px;
    left: 0;
    width: min(340px, calc(100vw - 32px));
    background: rgba(255, 248, 239, 0.97);
    border: 1px solid rgba(82, 58, 36, 0.1);
    border-radius: 24px;
    box-shadow: 0 28px 60px rgba(61, 41, 24, 0.18);
    overflow: hidden;
}

.horoscope-modal {
    position: fixed;
    inset: 0;
    z-index: 45;
    display: grid;
    align-items: end;
    justify-items: center;
    padding: 20px 16px 132px;
    background: rgba(47, 31, 22, 0.24);
    backdrop-filter: blur(10px);
}

.horoscope-modal-card {
    position: relative;
    width: min(380px, 100%);
    max-width: 380px;
    justify-self: center;
    display: grid;
    gap: 16px;
    padding: 22px 20px 20px;
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(255, 249, 240, 0.98), rgba(255, 234, 208, 0.96));
    border: 1px solid rgba(201, 117, 34, 0.16);
    box-shadow: 0 28px 60px rgba(61, 41, 24, 0.22);
    backdrop-filter: blur(18px);
}

.horoscope-image {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: 18px;
    border: 1px solid rgba(201, 117, 34, 0.14);
    box-shadow: var(--shadow-soft);
}

.horoscope-title-row {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    align-items: start;
}

.horoscope-symbol {
    width: 50px;
    height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: linear-gradient(135deg, #ffcf85 0%, #ff9742 100%);
    color: #7c330f;
    font-size: 1.35rem;
    box-shadow: var(--shadow-soft);
}

.horoscope-title-row h2 {
    margin: 0;
    font-size: clamp(1.9rem, 7vw, 2.6rem);
    line-height: 0.95;
}

.horoscope-title-row p {
    margin: 10px 0 0;
    color: var(--muted);
    line-height: 1.7;
}

.horoscope-button {
    width: 100%;
}

.horoscope-close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(255, 250, 243, 0.95);
    color: var(--accent-deep);
    font-size: 1.3rem;
    touch-action: manipulation;
}

.ceo-panel {
    position: fixed;
    inset: 0;
    z-index: 60;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(47, 31, 22, 0.32);
    backdrop-filter: blur(10px);
}

.cart-panel {
    position: fixed;
    inset: 0;
    z-index: 55;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(47, 31, 22, 0.22);
    backdrop-filter: blur(10px);
}

.cart-card {
    width: min(560px, 100%);
    max-height: min(88vh, 900px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 18px;
    overflow: hidden;
    padding: 24px;
    border-radius: 28px;
    background: linear-gradient(180deg, rgba(255, 250, 244, 0.98), rgba(255, 240, 219, 0.96));
    border: 1px solid rgba(201, 117, 34, 0.16);
    box-shadow: 0 26px 60px rgba(61, 41, 24, 0.22);
}

.cart-card,
.ceo-card,
.chat-panel {
    backdrop-filter: blur(18px);
}

.cart-header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 16px;
}

.cart-header h2 {
    margin: 0;
    font-size: clamp(2rem, 6vw, 3rem);
}

.cart-items {
    display: grid;
    gap: 12px;
    overflow-y: auto;
    min-height: 120px;
}

.cart-empty {
    margin: 0;
    padding: 18px;
    border-radius: 18px;
    background: rgba(255, 247, 236, 0.92);
    color: var(--muted);
}

.cart-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 16px 18px;
    border-radius: 20px;
    background: rgba(255, 247, 236, 0.92);
    border: 1px solid var(--line);
}

.cart-item strong,
.cart-total strong {
    color: #8f3e12;
}

.cart-item p,
.cart-total {
    margin: 0;
    color: var(--muted);
    font-weight: 600;
}

.cart-item-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.cart-qty-button {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(255, 232, 199, 0.98);
    border: 1px solid rgba(201, 74, 16, 0.16);
    color: #a84a15;
    font-weight: 800;
}

.cart-qty-value {
    min-width: 26px;
    text-align: center;
    font-weight: 700;
    color: #8f3e12;
}

.cart-footer {
    display: grid;
    gap: 14px;
}

.cart-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.ceo-card {
    width: min(920px, 100%);
    max-height: min(88vh, 920px);
    overflow-y: auto;
    padding: 24px;
    border-radius: 28px;
    background: linear-gradient(180deg, rgba(255, 250, 244, 0.97), rgba(255, 240, 219, 0.95));
    border: 1px solid rgba(201, 117, 34, 0.16);
    box-shadow: 0 26px 60px rgba(61, 41, 24, 0.22);
}

.ceo-header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.ceo-kicker {
    margin: 0 0 6px;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #c84f14;
}

.ceo-header h2 {
    margin: 0;
    font-size: clamp(2rem, 6vw, 3.2rem);
}

.ceo-close {
    min-width: 42px;
    min-height: 42px;
    border-radius: 999px;
    background: rgba(255, 250, 243, 0.95);
    color: var(--accent-deep);
    font-size: 1.6rem;
}

.ceo-login {
    display: grid;
    gap: 14px;
}

.ceo-login label {
    display: grid;
    gap: 8px;
    font-size: 0.95rem;
    font-weight: 600;
}

.ceo-login input {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid rgba(82, 58, 36, 0.12);
    border-radius: 16px;
    background: rgba(255, 250, 243, 0.96);
}

.ceo-content {
    display: grid;
    gap: 18px;
}

.ceo-metrics-grid,
.ceo-growth-grid {
    display: grid;
    gap: 14px;
}

.ceo-metric-card,
.ceo-growth-card {
    display: grid;
    gap: 8px;
    padding: 18px;
    border-radius: 20px;
    background: rgba(255, 248, 239, 0.92);
    border: 1px solid rgba(201, 117, 34, 0.12);
    box-shadow: var(--shadow-soft);
}

.ceo-metric-card-highlight {
    background: linear-gradient(135deg, rgba(255, 223, 184, 0.94), rgba(255, 244, 228, 0.98));
    border-color: rgba(201, 74, 16, 0.22);
    box-shadow: 0 18px 36px rgba(201, 90, 20, 0.16);
}

.ceo-metric-card-highlight strong {
    color: #a84412;
}

.ceo-metric-card span,
.ceo-growth-card span {
    color: var(--muted);
    font-size: 0.9rem;
}

.ceo-metric-card strong,
.ceo-growth-card strong {
    font-family: "Cormorant Garamond", serif;
    font-size: 2.2rem;
    color: #8f3e12;
}

.ceo-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.ceo-reset-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 12px 20px;
    border-radius: 999px;
    color: #fff9f2;
    background: linear-gradient(135deg, #8f3e12 0%, #5c2206 100%);
    box-shadow: 0 16px 30px rgba(92, 34, 6, 0.22);
}

.chat-header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
    padding: 18px;
    background: linear-gradient(180deg, rgba(255, 221, 177, 0.88), rgba(255, 247, 236, 0.82));
}

.chat-title,
.chat-subtitle,
.chat-close {
    margin: 0;
}

.chat-title {
    font-size: 1.6rem;
}

.chat-subtitle {
    margin-top: 4px;
    font-size: 0.88rem;
    color: var(--muted);
    line-height: 1.55;
}

.chat-close {
    min-width: 36px;
    min-height: 36px;
    border-radius: 999px;
    background: rgba(255, 250, 243, 0.95);
    color: var(--accent-deep);
    font-size: 1.4rem;
}

.chat-messages {
    max-height: 280px;
    overflow-y: auto;
    display: grid;
    gap: 10px;
    padding: 18px;
}

.message {
    max-width: 85%;
    padding: 12px 14px;
    border-radius: 18px;
    line-height: 1.6;
    font-size: 0.95rem;
    box-shadow: var(--shadow-soft);
}

.bot-message {
    background: rgba(255, 226, 182, 0.78);
}

.user-message {
    margin-left: auto;
    background: linear-gradient(135deg, #ff9b2f 0%, #ff6b2c 48%, #c94a10 100%);
    color: #fff8f0;
}

.chat-form {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    padding: 0 18px 18px;
}

.chat-quick-prompts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 18px 12px;
}

.chat-quick-prompt {
    padding: 8px 12px;
    border-radius: 999px;
    border: 1px solid rgba(201, 117, 34, 0.24);
    background: rgba(255, 244, 225, 0.9);
    color: #9a3e0f;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    transition: transform var(--transition), background var(--transition);
}

.chat-quick-prompt:hover,
.chat-quick-prompt:focus-visible {
    transform: translateY(-1px);
    background: rgba(255, 230, 195, 0.95);
}

.social-icon,
.whatsapp-icon,
.chatbot-icon {
    display: block;
    width: 24px;
    height: 24px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.social-icon-instagram {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238b6331' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1' fill='%238b6331' stroke='none'/%3E%3C/svg%3E");
}

.social-icon-whatsapp,
.whatsapp-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238b6331' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11.5A8.5 8.5 0 0 1 7.5 19L4 20l1.2-3.2A8.5 8.5 0 1 1 20 11.5Z'/%3E%3Cpath d='M9 8.8c.2-.4.4-.4.7-.4h.6c.2 0 .5 0 .7.4l.6 1.5c.1.2.1.5 0 .7l-.5 1c-.1.2-.1.4 0 .6.4.7 1 1.4 1.7 1.8.2.1.4.1.6 0l.9-.5c.2-.1.5-.1.7 0l1.6.7c.4.2.4.4.4.7v.6c0 .3 0 .5-.4.7-.5.2-1 .4-1.6.4-1.3 0-2.7-.5-4.1-1.9-1.6-1.5-2.3-3.2-2.3-4.6 0-.5.1-1 .3-1.4Z'/%3E%3C/svg%3E");
}

.chatbot-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238b6331' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5' width='16' height='12' rx='4'/%3E%3Cpath d='M9 21h6'/%3E%3Cpath d='M12 17v4'/%3E%3Ccircle cx='9' cy='11' r='1' fill='%238b6331' stroke='none'/%3E%3Ccircle cx='15' cy='11' r='1' fill='%238b6331' stroke='none'/%3E%3Cpath d='M8.5 14c1 .8 2.1 1.2 3.5 1.2s2.5-.4 3.5-1.2'/%3E%3C/svg%3E");
}

.reveal-up {
    opacity: 0;
    transform: translateY(24px);
    animation: revealUp 0.8s ease forwards;
}

.delay-1 {
    animation-delay: 0.12s;
}

.delay-2 {
    animation-delay: 0.24s;
}

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

@keyframes flicker {
    0%,
    100% {
        transform: translateX(-50%) scale(1) rotate(-2deg);
        opacity: 0.96;
    }

    50% {
        transform: translateX(-48%) scale(1.06) rotate(3deg);
        opacity: 1;
    }
}

@media (min-width: 720px) {
    .site-nav {
        display: flex;
    }

    .hero-section,
    .reservation-section,
    .final-cta-section {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: center;
    }

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

    .products-dropdown-summary,
    .products-dropdown-panel {
        padding-left: 28px;
        padding-right: 28px;
    }

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

    .bouquet-carousel-shell {
        grid-template-columns: 48px minmax(0, 1fr) 48px;
        gap: 14px;
    }

    .bouquet-nav {
        width: 48px;
        height: 48px;
    }

    .candle-scene,
    .hero-photo {
        min-height: 430px;
    }

    .hero-photo {
        object-position: center 38%;
    }

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

    .story-grid {
        grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
        align-items: start;
    }

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

    .site-footer {
        margin-bottom: 34px;
    }

    .floating-install {
        left: auto;
        right: 20px;
        transform: none;
    }

    .floating-cart {
        left: auto;
        right: 20px;
        bottom: 92px;
    }

    .floating-install:hover,
    .floating-install:focus-visible {
        transform: translateY(-2px);
    }

    .horoscope-modal {
        justify-items: end;
        padding: 20px 20px 164px;
    }

    .horoscope-modal-card {
        justify-self: end;
    }

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

@media (min-width: 980px) {
    .hero-section,
    .about-section,
    .reservation-section,
    .final-cta-section,
    .site-footer {
        padding: 40px;
    }

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

    .products-dropdown-summary {
        padding: 34px 40px;
    }

    .products-dropdown-panel {
        padding: 0 40px 36px;
    }

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

    .hero-section {
        padding: 44px 40px;
    }

    .candle-scene,
    .hero-photo {
        min-height: 520px;
    }

    .hero-photo {
        object-position: center 42%;
    }

    .ceo-metrics-grid,
    .ceo-growth-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

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

    .reveal-up {
        opacity: 1 !important;
        transform: none !important;
    }

    *,
    *::before,
    *::after {
        animation: none !important;
        transition: none !important;
    }
}