/* Académie — Commerce7 V2 style overrides
   Written against the real cdn.commerce7.com/v2/commerce7.css, not guesses.

   Strategy, in order of preference:
     1. Set C7's own --c7-* variables. They are declared in :root in C7's
        stylesheet and consumed everywhere. This does most of the work with
        no specificity fight at all.
     2. Only where a variable can't reach (type family per element, uppercase
        labels, square fields) use real class names, matching C7's own
        specificity.

   Load order matters: commerce7.css must come BEFORE this file. It does, in
   every route page. Where C7 uses a compound selector we match its weight
   rather than reaching for !important. */

/* ══════════════════════════════════════════════════════════════
   1 · THE VARIABLE API — the real names, from C7's :root
   ══════════════════════════════════════════════════════════════ */
:root{
  /* page */
  --c7-page-width:1180px;
  --c7-page-width-checkout:1280px;
  --c7-bg:#EFE8DA;
  --c7-bg-alt:#E6DCC8;
  --c7-body-text-color:#2E2119;
  --c7-alt-text-color:#8A7C68;
  --c7-border-color:rgba(46,33,25,0.16);
  --c7-border-radius:0;

  /* type — inherits the page's stack; C7 ships `inherit, sans-serif` */
  --c7-font-family:"Cabin","Gill Sans",system-ui,sans-serif;
  --c7-font-size:16.5px;
  --c7-font-size-sub:13.5px;
  --c7-heading-font-family:"Bodoni MT","Libre Bodoni","Bodoni Moda",Didot,Georgia,serif;
  --c7-heading-text-color:#2E2119;
  --c7-heading-font-weight:500;

  /* wine red as the primary */
  --c7-primary-color:#8E262A;
  --c7-primary-color-text:#8E262A;
  --c7-primary-color-dark:#711E22;
  --c7-primary-color-focus:rgba(142,38,42,0.18);
  --c7-link-color:#8E262A;

  /* buttons — square, maroon, cream text */
  --c7-primary-button-bg:#8E262A;
  --c7-primary-button-bg-hover:#711E22;
  --c7-primary-button-text-color:#F3ECDE;
  --c7-alt-button-bg:transparent;
  --c7-alt-button-bg-hover:#2E2119;
  --c7-alt-button-text-color:#2E2119;
  --c7-button-border-radius:0;

  /* fields — square, cream, hairline */
  --c7-field-bg:transparent;
  --c7-field-border-radius:0;
  --c7-field-border-color:rgba(46,33,25,0.28);
  --c7-field-focus-color:rgba(46,33,25,0.06);
  --c7-field-focus-border-color:#2E2119;
  --c7-field-option-selected-color:#8E262A;
  --c7-field-option-focus-color:rgba(142,38,42,0.18);
  --c7-field-placeholder:rgba(138,124,104,0.7);
  --c7-field-dropdown-shadow:0 2px 18px rgba(46,33,25,0.10);

  /* surfaces */
  --c7-block-bg:transparent;
  --c7-block-border-color:rgba(46,33,25,0.16);
  --c7-block-border-radius:0;
  --c7-block-shadow:none;
  --c7-modal-border-radius:0;
  --c7-modal-shadow:0 18px 60px rgba(46,33,25,0.22);
  --c7-overlay-bg:rgba(46,33,25,0.34);
  --c7-side-cart-shadow:0 0 40px rgba(46,33,25,0.16);
  --c7-dropdown-border-radius:0;
  --c7-dropdown-shadow:0 2px 18px rgba(46,33,25,0.13);
  --c7-dropdown-hover:#E6DCC8;
  --c7-loading-bg:rgba(239,232,218,0.6);

  /* status — desaturated to sit on parchment */
  --c7-info-bg:#E6DCC8;
  --c7-error:#8E262A;
  --c7-error-bg:#F3E2DF;
  --c7-warning:#A9803F;
  --c7-warning-bg:#F1E7D2;
  --c7-success:#4A5D3A;
  --c7-success-bg:#E7EADD;

  /* nav widgets */
  --c7-header-text-color:#2E2119;
  --c7-notification:#8E262A;
  --c7-cart-count-bg:#8E262A;
  --c7-cart-count-bg-focus:rgba(142,38,42,0.22);
  --c7-cart-count-text-color:#F3ECDE;

  /* pills */
  --c7-pill-bg:#E6DCC8;
  --c7-pill-text-color:#2E2119;
  --c7-progress-bar:#8E262A;
}

