/* Chateaublond: warm dark surfaces, champagne accents and an editorial gallery. */
:root {
  --cream: #f5efe4;
  --paper: #faf6ee;
  --ink: #30251d;
  --muted: #756858;
  --gold: #897047;
  --line: #dfd2be;
  --dark: #191510;
  --champagne: #d7bd8b;
  --night-text: #efe6d7;
  --night-muted: #b8aa94;
}

body { background: var(--dark); }
::selection { background: #ad8d55; color: #fff9ef; }
.private-banner { height: 27px; background: #231d16; color: #b8a68b; font-size: 9px; letter-spacing: .14em; }
.site-header { height: 106px; background: #191510f5; color: var(--night-text); border-bottom-color: #a1844933; backdrop-filter: blur(16px); }
.brand { flex-direction: row; align-items: center; gap: 16px; }
.brand-lockup { display: flex; flex-direction: column; gap: 10px; }
.brand-crest { width: 47px; height: auto; mix-blend-mode: screen; filter: invert(1) sepia(1) saturate(.55) hue-rotate(355deg) brightness(.85); }
.brand-name { font-size: 30px; letter-spacing: .1px; }
.brand-sub { color: var(--champagne); font-size: 7px; letter-spacing: 1.9px; font-weight: 400; }
.site-header nav { gap: 30px; font-size: 12px; letter-spacing: 1.1px; }
.site-header nav a { color: #ccbea8; }
.site-header nav a:hover { color: var(--champagne); }
.site-header nav a::after { background: var(--champagne); }
.header-cta { color: var(--champagne); border-bottom-color: #b0936066; font-size: 10px; letter-spacing: .8px; gap: 28px; }
.menu-toggle { border-color: #b5965d55; }
.menu-toggle span { background: var(--champagne); }
.mobile-nav { background: #201a13; color: var(--night-text); border-bottom-color: #a1844955; }
.mobile-nav a { border-bottom: 1px solid #a184491f; font-family: var(--serif); font-size: 21px; }

.hero { background: radial-gradient(ellipse at 78% 37%, #38291d 0, #211a13 38%, #191510 72%); color: var(--night-text); }
.hero-copy { padding-top: 84px; padding-bottom: 65px; }
.hero-copy .eyebrow { color: var(--champagne); font-size: 9px; letter-spacing: 2.5px; }
.little-line { background: var(--champagne); width: 34px; }
h1 { font-size: clamp(55px, 5.1vw, 84px); letter-spacing: -2.7px; line-height: 1.02; margin-top: 35px; }
h1 em { color: var(--champagne); font-size: .73em; letter-spacing: -1.9px; margin-top: 18px; }
.hero-description { color: var(--night-muted); max-width: 360px; font-size: 13px; line-height: 2; margin-top: 29px; }
.button-dark { color: #241d13; background: linear-gradient(120deg, #e4d2ae, #c3a16a); min-height: 56px; margin-top: 32px; padding: 17px 25px; font-size: 10px; letter-spacing: 1.1px; border: 1px solid #e3cd9b; box-shadow: 0 6px 25px #00000020; }
.button-dark:hover { background: linear-gradient(120deg, #efdfbd, #d3b17a); transform: translateY(-2px); box-shadow: 0 7px 25px #c4a46518; }
.hero-origin { margin-top: 43px; color: #b7a182; font-size: 7px; letter-spacing: 1.7px; }
.origin-dot { background: var(--champagne); }
.origin-divider { background: #a1844960; }
.hero-visual { min-height: 685px; background: radial-gradient(ellipse at 49% 58%, #ac81523a 0, #5e452628 37%, transparent 65%); }
.hero-visual::before { content: ''; position: absolute; inset: 22px 22px 65px; border: 1px solid #c6a16528; border-radius: 48% 48% 0 0; z-index: -1; }
.hero-visual::after { content: ''; position: absolute; left: 7%; right: 7%; bottom: 79px; height: 1px; background: linear-gradient(90deg, transparent, #bc9c60a0, transparent); }
.hero-circle { width: 490px; height: 490px; top: 110px; border-color: #c9a56b38; opacity: .6; }
.hero-circle::after { border-color: #c9a56b38; }
.hero-year { color: #d6bc87; opacity: .13; font-size: 114px; top: 49px; letter-spacing: 11px; }
.bottle-stage { inset: 164px 20px 109px; }
.bottle-stage::after { left: 9%; right: 9%; bottom: -4px; height: 18px; background: #030200; filter: blur(13px); opacity: .8; }
.hero-bottle { filter: drop-shadow(13px 20px 10px #00000060); }
.bottle-left { height: 87%; left: 17%; transform: rotate(-3deg); }
.bottle-center { height: 100%; bottom: 0; }
.bottle-right { height: 90%; right: 13%; transform: rotate(3deg); }
.hero-visual:hover .bottle-left { transform: translateY(-3px) rotate(-3deg); }
.hero-visual:hover .bottle-right { transform: translateY(-3px) rotate(3deg); }
.visual-caption { bottom: 28px; left: 39px; right: 39px; border-top-color: #a184494d; color: var(--champagne); font-size: 7px; letter-spacing: 2px; padding-top: 16px; }
.hero-bottom { background: #17130e; border-top: 1px solid #a184493d; padding-top: 27px; padding-bottom: 27px; }
.hero-bottom p { font-size: 23px; }
.hero-bottom p em { color: var(--champagne); font-size: 21px; }
.hero-bottom a { color: #bfa989; letter-spacing: 2.1px; }
.hero-bottom a svg { border-color: #c4a46555; color: var(--champagne); }

.collection { background: var(--cream); padding-top: 104px; padding-bottom: 95px; }
.section-heading { margin-bottom: 44px; }
.section-heading h2 { font-size: clamp(40px, 3.7vw, 58px); line-height: 1.15; }
.section-heading > p { font-size: 12px; max-width: 290px; }
.eyebrow { font-size: 9px; letter-spacing: 2.6px; font-weight: 400; }
.catalogue-tools { border-color: #b9a37f55; padding-top: 20px; padding-bottom: 20px; margin-bottom: 36px; }
.filter { border-radius: 0; font-size: 11px; letter-spacing: .4px; padding: 11px 17px; }
.filter.active { background: #2c2319; color: #e9d5af; }
.filter:hover:not(.active) { background: #e6d9c5; }
.search input { font-size: 11px; }
.product-grid { gap: 36px 26px; }
.product-card { border: 1px solid #d8c7aa; background: var(--paper); box-shadow: 0 9px 25px #4f371007; }
.product-card:hover { border-color: #b99962; box-shadow: 0 17px 35px #4f371014; transform: translateY(-5px); }
.product-art { height: 328px; background: radial-gradient(ellipse at 50% 58%, #61492f, #30271e 65%, #241e17); }
.product-card:nth-child(3n+2) .product-art { background: radial-gradient(ellipse at 50% 58%, #6d4d2e, #34271a 65%, #241c14); }
.product-card:nth-child(3n) .product-art { background: radial-gradient(ellipse at 50% 58%, #5a5040, #302b22 65%, #221e17); }
.product-art::before { width: calc(100% - 38px); height: calc(100% - 36px); border-radius: 48% 48% 0 0; border-color: #d1b07755; opacity: .65; }
.product-art img { height: 278px; filter: drop-shadow(8px 14px 8px #00000065); }
.product-index { color: #d1b686; font-size: 8px; letter-spacing: 1.6px; }
.card-arrow { color: #d8bf94; border-color: #cfb48460; width: 35px; height: 35px; }
.product-caption { padding: 28px 27px 24px; }
.product-category { font-size: 8px; letter-spacing: 1.7px; color: #8b7046; }
.product-caption h3 { font-size: 32px; margin-top: 12px; margin-bottom: 10px; }
.product-caption p { color: #84715a; font-size: 15px; line-height: 1.6; }
.card-discover { border-top-color: #d6c3a466; color: #6d5332; margin-top: 23px; padding-top: 17px; font-size: 10px; letter-spacing: .5px; }
.catalogue-note { margin-top: 34px; color: #7e705d; font-size: 10px; }

.maison { background: radial-gradient(ellipse at 18% 28%, #382a1c, #201a13 49%, #191510); color: var(--night-text); border-top: 1px solid #a1844940; padding-top: 95px; }
.maison .eyebrow { color: var(--champagne); }
.maison h2 { font-size: clamp(42px, 3.9vw, 61px); line-height: 1.15; }
.maison h2 em { color: var(--champagne); }
.maison-copy > p:not(.eyebrow) { color: var(--night-muted); font-size: 13px; line-height: 2; }
.maison-identity { min-height: 355px; position: relative; border: 1px solid #c9a66d3b; border-radius: 50%; aspect-ratio: 1; width: min(355px, 100%); justify-self: center; background: radial-gradient(ellipse, #bca16c0c, transparent 70%); }
.maison-identity::before { content: ''; position: absolute; inset: 15px; border: 1px solid #c9a66d18; border-radius: 50%; }
.maison-identity img { width: 170px; mix-blend-mode: screen; filter: invert(1) sepia(1) saturate(.55) hue-rotate(355deg) brightness(.85); opacity: .9; }
.maison-identity p { color: var(--champagne); font-size: 8px; letter-spacing: 2.2px; margin-top: 28px; }
.formats-row { margin-top: 77px; padding-top: 39px; border-top-color: #c9a66d3b; }
.formats-row h3 { color: #e7d8bf; font-size: 25px; }
.format-item { border-left-color: #c9a66d35; }
.format-item strong { color: var(--champagne); font-size: 37px; }
.format-item > span { color: var(--night-muted); font-size: 10px; }
.formats-note { color: #ae9d83; line-height: 1.9; }
.missing-details { border-color: #c9a66d35; }
.missing-details summary { color: #d0b994; }
.details-symbol { color: var(--champagne); }
.missing-details p { color: var(--night-muted); }
.footer { border-top: 1px solid #b48e5133; background: #14110d; padding-top: 40px; padding-bottom: 40px; }
.footer-brand { color: #e0c69c; }
.footer > div > span:last-child { color: #b9a180; font-size: 7px; }
.footer p { color: #b7a68b; }
.footer a { color: #d0b78e; }

.product-dialog { border: 1px solid #ba9b674f; box-shadow: 0 25px 100px #00000085; }
.product-dialog::backdrop { background: #100d09c9; backdrop-filter: blur(9px); }
.dialog-visual { background: radial-gradient(ellipse at 50% 54%, #70543a, #35291d 60%, #231c14); position: relative; isolation: isolate; }
.dialog-visual::before { content: ''; position: absolute; inset: 21px; border: 1px solid #c9a66d4a; border-radius: 48% 48% 0 0; z-index: -1; }
.dialog-visual img { filter: drop-shadow(13px 18px 9px #00000065); }
.dialog-visual > span { color: #d4b987; font-size: 7px; }
.dialog-close { border-color: #bd9a625c; color: #8b7046; }
.dialog-info h2 { font-size: 48px; }
.dialog-info .eyebrow { letter-spacing: 1.8px; }
.dialog-facts { border-color: #d6c3a4; }
.dialog-facts > div { border-color: #d6c3a477; }
.dialog-facts span { font-size: 8px; }
.dialog-back { border-color: #b29360; color: #775d36; }

.product-strength { font-size: 14px; color: #846b42; margin-bottom: 12px; letter-spacing: .3px; }
#dialog-abv { font-size: 16px; color: #775d36; }
#dialog-packaging { white-space: pre-line; line-height: 1.8; }
.format-item > .case-size { font-size: 14px; line-height: 1.5; color: #dfca9f; }
.brand-contact { margin-top: 44px; padding-top: 36px; border-top: 1px solid #6a593e; scroll-margin-top: 125px; }
.brand-contact h3 { font-size: 32px; color: #f3ecdf; margin-top: 14px; line-height: 1.2; }
.brand-contact > div > p:not(.eyebrow) { font-size: 16px; line-height: 1.7; color: #c6b9a4; margin-top: 16px; }
.social-accounts { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 28px; }
.social-account { display: block; padding: 26px; border: 1px solid #6a593e; background: #ffffff03; transition: background .2s, border-color .2s; }
.social-account:hover { background: #d7bd8b0a; border-color: #c5ad7d; }
.social-account > span { display: block; font-size: 14px; color: #c5ad7d; margin-bottom: 12px; }
.social-account > strong { font-family: var(--serif); font-size: 27px; font-weight: 400; color: #f3ecdf; line-height: 1.3; overflow-wrap: anywhere; }
.social-account > p { font-size: 14px; color: #c6b9a4; line-height: 1.7; margin-top: 14px; }
@media (max-width: 580px) {
  .social-accounts { grid-template-columns: 1fr; gap: 16px; }
  .social-account { padding: 22px; }
  .brand-contact h3 { font-size: 28px; }
}

@media (min-width: 1500px) {
  .hero-visual { min-height: 735px; }
  .hero-circle { width: 550px; height: 550px; }
  .bottle-stage { top: 172px; }
}
@media (min-width: 801px) {
  .product-card-orphan { grid-column: 2; }
}
@media (max-width: 1100px) {
  .brand { gap: 12px; }
  .brand-crest { width: 38px; }
  .brand-name { font-size: 27px; }
  .site-header nav { gap: 20px; font-size: 12px; }
  .header-cta { display: none; }
  .hero-visual { min-height: 635px; }
  .hero-circle { width: 420px; height: 420px; top: 137px; }
  .hero-year { font-size: 96px; top: 71px; }
  .bottle-stage { inset: 190px 0 110px; }
  .bottle-left { left: 13%; }
  .bottle-right { right: 10%; }
  .hero-copy { padding-top: 64px; }
  .product-art { height: 300px; }
  .product-art img { height: 250px; }
  .product-caption { padding: 24px 22px; }
  .product-caption h3 { font-size: 29px; }
  .maison-identity { min-height: 290px; width: min(290px, 100%); }
}
@media (max-width: 800px) {
  .private-banner { font-size: 11px; letter-spacing: .04em; }
  .site-header { height: 88px; }
  .brand-crest { width: 34px; }
  .brand-name { font-size: 26px; }
  .brand-sub { font-size: 9px; letter-spacing: .7px; }
  .brand-lockup { gap: 8px; }
  .mobile-nav { top: 88px; }
  .hero-copy { padding-top: 57px; padding-bottom: 45px; }
  h1 { font-size: 49px; }
  h1 em { font-size: 37px; }
  .hero-copy .eyebrow { font-size: 11px; letter-spacing: 1.5px; }
  .hero-description { font-size: 15px; margin-top: 23px; }
  .hero-origin { font-size: 11px; letter-spacing: .5px; }
  .button-dark { font-size: 12px; }
  .eyebrow, .formats-row .eyebrow { font-size: 11px; letter-spacing: 1.5px; }
  .section-heading > p { font-size: 14px; }
  .hero-visual { min-height: 580px; }
  .hero-circle { width: 340px; height: 340px; top: 153px; }
  .hero-year { font-size: 79px; top: 90px; }
  .bottle-stage { inset: 212px -2px 108px; }
  .bottle-left { left: 12%; }
  .bottle-right { right: 9%; }
  .visual-caption { left: 24px; right: 24px; font-size: 10px; letter-spacing: 1px; }
  .hero-bottom a { font-size: 12px; letter-spacing: 1px; }
  .collection, .maison { padding-top: 74px; padding-bottom: 72px; }
  .section-heading h2 { font-size: 39px; }
  .catalogue-tools { padding-top: 16px; padding-bottom: 16px; }
  .filter { padding: 11px 14px; font-size: 14px; }
  .search input { font-size: 16px; }
  .product-grid { gap: 27px 19px; }
  .product-art { height: 285px; }
  .product-art img { height: 235px; }
  .product-caption { padding: 22px 21px; }
  .product-caption h3 { font-size: 29px; }
  .product-caption p { font-size: 14px; }
  .product-category { font-size: 11px; letter-spacing: .8px; line-height: 1.5; }
  .product-index { font-size: 11px; }
  .card-discover { font-size: 12px; }
  .catalogue-note { font-size: 12px; }
  .maison-identity { min-height: 235px; width: min(235px, 100%); padding: 25px; }
  .maison-identity img { width: 128px; }
  .maison-identity p { font-size: 10px; letter-spacing: 1px; margin-top: 20px; }
  .maison h2 { font-size: 43px; }
  .maison-copy > p:not(.eyebrow) { font-size: 15px; }
  .format-item > span { font-size: 12px; }
  .formats-note { font-size: 12px; }
  .footer p { font-size: 12px; }
  .footer a { font-size: 12px; }
  .footer > div > span:last-child { font-size: 10px; letter-spacing: 1px; }
  .brand-contact { scroll-margin-top: 104px; }
  .formats-row { margin-top: 56px; }
  .dialog-info h2 { font-size: 40px; }
  .dialog-info .eyebrow { font-size: 11px; }
  .dialog-description { font-size: 14px; }
  .dialog-facts span { font-size: 11px; letter-spacing: 1px; }
  .dialog-facts strong { font-size: 14px; }
  .dialog-back { font-size: 13px; }
  .dialog-visual > span { font-size: 10px; letter-spacing: 1px; }
}
@media (max-width: 580px) {
  .site-header { height: 83px; }
  .brand { gap: 12px; }
  .brand-name { font-size: 25px; }
  .brand-sub { font-size: 9px; letter-spacing: .7px; }
  .brand-crest { width: 32px; }
  .mobile-nav { top: 83px; }
  .hero-copy { padding: 48px 7% 36px; }
  .hero-copy .eyebrow { font-size: 11px; letter-spacing: 1.5px; }
  .little-line { width: 24px; }
  h1 { font-size: 57px; letter-spacing: -2.1px; line-height: 1.04; margin-top: 29px; margin-bottom: 22px; }
  h1 em { font-size: 36px; line-height: 1.2; letter-spacing: -1.25px; margin-top: 14px; }
  .hero-description { font-size: 15px; line-height: 1.8; max-width: 340px; margin-top: 0; }
  .button-dark { min-height: 53px; font-size: 12px; padding: 16px 22px; margin-top: 26px; }
  .hero-visual { min-height: 405px; }
  .hero-visual::before { inset: 10px 24px 51px; border-radius: 48% 48% 0 0; }
  .hero-visual::after { bottom: 65px; }
  .hero-circle { width: 300px; height: 300px; top: 45px; }
  .hero-year { font-size: 81px; letter-spacing: 8px; top: 15px; }
  .bottle-stage { inset: 83px 24px 70px; }
  .bottle-left { left: calc(50% - 123px); height: 88%; }
  .bottle-right { right: calc(50% - 118px); height: 90%; }
  .bottle-center { height: 100%; }
  .visual-caption { bottom: 21px; left: 28px; right: 28px; padding-top: 12px; font-size: 10px; }
  .hero-bottom { padding-top: 24px; padding-bottom: 24px; }
  .hero-bottom p { font-size: 20px; }
  .hero-bottom p em { font-size: 18px; }
  .collection, .maison { padding: 61px 6%; }
  .section-heading { margin-bottom: 30px; }
  .section-heading h2 { font-size: 34px; }
  .section-heading > p { font-size: 14px; margin-top: 21px; max-width: 100%; }
  .eyebrow { font-size: 11px; letter-spacing: 1.5px; }
  .catalogue-tools { padding-top: 14px; padding-bottom: 12px; margin-bottom: 27px; }
  .filter { padding: 11px 12px; font-size: 14px; letter-spacing: .1px; }
  .product-grid { gap: 22px 11px; }
  .product-art { height: 235px; }
  .product-art img { height: 195px; }
  .product-art::before { width: calc(100% - 22px); height: calc(100% - 25px); }
  .product-index { top: 13px; left: 12px; font-size: 11px; }
  .card-arrow { width: 27px; height: 27px; font-size: 15px; }
  .product-caption { padding: 18px 13px 16px; }
  .product-category { font-size: 11px; letter-spacing: .6px; min-height: 33px; }
  .product-caption h3 { font-size: 24px; margin-top: 6px; margin-bottom: 11px; }
  .product-caption p { font-size: 14px; min-height: 67px; }
  .card-discover { font-size: 12px; padding-top: 13px; margin-top: 18px; }
  .catalogue-note { font-size: 12px; line-height: 1.9; margin-top: 27px; }
  .maison-top { gap: 37px; }
  .maison h2 { font-size: 41px; }
  .maison-identity { width: 245px; min-height: 245px; }
  .maison-identity img { width: 128px; }
  .maison-identity p { font-size: 10px; }
  .maison-copy > p:not(.eyebrow) { font-size: 15px; }
  .formats-row { margin-top: 43px; padding-top: 29px; }
  .formats-row h3 { font-size: 24px; }
  .format-item strong { font-size: 30px; }
  .format-item > span { font-size: 12px; }
  .formats-note { font-size: 12px; }
  .footer { padding: 33px 6%; }
  .footer p { font-size: 12px; }
  .dialog-visual::before { inset: 14px 49px 14px; border-radius: 45% 45% 0 0; }
  .dialog-visual > span { font-size: 10px; }
  .dialog-info h2 { font-size: 38px; }
  .dialog-info .eyebrow { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-visual:hover .bottle-left { transform: rotate(-3deg); }
  .hero-visual:hover .bottle-right { transform: rotate(3deg); }
}
