/* ============================================================
   NUNZIO ORSINI: V2 rollout skin (V4, from Doug's 2026-09-01
   approval to roll the format out)

   Loaded last on interior pages that keep their standing body
   components under the V2 chrome. style2.css already carries the
   V2 palette verbatim, so this layer only retires the leftover
   V1 dress: cursive gold names, gold rules and tinted panels,
   rounded corners, and the old light-blue action fills. The house
   gold stays for small accents (pill, modals, the sole stamp).
   ============================================================ */

/* ---- Swiss corners: square the radius scale, keep circles round ---- */
:root, [data-theme="dark"] {
  --radius-sm: 0;
  --radius-md: 0;
  --radius-lg: 0;
}

/* ---- The V1 announcement-bar rules in style2 target the same .topbar
   class as the V2 chrome wrapper, once with !important and a flex layout;
   counter them at equal weight so the V2 bar reads as built. The
   !important here exists only to outrank style2's own. ---- */
html[data-theme] .topbar, .topbar {
  background: transparent !important;
  color: inherit !important;
  height: auto !important;
  display: block !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  padding: 0;
  text-align: initial;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: normal;
  line-height: inherit;
  z-index: 200;
}
html[data-theme] .topbar.is-solid, .topbar.is-solid {
  background: color-mix(in srgb, var(--paper) 84%, transparent) !important;
}

/* ---- The V1 entrance animation depended on per-page observer scripts;
   under the rollout, content simply renders ---- */
.reveal { opacity: 1; transform: none; }

/* ---- The V1 quote blockquote shares the .manifesto class name with the
   V2 band component and picks up a bright blue fill in dark mode; it
   reads as a recessed panel instead ---- */
html[data-theme] blockquote.manifesto {
  background: var(--paper-deep) !important;
  border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
}

/* ---- Cursive gold names retire to the house serif ---- */
.shoe-detail__name,
.shoe-card__name,
.other-style-card__name {
  font-family: var(--font-display);
  font-weight: 400;
  color: var(--ink);
  letter-spacing: -0.01em;
}
.other-style-card__name { font-size: 1.55rem; }

/* ---- Gold rules become the sole blue, hairline weight. Several pages
   define these same selectors in their own inline style blocks, which
   outrank a linked sheet; the !important keeps the accent consistent ---- */
.shoe-detail__divider,
.policy-block__divider,
.divider {
  background: var(--sole-blue) !important;
  height: 1px !important;
}

/* ---- Cards and panels: flat, hairline, no lift ---- */
.feature-card,
.other-style-card,
.craft-step,
.policy-note {
  border-radius: 0;
  box-shadow: none;
}

/* ---- Policy pages: gold-tinted highlight goes recessed panel (inline
   page styles define these too, hence the !important) ---- */
.policy-highlight {
  border: 1px solid var(--hairline) !important;
  background: var(--paper-deep) !important;
}
.policy-highlight__icon,
.policy-list__icon { color: var(--sole-blue) !important; }

/* ---- Selects: hairline over gold, sharp, blue chevron ---- */
.select-dropdown {
  border: 1px solid var(--hairline);
  border-radius: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' stroke='%233B98FF' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
}
.select-dropdown:focus { border-color: var(--sole-blue); }

/* ---- Solid actions carry Howie's 9/3 CTA colour everywhere: the new
   sole-blue with ink type, the same as .btn--solid in v2.css ---- */
.btn--order,
.btn--checkout,
.btn--primary {
  background: var(--sole-blue);
  border-color: var(--sole-blue);
  color: var(--paper);
  border-radius: 0;
  letter-spacing: 0.16em;
}
.btn--order:hover,
.btn--checkout:hover,
.btn--primary:hover {
  background: #5CADFF;
  border-color: #5CADFF;
  color: var(--paper);
}
.btn--order:disabled {
  background: var(--color-border);
  color: var(--color-text-muted);
}
.btn--outline { border-radius: 0; }

/* ---- Product detail: overline and features in the V2 voice ---- */
.shoe-detail__overline { font-weight: 500; letter-spacing: 0.28em; }
.shoe-feature__icon { color: var(--sole-blue); }

/* ---- Swatches: active ring in the sole blue ---- */
.swatch--active { outline-color: var(--sole-blue); }

/* ---- Section headers: never gold ---- */
.section-title { color: var(--ink); }

/* ---- Craft journal articles: gold headings settle to ink, and the
   article CTA joins the deep-blue action family (each article carries
   these rules inline, hence the !important) ---- */