/* ══════════════════════════════════════════════════════════════
   2 · HEADINGS — C7 uses h1.c7-h1 … h6.c7-h6 (element+class, 0,1,1)
   ══════════════════════════════════════════════════════════════ */
h1.c7-h1,h2.c7-h2,h3.c7-h3,h4.c7-h4,h5.c7-h5,h6.c7-h6{
  font-family:var(--c7-heading-font-family);font-weight:500;
  letter-spacing:-.014em;line-height:1.08;color:var(--c7-heading-text-color)}
h1.c7-h1{font-size:clamp(30px,4.2vw,52px);line-height:1}
h2.c7-h2{font-size:clamp(22px,2.6vw,32px)}
h3.c7-h3{font-size:clamp(19px,2vw,24px)}
/* C7 forces h5 back to the body family; keep it a serif here */
h5.c7-h5,.c7-account-block__title,.c7-checkout__review-block h2.c7-h2{
  font-family:var(--c7-heading-font-family);font-size:18px}
/* product titles in lists — C7 sets these with 0,2,0, so match it */
.c7-product-collection .c7-product__title,.c7-related-products .c7-product__title,
.c7-product-allocation .c7-product__title,.c7-club-product__details__title{
  font-family:var(--c7-heading-font-family);font-weight:500;
  font-size:clamp(19px,2vw,25px);line-height:1.2;letter-spacing:-.012em}
/* C7 capitalises modal + form headings; let the copy speak for itself */
#c7-modal-title,.c7-form .c7-h1,.c7-modal .c7-btn--primary,
.c7-modal .c7-btn--alt,.c7-account-details__header .c7-btn{text-transform:none}

/* ══════════════════════════════════════════════════════════════
   3 · BUTTONS — real modifiers are --primary / --alt / *--small
   ══════════════════════════════════════════════════════════════ */
.c7-btn{
  font-family:var(--c7-font-family);text-transform:uppercase;
  letter-spacing:.2em;font-size:11px;font-weight:500;line-height:1.5;
  min-height:48px;padding:15px 30px;border-radius:0;
  transition:background .3s ease,color .3s ease,border-color .3s ease}
.c7-btn--primary--small,.c7-btn--alt--small{
  font-size:9.5px;letter-spacing:.12em;min-height:38px;padding:10px 12px}
/* --alt is C7's secondary: outline it rather than fill it grey */
.c7-btn--alt,.c7-btn--alt--small{
  border:1px solid var(--c7-alt-button-text-color);
  background:transparent;color:var(--c7-alt-button-text-color)}
.c7-btn--alt:not([disabled]):hover,.c7-btn--alt:not([disabled]):focus,
.c7-btn--alt:not([disabled]):active,
.c7-btn--alt--small:not([disabled]):hover,
.c7-btn--alt--small:not([disabled]):focus,
.c7-btn--alt--small:not([disabled]):active{
  background:var(--c7-alt-button-text-color);color:var(--c7-bg)}
.c7-btn--primary,.c7-btn--primary--small{border:1px solid var(--c7-primary-button-bg)}
.c7-btn--primary:not([disabled]):hover,.c7-btn--primary--small:not([disabled]):hover{
  border-color:var(--c7-primary-button-bg-hover)}
/* links stay links — the nav cart trigger is one of these */
.c7-link{
  font-family:var(--c7-font-family);text-transform:uppercase;
  letter-spacing:.18em;font-size:10.5px}
.c7-link:not([disabled]):hover,.c7-link:not([disabled]):active,
.c7-link:not([disabled]):focus{text-decoration:none;opacity:.7}

/* ══════════════════════════════════════════════════════════════
   4 · FORMS — C7 scopes to .c7-form <el>[type]; match that weight
   ══════════════════════════════════════════════════════════════ */
.c7-form input[type='text'],.c7-form input[type='email'],
.c7-form input[type='number'],.c7-form input[type='tel'],
.c7-form input[type='username'],.c7-form input[type='password'],
.c7-form textarea,.c7-form select,
.c7-order-item input,.c7-order-item select,
.c7-product__add-to-cart input,.c7-product__add-to-cart select,
.c7-product__add-to-cart textarea{
  font-family:var(--c7-heading-font-family);font-size:17px;
  background:transparent;border:0;border-bottom:1px solid var(--c7-field-border-color);
  border-radius:0;height:44px;padding:8px 0}
