.hp {
    --hp-ink: #4a291f;
    --hp-title: #532d22;
    --hp-gold: #b38b43;
    --hp-gold-dark: #9c702e;
    --hp-text: #5d4d46;
    --hp-muted: #966f56;
    --hp-cream: #fffaf5;
    --hp-peach: #fbe0cb;
    --hp-line: #e4c8b0;
    --hp-serif: "Libre Bodoni", Georgia, "Times New Roman", serif;
    background: var(--hp-cream);
    color: var(--hp-text);
    font-family: "Nunito", -apple-system, Roboto, Helvetica, sans-serif;
    line-height: 1.8;
    overflow: hidden;
}
.hp-inner, .hp > section:not(.hp-hero):not(.hp-band):not(.hp-cta) { max-width: 1200px; margin-left: auto; margin-right: auto; padding-left: 40px; padding-right: 40px; }
.hp-h2 { font: 400 clamp(28px, 3.2vw, 40px) / 1.2 var(--hp-serif); color: var(--hp-gold-dark); margin: 0 0 24px; }

/* Top strip: text only (the logos in the mockup are not used) */
.hp-mark { padding: 34px 20px 28px; text-align: center; border-bottom: 1px solid #d8b790; background: linear-gradient(110deg, #fffaf5 2%, #fbeddf 50%, #fffaf5 100%); }
.hp-logos { display: flex; align-items: center; justify-content: center; gap: 56px; margin-bottom: 24px; }
.hp-logo-rney { display: inline-flex; flex-direction: column; align-items: center; gap: 6px; }
.hp-logo-rney img { width: 96px; height: auto; }
.hp-logo-rney span { font-family: Quicksand, sans-serif; font-size: 34px; font-weight: 600; line-height: 1; text-transform: uppercase; letter-spacing: .14em; color: #c7a756; padding-left: .14em; }
.hp-logo-fa { height: 100px; width: auto; }
.hp-mark-text { display: inline-flex; align-items: center; gap: 20px; font-size: 15px; font-weight: 800; letter-spacing: .38em; text-transform: uppercase; color: #9d682c; }
.hp-mark-text::before, .hp-mark-text::after { content: ''; height: 1px; width: 100px; background: #c99e62; }

/* Hero */
.hp-hero { position: relative; overflow: hidden; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 24px; min-height: 560px; padding: 48px max(40px, calc((100% - 1200px) / 2)) 56px; background: radial-gradient(circle at 16% 30%, #f7c6ae 0%, transparent 38%), radial-gradient(circle at 86% 72%, #fff3e2 0%, transparent 45%), linear-gradient(125deg, #fbe0cb, #fff5e7 72%); }
.hp-hero::before { content: ''; position: absolute; width: 710px; height: 710px; border: 1px solid rgba(213, 161, 106, .36); border-radius: 50%; left: -80px; top: -125px; pointer-events: none; }
.hp-hero-media { position: relative; z-index: 1; text-align: center; }
.hp-bottle { display: block; width: 100%; max-width: 620px; height: auto; margin: 0 auto; filter: drop-shadow(0 20px 22px rgba(169, 103, 72, .28)); }
.hp-hero-text { position: relative; z-index: 1; padding-left: 32px; }
.hp-title { font: 400 clamp(52px, 7vw, 91px) / .95 var(--hp-serif); letter-spacing: -.02em; margin: 0; color: var(--hp-title); }
.hp-rule { height: 2px; width: 95%; margin: 26px 0; background: linear-gradient(90deg, #bd8b4a, rgba(188, 146, 85, .35)); }
.hp-subtitle { margin: 0; font-size: 15px; letter-spacing: .26em; text-transform: uppercase; color: var(--hp-muted); }

/* Section blocks */
.hp-section { padding-top: 64px; padding-bottom: 64px; }
.hp-split { display: grid; grid-template-columns: .9fr 1.1fr; gap: 64px; align-items: center; }
.hp-journey p { font-size: 18px; line-height: 1.86; margin: 0; }

.hp-photo { display: block; width: 100%; max-width: 425px; height: auto; margin: 0 auto; border-radius: 8px; box-shadow: 0 14px 32px rgba(87, 52, 32, .16); }

/* Gallery carousel (shared brand carousel, framed like the mockup) */
.hp-gallery { max-width: 620px; width: 100%; margin: 0 auto; padding: 14px; background: #fff; border: 1px solid #ead2bd; border-radius: 12px; box-shadow: 0 18px 40px rgba(152, 96, 70, .16); box-sizing: border-box; }
.hp-gallery .product-showcase { margin: 0; padding: 0; }
.hp-gallery .carousel-container { margin-bottom: 0; min-height: 0; aspect-ratio: 4 / 5; height: auto; border-radius: 6px; background: #fbf3ea; }
.hp-gallery .carousel-track { height: 100%; }
.hp-gallery .carousel-slide { height: 100%; max-height: none; }
.hp-gallery .carousel-slide img { height: 100%; width: 100%; object-fit: contain; background: transparent; border-radius: 0; box-sizing: border-box; padding: 6px 6px 42px; }
.hp-gallery .carousel-button { width: 42px; height: 42px; background: rgba(255, 255, 255, .95); box-shadow: 0 2px 10px rgba(66, 44, 43, .25); }
.hp-gallery .carousel-button:hover, .hp-gallery .carousel-button:focus, .hp-gallery .carousel-button:active { background: #c7a756; color: #fff; outline: none; }
.hp-gallery .carousel-button:focus-visible { box-shadow: 0 0 0 3px rgba(199, 167, 86, .45); }
.hp-gallery .carousel-button.prev { left: 12px; }
.hp-gallery .carousel-button.next { right: 12px; }
.hp-gallery .carousel-slide img[src*="lifestyle"] { object-fit: cover; padding: 0; }
.hp-gallery .carousel-indicators { bottom: 12px; gap: 8px; padding: 7px 12px; border-radius: 14px; background: rgba(255, 255, 255, .78); }
.hp-gallery .indicator { width: 9px; height: 9px; background: rgba(156, 112, 46, .3); }
.hp-gallery .indicator.active { width: 22px; border-radius: 6px; background: #b38b43; }

/* Notes: a real table, stacked into cards on narrow screens */
.hp-band { padding: 64px 0; }
.hp-band-notes { background: linear-gradient(180deg, #fff1e7, #fffbf8); border-top: 1px solid #ead5c3; border-bottom: 1px solid #ead5c3; }
.hp-band-event { background: #f8e7d8; }
.hp-notes { width: 100%; border-collapse: collapse; background: #fffaf7; border-top: 2px solid #c6a061; border-bottom: 2px solid #e0c8b1; box-shadow: 0 4px 22px rgba(189, 129, 92, .06); }
.hp-notes thead th { padding: 18px 17px; background: #f9ece0; color: #926830; font-size: 13px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; text-align: left; }
.hp-notes tbody th, .hp-notes tbody td { padding: 20px 16px; border-top: 1px solid #e4d1c3; vertical-align: middle; text-align: left; font-size: 16px; line-height: 1.6; color: #624e42; }
.hp-notes tbody th { width: 24%; font-weight: normal; }
.hp-notes tbody td:nth-child(2) { width: 38%; }
.hp-note-level { display: block; font-weight: 800; font-size: 17px; color: #5f3227; }
.hp-note-sub { display: block; font: italic 400 14px var(--hp-serif); color: #816858; }
.hp-note-pics { display: flex; gap: 6px; margin-bottom: 8px; }
.hp-note-pics img { width: 82px; height: 84px; object-fit: cover; border-radius: 8px; mix-blend-mode: multiply; }
.hp-note-list { display: block; font-weight: 800; color: #a9673e; }

/* Event */
.hp-event { grid-template-columns: .78fr 1fr; gap: 90px; }
.hp-quote { margin: 0 0 24px; font: italic 400 clamp(24px, 2.6vw, 34px) / 1.4 var(--hp-serif); color: #8a5439; }
.hp-event-note { margin: 0; color: #9b6f42; letter-spacing: .18em; text-transform: uppercase; font-size: 15px; }

/* Accordions */
.hp-acc { border: 1px solid #e5cdb5; border-radius: 8px; margin-top: 13px; background: #fff6ee; overflow: hidden; }
.hp-acc summary { cursor: pointer; padding: 18px 22px; font-weight: 800; font-size: 17px; color: #8b6433; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.hp-acc summary::-webkit-details-marker { display: none; }
.hp-acc summary::after { content: '+'; font-size: 26px; line-height: 1; color: #ab7b34; }
.hp-acc[open] summary::after { content: '\2212'; }
.hp-acc-body { padding: 0 22px 18px; color: #60463b; line-height: 1.7; }
.hp-acc-body p { margin: 0 0 12px; }
.hp-acc-body a { color: var(--hp-gold-dark); text-decoration: none; }
.hp-acc-body a:hover { color: var(--hp-title); text-decoration: none; }
.hp-about-text h3 { margin: 6px 0 12px; font: 400 24px var(--hp-serif); color: var(--hp-title); }

/* CTA */
.hp-cta { position: relative; overflow: hidden; text-align: center; padding: 96px 24px 100px; background: radial-gradient(ellipse at 15% 80%, #f6ccb7 0%, transparent 42%), radial-gradient(ellipse at 90% 20%, #fae1cb 0%, transparent 43%), #fff1e7; }
.hp-cta::before, .hp-cta::after { content: ''; position: absolute; width: 220px; height: 220px; border: 1px solid rgba(213, 166, 125, .53); border-radius: 50%; pointer-events: none; }
.hp-cta::before { left: -100px; bottom: -115px; }
.hp-cta::after { right: -90px; top: -145px; }
.hp-cta-title { position: relative; font: 400 clamp(30px, 4vw, 49px) / 1.2 var(--hp-serif); color: #633425; margin: 0 auto 32px; max-width: 760px; }
.hp-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; min-height: 60px; padding: 16px 44px; background: #c69d54; border: 1px solid #a98442; color: #1e150f; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; border-radius: 3px; text-decoration: none; box-shadow: 0 9px 25px rgba(145, 104, 62, .16); }
.hp-btn:hover { background: #b98f45; color: #1e150f; text-decoration: none; }

/* Tablet */
@media (max-width: 991px) {
    .hp-split, .hp-event { gap: 44px; }
    .hp-hero-text { padding-left: 8px; }
    .hp-notes tbody th, .hp-notes tbody td { padding: 16px 12px; }
}

/* Phone */
@media (max-width: 767px) {
    .hp-inner, .hp > section:not(.hp-hero):not(.hp-band):not(.hp-cta) { padding-left: 20px; padding-right: 20px; }
    .hp-mark { padding: 62px 12px 18px; } /* clears the site-wide floating "Our Catalog" pill */
    .hp-logos { gap: 24px; margin-bottom: 16px; }
    .hp-logo-rney img { width: 66px; }
    .hp-logo-rney span { font-size: 24px; }
    .hp-logo-fa { height: 64px; }
    .hp-mark-text { gap: 10px; font-size: 11px; letter-spacing: .2em; }
    .hp-mark-text::before, .hp-mark-text::after { width: 22px; }

    .hp-hero { grid-template-columns: 1fr; gap: 8px; min-height: 0; padding: 32px 20px 44px; text-align: center; }
    .hp-hero::before { width: 420px; height: 420px; left: -140px; top: -170px; }
    .hp-bottle { max-width: 440px; }
    .hp-hero-text { padding: 0; }
    .hp-rule { width: 70px; margin: 18px auto; }
    .hp-subtitle { font-size: 12px; letter-spacing: .16em; }

    .hp-section { padding-top: 40px; padding-bottom: 40px; }
    .hp-split, .hp-event { grid-template-columns: 1fr; gap: 28px; }
    .hp-journey p { font-size: 16px; line-height: 1.75; }
    .hp-gallery { max-width: 440px; padding: 8px; border-radius: 10px; }
    .hp-gallery .carousel-button { width: 36px; height: 36px; }
    .hp-gallery .carousel-button.prev { left: 8px; }
    .hp-gallery .carousel-button.next { right: 8px; }
    .hp-gallery .carousel-slide img { padding-bottom: 38px; }
    .hp-gallery .carousel-slide img[src*="lifestyle"] { padding: 0; }

    .hp-band { padding: 44px 0; }
    .hp-notes, .hp-notes tbody, .hp-notes tr, .hp-notes tbody th, .hp-notes tbody td { display: block; width: 100%; box-sizing: border-box; }
    .hp-notes { background: transparent; border: 0; box-shadow: none; }
    .hp-notes thead { display: none; }
    .hp-notes tr { margin-bottom: 16px; background: #fffaf7; border: 1px solid #e4d1c3; border-top: 2px solid #c6a061; border-radius: 8px; padding: 6px 4px; }
    .hp-notes tbody th, .hp-notes tbody td { border: 0; padding: 10px 14px; width: 100%; }
    .hp-notes tbody td:nth-child(2) { width: 100%; }
    .hp-note-pics img { width: 64px; height: 66px; }
    .hp-notes td::before { content: attr(data-label); display: block; font-size: 11px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #926830; margin-bottom: 6px; }

    .hp-event { text-align: center; }
    .hp-quote { margin-bottom: 14px; }
    .hp-event-note { font-size: 13px; }

    .hp-cta { padding: 64px 20px 68px; }
    .hp-btn { width: 100%; max-width: 360px; padding: 16px 20px; }
}