.article-body h2 { color: var(--ink) !important; }
.cta__btn { background: var(--sole-blue) !important; color: var(--paper) !important; }
.cta__btn:hover { background: #5CADFF !important; color: var(--paper) !important; }

/* ---- Gallery furniture: square dots stay round, buttons flatten ---- */
.img-gallery__btn { border-radius: 0; }
.gallery-thumb { border-radius: 0; }

/* ---- Product gallery on the dark ground (Howie's 9/3 product photography
   reset, pulled from the file 9/14): every shot sits on #080E1A, so the
   frame, the slides and the thumbnails take the same ground and the
   contain-fit images read edge to edge instead of inside a white box.
   shoe-page.css and the page-level styles set white, hence the weight ---- */
.img-gallery, .img-gallery__slide, .gallery-thumb { background: #080E1A !important; }
.gallery-thumb { border-color: var(--hairline) !important; }
.gallery-thumb:hover, .gallery-thumb.active { border-color: var(--sole-blue) !important; }
.gallery-thumb:not(.active) img { opacity: 0.55; }

/* ---- Other-styles cards now carry the dark-ground colorway crops ---- */
.other-style-card__img { background: var(--paper); }
.other-style-card__img img { object-fit: cover; }

/* ============================================================
   Howie's 2026-09-17 markup on the V2 build frames, flowed back.
   His notes, verbatim: "REMOVED STROKES & TEXT COLOUR", "REMOVE
   STROKE, REMOVE ROUNDED CORNERS, MAKE FULL WIDTH WITH STACK,
   COLOURS", "CTA / BUTTON COLOUR!!!!", "LINK COLOUR!!!!", "ALL
   TEXT LINKS SHOULD BE SOLE BLUE & UNDERLINED", "LEFT ALIGN &
   REMOVE LITTLE DASH ELWMEMENT FROM EVERYTHING", "BG COLOUR &
   GRADIENTS & LEFT -ALIGNED".
   ============================================================ */

/* ---- Secondary copy leaves the washed ink-soft for the body blue ---- */
.shoe-feature,
.color-desc,
.feature-card__desc,
.shoe-detail__desc {
  color: var(--copy);
}

/* ---- Text links: sole blue and underlined, everywhere ---- */
.shoe-guide-link,
.size-request-link,
.article__body a,
.shoe-detail__desc a {
  color: var(--sole-blue);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.25em;
}
.shoe-guide-link:hover,
.size-request-link:hover,
.article__body a:hover,
.shoe-detail__desc a:hover { color: var(--ink); }
.shoe-guide-link svg { opacity: 1; }

/* ---- The little dash retires from everything ---- */
.shoe-detail__divider,
.policy-block__divider,
.divider,
.section-header--center .divider {
  display: none !important;
}
.vhero__scroll::after { content: none; }

/* ---- Strokes off the cards and the gallery furniture; the active
   thumbnail keeps its blue edge as the only selection cue ---- */
.other-style-card,
.feature-card,
.shoe-card {
  border: 1px solid var(--paper-deep) !important;
}
.other-style-card:hover { border-color: var(--paper-deep) !important; }
.gallery-thumb { border-color: transparent !important; }
.gallery-thumb:hover,
.gallery-thumb.active { border-color: var(--sole-blue) !important; }

/* ---- Pre-order notice: no stroke, no radius, full width ---- */
.shoe-preorder-notice,
.shoe-preorder-dynamic {
  width: 100%;
  border: none !important;
  border-radius: 0 !important;
  color: var(--sole-blue) !important;
}
.shoe-preorder-notice strong,
.shoe-preorder-dynamic strong { color: var(--sole-blue) !important; }
.shoe-preorder-notice svg,
.shoe-preorder-dynamic svg { color: var(--sole-blue); }

/* ---- CTA colour: the outline button and the waiting order button
   both carry the sole blue ---- */
.btn {
  border-color: var(--sole-blue);
  color: var(--sole-blue);
}
.btn--solid,
.btn--solid:hover { color: var(--paper); }
.btn--order:disabled {
  background: var(--color-border);
  color: var(--sole-blue);
}

/* ---- "BG GRADIENTS", measured off his frame: Explore the Collection is
   flat page ground end to end. The fade lives inside the signatures band,
   which rises from the page ground to the navy over its first 195px, holds
   the navy, then returns to the ground over its last 195px before the black
   photo footer. Scoped to the product pages so craftsmanship keeps its
   flat band ---- */
.section--dark.other-styles { background: var(--paper) !important; }
.section--dark[aria-labelledby^="features-heading"] {
  background: linear-gradient(
    180deg,
    var(--paper) 0,
    #0d1a2e 195px,
    #0d1a2e calc(100% - 195px),
    var(--paper) 100%
  ) !important;
}
.other-styles__grid { background: transparent; }
.other-style-card__img { background: var(--paper); }

/* ---- Left align: section heads and the cross-sell card captions ---- */
.section-title,
.section-header--center,
.other-styles .section-title {
  text-align: left !important;
}
.section-header--center {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: none !important;
}
.section-header--center .divider { margin-left: 0 !important; }
.other-style-card__name,
.other-style-card__style {
  text-align: left;
  padding-left: var(--space-5);
  padding-right: var(--space-5);
}

/* ---- The signature ledger keeps one hairline rule, no blue bar ---- */
.sig-list li.is-active,
.sig-list li.is-active + li { border-top-color: var(--hairline); }

/* ============================================================
   Doug's 2026-09-28 review, flowed in on design-v2-doug-feedback
   ============================================================ */

/* ---- Product description: up from the 13px small-text step to a
   comfortable reading size, the same on all four shoe pages ---- */
.shoe-detail__desc {
  font-size: 1.125rem;
  line-height: 1.75;
  max-width: 54ch;
}
.color-desc { font-size: var(--text-base); line-height: 1.6; }

/* ---- Signatures band on the shoe pages: the V2 showcase from Home and
   Our Story, sitting in Howie's navy fade (the features-heading rule
   above), with the band's own breathing room ---- */
.sig-band { padding-block: clamp(4rem, 8vw, 8rem); }
.sig-band .section__head .display { font-size: var(--display-md); color: var(--ink); }
.sig-band .sig-list h3 { color: var(--ink); }
.sig-band .caption { color: var(--copy); }

/* ---- Explore the Collection cards read like the collection page cards.
   Same render files as the collection grid, but the old card cut them to
   4:3 with object-fit: cover (a 12.5% zoom that also clipped toe and
   heel), zoomed a further 4% on hover, and set them over a lighter
   panel than the render's own ground. Now: the renders' native 3:2
   frame, no zoom, one ground from the photo through the caption ---- */
.other-style-card { background: var(--paper) !important; }
.other-style-card__img { padding-bottom: 66.6667%; background: #080E1A; }
.other-style-card__img img { object-fit: cover; }
.other-style-card:hover .other-style-card__img img { transform: none; }
.other-style-card:hover { transform: none; }