/* The product quantity field sits OUTSIDE .c7-form — C7 targets it unscoped,
   which is the tell. Without the rule above it renders as a default browser
   box among underlined fields, overflows C7's 55px slot, and lands on top of
   Add to Cart. Fill the slot and match the button's 48px min-height. */
.c7-product__add-to-cart input,.c7-product__add-to-cart select{
  width:100%;max-width:100%;height:48px}
.c7-product__add-to-cart__form{align-items:stretch;gap:12px}
.c7-product__add-to-cart__form__quantity,
.c7-product__add-to-cart__form__quantity--select{margin-right:0}
.c7-form--stripe{
  background:transparent;border:0;
  border-bottom:1px solid var(--c7-field-border-color);border-radius:0;padding:10px 0}
.c7-form textarea{height:110px;padding:10px 0}
.c7-form input:active:not([disabled]),.c7-form input:focus:not([disabled]),
.c7-form select:active:not([disabled]),.c7-form select:focus:not([disabled]),
.c7-form textarea:active:not([disabled]),.c7-form textarea:focus:not([disabled]),
.c7-order-item input:focus:not([disabled]),.c7-order-item select:focus:not([disabled]),
.c7-product__add-to-cart input:focus:not([disabled]),
.c7-product__add-to-cart select:focus:not([disabled]){
  box-shadow:none;border-bottom-color:var(--c7-field-focus-border-color)}
.c7-form select,.c7-order-item select{padding-right:26px;background-position:center right 2px}
/* labels — C7's selector is 0,3,1; this matches it */
.c7-form label:not(.c7-radio,.c7-checkbox,.duet-date__mobile-heading),
.c7-label,.c7-form legend{
  font-family:var(--c7-font-family);text-transform:uppercase;
  letter-spacing:.2em;font-size:9.5px;color:var(--c7-alt-text-color);
  padding-bottom:9px}
::placeholder{font-style:italic}
/* checkbox + radio squares, not circles-and-blue */
.c7-checkbox__control{border-radius:0}
.c7-form .c7-radio--box .c7-radio__label::after{border-radius:0}

/* ══════════════════════════════════════════════════════════════
   5 · NAV WIDGETS — .c7-user-nav__cart / __account (real markup)
   ══════════════════════════════════════════════════════════════ */
#c7-cart,#c7-account{display:flex;align-items:center;line-height:1}
.c7-user-nav,.c7-user-nav__account,.c7-user-nav__cart{display:flex;align-items:center;line-height:1}
.c7-user-nav__account>a,.c7-user-nav__cart>button{
  font-family:var(--c7-font-family);text-transform:uppercase;
  letter-spacing:.24em;font-size:10.5px;color:var(--c7-header-text-color);
  padding:0;line-height:1;display:inline-flex;align-items:center;
  opacity:.72;transition:opacity .35s ease}
.c7-user-nav__account>a:hover,.c7-user-nav__cart>button:hover{opacity:1}
.c7-user-nav__account{padding-right:0}
.c7-user-nav__cart__title svg{width:17px;height:19px;stroke-width:1.3}
.c7-user-nav__cart__count{
  font-family:var(--c7-font-family);font-size:9.5px;font-weight:500;
  letter-spacing:.04em;border-radius:50%;min-width:18px;height:18px;padding:0 4px}
.c7-user-nav__account__dropdown{
  border:1px solid var(--c7-border-color);border-radius:0;min-width:230px}
.c7-user-nav__account__dropdown li a,.c7-user-nav__account__dropdown__logout{
  font-family:var(--c7-font-family);text-transform:uppercase;
  letter-spacing:.18em;font-size:10px;border-radius:0}

/* ══════════════════════════════════════════════════════════════
   6 · PRODUCT — real names: __subtitle, __teaser, __add-to-cart__price
   ══════════════════════════════════════════════════════════════ */
.c7-product__subtitle{
  font-family:var(--c7-font-family);text-transform:uppercase;
  letter-spacing:.2em;font-size:9.5px;color:var(--c7-alt-text-color)}
.c7-product__teaser{font-family:var(--c7-heading-font-family);font-size:17px;line-height:1.6}
.c7-product__add-to-cart__price{
  font-family:var(--c7-heading-font-family);font-size:clamp(21px,2.2vw,28px);
  letter-spacing:-.01em;color:var(--c7-heading-text-color)}
.c7-product__add-to-cart__form__quantity input{
  text-align:center;font-family:var(--c7-heading-font-family)}
.c7-product__spec div:first-child{
  font-family:var(--c7-font-family);font-weight:500;text-transform:uppercase;
  letter-spacing:.18em;font-size:9px;color:var(--c7-alt-text-color)}
.c7-product__spec{font-family:var(--c7-heading-font-family);font-size:15px}
/* the logged-out / allocation-gated state */
.c7-product__login-message,.c7-reservation-type__booking__message{
  font-family:var(--c7-heading-font-family);font-style:italic;
  font-size:17px;color:var(--c7-primary-color)}
/* C7 tints featured products grey — use the deeper parchment */
.c7-product-collection__products--featured .c7-product{
  background:var(--c7-bg-alt);border-radius:0}

/* ══════════════════════════════════════════════════════════════
   7 · CART, ORDER ITEMS, SUMMARY — real: .c7-order-item / -summary
   ══════════════════════════════════════════════════════════════ */
.c7-cart__summary-container .c7-order-summary{
  background:var(--c7-bg-alt);border:1px solid var(--c7-border-color);
  border-radius:0;padding:26px}
.c7-cart__item-container .c7-order-item,
.c7-cart__item-container .c7-order-item:last-child{border-color:var(--c7-border-color)}
.c7-order-summary__item--total,.c7-order-summary__value{
  font-family:var(--c7-heading-font-family)}
.c7-side-cart{background:var(--c7-bg);box-shadow:var(--c7-side-cart-shadow);max-width:520px}
.c7-side-cart__summary-container{background:var(--c7-bg);border-top-color:var(--c7-border-color)}
.c7-club-product,.c7-account-block,.c7-gift-card{border-radius:0}
.c7-club-product--selected{border-color:var(--c7-primary-color)}
/* Gift messaging is not operational yet — hide C7's cart/checkout entry point.
   JS in c7-portal.js catches label variants this selector list misses. */
.c7-gift-message,.c7-cart__gift-message,.c7-order-item__gift-message,
[class*="gift-message"],[data-academie-hide="gift"]{display:none!important}
/* Password reveal toggle (injected by c7-portal.js). Sized for older eyes and
   thumbs: 44px hit target, sitting inside the field's right edge. */
.pw-eye{position:absolute;right:0;top:50%;transform:translateY(-50%);
  width:44px;height:44px;display:flex;align-items:center;justify-content:center;
  background:none;border:0;padding:0;cursor:pointer;
  color:var(--c7-text-color-light,#6d6459);opacity:.75;transition:opacity .15s,color .15s}
.pw-eye:hover,.pw-eye:focus-visible{opacity:1;color:var(--c7-primary-color)}
.pw-eye .pw-eye__slash{opacity:0;transition:opacity .15s}
.pw-eye.is-on{color:var(--c7-primary-color);opacity:1}
.pw-eye.is-on .pw-eye__slash{opacity:1}
input[data-academie-pw]{padding-right:46px}

/* ══════════════════════════════════════════════════════════════
   8 · ACCOUNT — header band, menu underline
   ══════════════════════════════════════════════════════════════ */
.c7-account__header{background:var(--c7-bg-alt);padding:70px 0 56px}
.c7-account__menu{background:transparent;box-shadow:none;
  border-bottom:1px solid var(--c7-border-color)}
.c7-account__menu a{
  font-family:var(--c7-font-family);text-transform:uppercase;
  letter-spacing:.2em;font-size:10px;border-bottom-width:2px;
  border-bottom-color:transparent}
.c7-account__menu .c7-active a{border-bottom-color:var(--c7-primary-color)}
.c7-table__number a,.c7-table--basic a{font-weight:500}

/* ══════════════════════════════════════════════════════════════
   9 · MESSAGES, MARKERS, MODALS
   ══════════════════════════════════════════════════════════════ */
.c7-message,.c7-carrot{border-radius:0;font-size:14px}
.c7-marker{
  border-radius:0;font-family:var(--c7-font-family);text-transform:uppercase;
  letter-spacing:.16em;font-size:9px;padding:6px 11px}
.c7-marker--default{border-color:var(--c7-border-color)}
.c7-notice--empty{font-family:var(--c7-heading-font-family);font-style:italic;font-size:19px}
.c7-modal{border-radius:0}
.c7-modal__header button svg:hover{stroke:var(--c7-body-text-color)}

/* ══════════════════════════════════════════════════════════════
   10 · SCOPE NOTE
   C7's stylesheet sets `body{background;color;font-size;line-height}`
   globally. quiet.css loads after commerce7.css on every route page, so
   the editorial pages keep their own body rules. If a non-commerce page
   shifts after deploy, that is the cause — fix it here, scoped, rather
   than dropping C7's stylesheet.

   Deliberately NOT set: .c7-modal-container z-index. C7 ships 100000 and
   .c7-side-cart 1000, both already clear of the site nav (z-index 30).
   The previous rule here lowered them to 200 for no reason.
   ══════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════════
   11 · ACCOUNT NOTICE — injected by c7-portal.js on the cart page
   when nobody is signed in. Shipping status and tracking live on the
   customer record, so a guest order has nowhere to show them.
   ══════════════════════════════════════════════════════════════ */
.acct-notice{display:flex;align-items:center;justify-content:space-between;gap:clamp(18px,3vw,40px);
  flex-wrap:wrap;border:1px solid var(--c7-border-color);background:rgba(255,252,245,.5);
  padding:clamp(20px,2.6vw,30px);margin:0 0 clamp(24px,3vw,36px)}
.acct-notice__k{display:block;font-family:var(--c7-font-family);text-transform:uppercase;
  letter-spacing:.3em;font-size:10px;font-weight:500;color:#8A7C68;margin-bottom:9px}
.acct-notice p{font-family:var(--c7-heading-font-family);font-size:17px;line-height:1.5;
  margin:0;max-width:52ch;color:var(--c7-body-text-color)}
.acct-notice__act .btn{white-space:nowrap}
@media(max-width:640px){.acct-notice{flex-direction:column;align-items:stretch;text-align:center}}

/* ══════════════════════════════════════════════════════════════
   12 · LOGIN — make the create-account door obvious

   C7 sets the "Don't have an account? Create one" row at label scale
   (10px, uppercase, tracked), which reads as fine print under a maroon
   LOG IN button. First-time buyers miss it. Selectors match by
   destination, not class name, so a C7 template change cannot undo it.
   ══════════════════════════════════════════════════════════════ */
#c7-content a[href*="create"],#c7-content a[href*="sign-up"],#c7-content a[href*="signup"],
.c7-account a[href*="create"]{
  font-family:var(--c7-heading-font-family);text-transform:none;letter-spacing:0;
  font-size:19px;font-weight:400;color:var(--c7-primary-color);
  border-bottom:1px solid rgba(142,38,42,.4);padding-bottom:1px}
#c7-content a[href*="create"]:hover,.c7-account a[href*="create"]:hover{
  border-bottom-color:var(--c7-primary-color)}
/* the sentence the link sits in — C7 may wrap it in a p OR a div, and it may
   sit outside .c7-form entirely, so scope to the widget root instead */
#c7-content :is(p,div):has(>a[href*="create"]),
#c7-content :is(p,div):has(>a[href*="sign-up"]){
  font-family:var(--c7-heading-font-family);font-size:19px;line-height:1.5;
  margin-top:clamp(26px,3vw,34px);padding-top:clamp(22px,2.6vw,28px);
  border-top:1px solid var(--c7-border-color);text-align:center}

/* ══════════════════════════════════════════════════════════════
   13 · ACCOUNT DASHBOARD — hide reservations

   The C7 account widget renders a Reservations tab and dashboard card on
   /profile here too. There is no tasting room to book. Matched by
   destination, so a C7 reorder cannot expose them.
   ══════════════════════════════════════════════════════════════ */
.c7-account__menu li:has(a[href*="reservation"]),
.c7-account__menu a[href*="reservation"],
.c7-account-block:has(a[href*="reservation"]){display:none !important}

/* two-doors panel, injected by c7-portal.js above the login form */
.new-here{border:1px solid var(--c7-border-color);background:rgba(255,252,245,.5);
  padding:clamp(20px,2.6vw,28px);margin:0 0 clamp(26px,3vw,34px)}
.new-here__k{display:block;font-family:var(--c7-font-family);text-transform:uppercase;
  letter-spacing:.3em;font-size:10px;font-weight:500;color:#8A7C68;margin-bottom:10px}
.new-here p{font-family:var(--c7-heading-font-family);font-size:18px;line-height:1.5;
  margin:0 0 14px;color:var(--c7-body-text-color)}
.new-here p:last-child{margin-bottom:0}
.new-here p+p{padding-top:14px;border-top:1px solid var(--c7-border-color)}
.new-here b{font-weight:400;font-style:italic}
.new-here__go{white-space:nowrap;color:var(--c7-primary-color);
  border-bottom:1px solid rgba(142,38,42,.4);padding-bottom:1px}
.new-here__go:hover{border-bottom-color:var(--c7-primary-color)}