/* From Curaçao With Love: theme styles.
   Generated by tools/port-css.py from the approved Design Gate prototype
   (prototype/assets/css/fcwl.css) plus tools/theme-extra.css. Edit those, then rerun the script. */

/* ---------- Tokens: short aliases for the theme.json presets ---------- */
:root {
  --sand-50: var(--wp--preset--color--sand-50);
  --sand-100: var(--wp--preset--color--sand-100);
  --sand-200: var(--wp--preset--color--sand-200);
  --ink-900: var(--wp--preset--color--ink-900);
  --ink-600: var(--wp--preset--color--ink-600);
  --korsou-blue: var(--wp--preset--color--korsou-blue);
  --lagoon: var(--wp--preset--color--lagoon);
  --lagoon-ink: var(--wp--preset--color--lagoon-ink);
  --sun: var(--wp--preset--color--sun);
  --coral: var(--wp--preset--color--coral);
  --coral-ink: var(--wp--preset--color--coral-ink);
  --flamingo: var(--wp--preset--color--flamingo);
  --mint: var(--wp--preset--color--mint);
  --logo-gold: #DFA032; /* the heart's gold, used only by the logo */

  --font-display: var(--wp--preset--font-family--display);
  --font-serif: var(--wp--preset--font-family--serif);
  --font-body: var(--wp--preset--font-family--body);

  --fs-xs: var(--wp--preset--font-size--xs);
  --fs-sm: var(--wp--preset--font-size--sm);
  --fs-base: var(--wp--preset--font-size--base);
  --fs-md: var(--wp--preset--font-size--md);
  --fs-lg: var(--wp--preset--font-size--lg);
  --fs-xl: var(--wp--preset--font-size--xl);
  --fs-2xl: var(--wp--preset--font-size--2-xl);
  --fs-hero: var(--wp--preset--font-size--hero);

  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px;
  --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px; --space-10: 128px;
  --section-y: var(--wp--preset--spacing--70);

  --radius-card: var(--wp--custom--radius--card);
  --radius-hero: var(--wp--custom--radius--hero);
  --radius-pill: var(--wp--custom--radius--pill);

  --ease: var(--wp--custom--ease);
  --t-fast: var(--wp--custom--duration--fast); --t-mid: var(--wp--custom--duration--mid); --t-slow: var(--wp--custom--duration--slow);

  --max: var(--wp--style--global--wide-size, 1440px);
  --page-pad: var(--wp--custom--page-pad);
  --frame-inset: var(--wp--custom--frame-inset);
  --announce-h: 40px;
  --proto-h: 0px;
  --header-h: 76px;
  --shadow-float: var(--wp--preset--shadow--float);
  color-scheme: light;
}
@media (max-width: 719px) {
  :root { --header-h: 64px; }
}
@media (min-width: 720px) {
  .home { --header-h: 88px; } /* room for the heart inside the hero frame */
}

/* ---------- Base (WordPress-safe) ---------- */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 16px); }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, video { max-width: 100%; height: auto; }
a { text-underline-offset: .18em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
:where(h1, h2, h3, h4) { text-wrap: balance; }
:where(p) { text-wrap: pretty; }
:focus-visible { outline: 3px solid var(--lagoon-ink); outline-offset: 3px; border-radius: 6px; }
.on-dark :focus-visible, .hero :focus-visible, .site-footer :focus-visible, .announce :focus-visible { outline-color: var(--lagoon); }
/* Inside fcwl blocks, start from zero so the block layouts control spacing. Post content keeps normal lists. */
:where(.fcwl-block) :where(h1, h2, h3, h4, p, figure) { margin: 0; }
:where(.fcwl-block) :where(ul, ol) { margin: 0; padding: 0; list-style: none; }
:where(.fcwl-block) :where(svg) { display: block; max-width: 100%; }
.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link.screen-reader-text:focus {
  background: var(--ink-900); color: var(--sand-50); padding: 12px 18px; border-radius: var(--radius-pill); font-weight: 700;
}

.container {
  width: 100%;
  max-width: var(--max);
  margin-inline: auto;
  padding-left: max(var(--page-pad), env(safe-area-inset-left, 0px));
  padding-right: max(var(--page-pad), env(safe-area-inset-right, 0px));
}
.section { padding-block: var(--section-y); }
.section--tight { padding-block: calc(var(--section-y) * .6); }

/* ---------- Type ---------- */
.display {
  font-family: var(--font-display);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: -0.012em;
  line-height: .92;
}
.serif-i {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
}
.h2 { font-size: var(--fs-2xl); }
.h3 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lg); line-height: 1.15; letter-spacing: -0.005em; }
.label {
  font-size: var(--fs-xs);
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.lede { font-size: var(--fs-md); color: var(--ink-600); max-width: 52ch; }
.muted { color: var(--ink-600); }
.price { font-weight: 700; font-variant-numeric: tabular-nums; }
.price--sale { color: var(--coral-ink); }
.price s { color: var(--ink-600); font-weight: 500; margin-left: .4em; }

/* ---------- Buttons, chips, pills ---------- */
.btn {
  --btn-bg: var(--ink-900); --btn-fg: var(--sand-50); --btn-bd: transparent;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 24px;
  border-radius: var(--radius-pill); border: 1.5px solid var(--btn-bd);
  background: var(--btn-bg); color: var(--btn-fg);
  font-weight: 700; font-size: var(--fs-sm); letter-spacing: .01em; text-decoration: none; white-space: nowrap;
  transition: background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
}
.btn:hover { --btn-bg: var(--korsou-blue); text-decoration: none; }
.btn:active { transform: translateY(1px); }
.btn svg { width: 18px; height: 18px; flex: none; }
.btn--light { --btn-bg: var(--sand-50); --btn-fg: var(--ink-900); }
.btn--light:hover { --btn-bg: var(--sand-100); --btn-fg: var(--korsou-blue); }
.btn--glass {
  --btn-bg: rgba(251, 248, 243, .12); --btn-fg: var(--sand-50); --btn-bd: rgba(251, 248, 243, .4);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.btn--glass:hover { --btn-bg: rgba(251, 248, 243, .22); --btn-fg: var(--sand-50); }
.btn--outline { --btn-bg: transparent; --btn-fg: var(--ink-900); --btn-bd: var(--ink-900); }
.btn--outline:hover { --btn-bg: var(--ink-900); --btn-fg: var(--sand-50); }
.btn--block { width: 100%; }
.btn--sm { min-height: 40px; padding: 0 18px; }
.btn .arrow { transition: transform var(--t-fast) var(--ease); }
.btn:hover .arrow { transform: translateX(3px); }

.chip {
  display: inline-flex; align-items: center; gap: 6px;
  height: 26px; padding: 0 11px; border-radius: var(--radius-pill);
  font-size: var(--fs-xs); font-weight: 700; letter-spacing: .02em;
  background: var(--sand-100); color: var(--ink-900);
}
.chip--new { background: var(--sun); }
.chip--sale { background: var(--coral); }
.chip--flamingo { background: var(--flamingo); }
.chip--mint { background: var(--mint); }
.chip--lagoon { background: var(--lagoon); }
.chip--ink { background: var(--ink-900); color: var(--sand-50); }
.chip--sun { background: var(--sun); }

.icon-btn {
  position: relative; display: inline-grid; place-items: center;
  width: 44px; height: 44px; border-radius: 50%; border: 0; background: transparent; color: inherit;
  transition: background-color var(--t-fast) var(--ease);
}
.icon-btn:hover { background: rgba(15, 27, 45, .07); }
.icon-btn svg { width: 22px; height: 22px; }
.count {
  position: absolute; top: 4px; right: 2px; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 9px; background: var(--sun); color: var(--ink-900);
  font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; font-variant-numeric: tabular-nums;
}
.icon { width: 20px; height: 20px; flex: none; }

/* Two stars from the flag, used as a separator */
.stars { display: inline-block; width: 1.1em; height: .8em; vertical-align: -.02em; color: var(--sun); }

/* ---------- Punda strip ---------- */
.punda {
  height: 44px;
  background: url(../img/punda-strip.svg) repeat-x left bottom / auto 44px;
}
.punda--sm { height: 30px; background-size: auto 30px; }
.loadbar {
  position: fixed; inset: 0 auto auto 0; z-index: 300; height: 4px; width: 100%;
  background: url(../img/punda-blocks.svg) repeat-x left top / auto 4px;
  transform-origin: left; transform: scaleX(0);
  animation: load 1.1s var(--ease) forwards, loadFade 400ms var(--ease) 1.2s forwards;
  pointer-events: none;
}
@keyframes load { to { transform: scaleX(1); } }
@keyframes loadFade { to { opacity: 0; } }

/* ---------- Announcement bar ---------- */
.announce {
  position: relative; z-index: 60;
  min-height: var(--announce-h);
  background: var(--ink-900); color: var(--sand-50);
  display: flex; align-items: center; justify-content: center;
  padding: 6px 52px; font-size: var(--fs-sm); font-weight: 500; text-align: center;
}
.announce a { color: inherit; font-weight: 700; }
.announce__msg { transition: opacity var(--t-mid) var(--ease); }
.announce__msg.is-fading { opacity: 0; }
.announce__close { position: absolute; right: max(6px, env(safe-area-inset-right, 0px)); top: 50%; transform: translateY(-50%); color: var(--sand-50); }
.announce__close:hover { background: rgba(251, 248, 243, .12); }
.announce__close svg { width: 18px; height: 18px; }

/* ---------- Header ---------- */
.site-header {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50;
  height: var(--header-h);
  color: var(--ink-900);
  transition: background-color var(--t-mid) var(--ease), color var(--t-mid) var(--ease), box-shadow var(--t-mid) var(--ease);
}
.site-header.is-solid {
  background: rgba(251, 248, 243, .86);
  backdrop-filter: blur(16px) saturate(1.4); -webkit-backdrop-filter: blur(16px) saturate(1.4);
  box-shadow: 0 1px 0 var(--sand-200);
}
.site-header.is-over-hero:not(.is-solid) { color: var(--sand-50); }
.site-header.is-over-hero:not(.is-solid) .icon-btn:hover { background: rgba(251, 248, 243, .14); }
.site-header__inner {
  height: 100%; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-4);
}
.home .site-header__inner { padding-inline: calc(var(--frame-inset) + clamp(8px, 2vw, 32px)); max-width: none; transition: padding-top var(--t-mid) var(--ease); }
/* Over the hero, center the header inside the rounded frame so the heart's gable stays within it. */
.home .site-header:not(.is-solid) .site-header__inner { padding-top: var(--frame-inset); }
.brand { display: inline-flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; justify-self: start; }
.brand:hover { text-decoration: none; }
.brand__mark { width: auto; height: 48px; flex: none; }
.brand__word {
  display: grid; gap: 1px; justify-items: center; text-align: center;
  font-family: var(--font-display); font-weight: 600; text-transform: uppercase;
  font-size: 13.5px; letter-spacing: .01em; line-height: 1; white-space: nowrap;
}
.brand__word i { font-family: var(--font-serif); font-style: italic; font-weight: 400; text-transform: none; font-size: 1.22em; letter-spacing: 0; line-height: .9; }
.nav { display: flex; gap: 0; justify-self: center; }
.nav__link {
  display: inline-flex; align-items: center; gap: 4px; height: 44px; padding: 0 11px; border-radius: var(--radius-pill);
  color: inherit; text-decoration: none; font-weight: 600; font-size: var(--fs-sm); white-space: nowrap;
  background: transparent; border: 0;
}
.nav__link:hover, .nav__link[aria-expanded="true"] { background: rgba(15, 27, 45, .07); text-decoration: none; }
.is-over-hero:not(.is-solid) .nav__link:hover, .is-over-hero:not(.is-solid) .nav__link[aria-expanded="true"] { background: rgba(251, 248, 243, .14); }
.nav__link svg { width: 14px; height: 14px; transition: transform var(--t-fast) var(--ease); }
.nav__link[aria-expanded="true"] svg { transform: rotate(180deg); }
.nav__link[aria-current="page"] { box-shadow: inset 0 -2px 0 currentColor; border-radius: 0; }
.header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 2px; }
.signin {
  display: inline-flex; align-items: center; gap: 8px; margin-left: 8px;
  height: 44px; padding: 0 6px 0 18px; border-radius: var(--radius-pill); white-space: nowrap;
  background: var(--ink-900); color: var(--sand-50); font-weight: 700; font-size: var(--fs-sm); text-decoration: none;
}
.signin span.arrow-dot { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--sand-50); color: var(--ink-900); }
.signin svg { width: 16px; height: 16px; }
.signin:hover { background: var(--korsou-blue); text-decoration: none; }
.is-over-hero:not(.is-solid) .signin { background: var(--sand-50); color: var(--ink-900); }
.is-over-hero:not(.is-solid) .signin span.arrow-dot { background: var(--ink-900); color: var(--sand-50); }
.avatar {
  display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
  background: var(--mint); color: var(--ink-900); font-weight: 700; font-size: var(--fs-sm);
}
.menu-btn { display: none; }

@media (max-width: 1099px) {
  .nav, .header-actions .hide-md { display: none; }
  .menu-btn { display: inline-grid; }
  .site-header__inner { grid-template-columns: 1fr auto; }
}
@media (max-width: 719px) {
  .brand__mark { height: 40px; }
  .brand__word { font-size: 12px; }
  .signin { display: none; }
}

/* Account dropdown */
.acct-menu { position: relative; }
.acct-menu__panel {
  position: absolute; right: 0; top: calc(100% + 10px); min-width: 230px; padding: 8px;
  background: var(--sand-50); color: var(--ink-900); border-radius: 16px; box-shadow: var(--shadow-float), 0 0 0 1px var(--sand-200);
}
.acct-menu__panel a { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; color: inherit; text-decoration: none; font-weight: 600; font-size: var(--fs-sm); }
.acct-menu__panel a:hover { background: var(--sand-100); }

/* Mega menu */
.mega {
  position: absolute; left: 0; right: 0; top: 100%;
  padding-block: 8px 24px;
}
.mega__panel {
  display: grid; grid-template-columns: 1fr 1fr 1.6fr 1.1fr; gap: var(--space-6);
  padding: var(--space-6); border-radius: var(--radius-card);
  background: var(--sand-50); color: var(--ink-900); box-shadow: var(--shadow-float), 0 0 0 1px var(--sand-200);
}
.mega h3 { margin-bottom: 14px; color: var(--ink-600); }
.mega ul { display: grid; gap: 4px; }
.mega a { color: var(--ink-900); text-decoration: none; font-weight: 600; }
.mega ul a { display: block; padding: 6px 0; }
.mega ul a:hover { color: var(--korsou-blue); }
.mega .soon { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 6px 0; font-weight: 600; color: var(--ink-600); }
.mega .soon a { text-decoration: underline; text-underline-offset: .2em; }
.mega__collections { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.mega__collection { display: grid; gap: 8px; font-size: var(--fs-sm); }
.mega__collection .ph { aspect-ratio: 4 / 3; border-radius: 14px; overflow: hidden; }
.mega__collection img { width: 100%; height: 100%; object-fit: cover; }
.mega__collection .ph--art { background: var(--flamingo); display: grid; place-items: center; }
.mega__collection .ph--art img { width: 46%; height: auto; object-fit: contain; }
.mega__feature { display: grid; grid-template-columns: 96px 1fr; gap: 16px; align-items: center; padding: 16px; background: var(--sand-100); border-radius: 16px; }

/* ---------- Hero ---------- */
.hero {
  position: relative;
  margin: calc(var(--frame-inset) - var(--header-h)) var(--frame-inset) 0;
  height: clamp(640px, calc(100svh - var(--announce-h) - var(--proto-h) - var(--frame-inset)), 920px);
  border-radius: var(--radius-hero);
  overflow: hidden; isolation: isolate;
  background: var(--ink-900) center / cover no-repeat;
  color: var(--sand-50);
}
.hero__media { position: absolute; inset: 0; z-index: -2; }
.hero__media img, .hero__media video { width: 100%; height: 100%; object-fit: cover; }
.hero__media video { position: absolute; inset: 0; opacity: 0; transition: opacity var(--t-slow) var(--ease); }
.hero__media video.is-playing { opacity: 1; }
.hero__scrim {
  position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(180deg, rgba(15, 27, 45, .5) 0%, rgba(15, 27, 45, 0) 22%),
    linear-gradient(20deg, rgba(15, 27, 45, .9) 0%, rgba(15, 27, 45, .78) 30%, rgba(15, 27, 45, .2) 64%, rgba(15, 27, 45, 0) 80%);
}
@supports (animation-timeline: scroll()) {
  .hero__media { animation: heroSettle linear both; animation-timeline: scroll(root); animation-range: 0 90vh; }
  @keyframes heroSettle { from { transform: scale(1.06); } to { transform: scale(1); } }
}
.hero__inner {
  position: absolute; inset: 0;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, 330px); grid-template-rows: 1fr auto;
  column-gap: var(--space-7); row-gap: var(--space-6);
  padding: calc(var(--header-h) + 24px) clamp(24px, 3.4vw, 56px) clamp(24px, 3.4vw, 48px);
}
.hero__copy { grid-column: 1; grid-row: 1; align-self: end; display: grid; gap: var(--space-5); max-width: 860px; container-type: inline-size; }
@media (min-width: 720px) {
  /* Keep "FROM CURAÇAO" on one line: it is about 8.4em wide. */
  .hero__copy .hero__title { font-size: min(var(--fs-hero), 11.4cqi); }
  .hero__copy .hero__title--long { font-size: min(clamp(2.8rem, 1.3rem + 5.6vw, 7.25rem), 10cqi); }
}
.kicker { display: inline-flex; align-items: center; gap: 10px; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--sand-50); }
.kicker .stars { color: var(--sun); }
.hero__title { font-size: var(--fs-hero); color: var(--sand-50); }
.hero__title .line { display: block; overflow: hidden; padding-bottom: .04em; }
.hero__title .line > span { display: inline-block; }
.hero__title .serif-i { font-size: 1.04em; line-height: .86; letter-spacing: -0.01em; }
.hero__title--long { font-size: clamp(2.8rem, 1.3rem + 5.6vw, 7.25rem); }
.hero--still .hero__media img { animation: kenBurns 24s ease-in-out infinite alternate; }
@keyframes kenBurns { from { transform: scale(1); } to { transform: scale(1.08) translate(-1%, -1%); } }
.hero__sub { font-size: var(--fs-md); max-width: 44ch; color: rgba(251, 248, 243, .9); }
.hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; }

.hero__features { grid-column: 2; grid-row: 1; align-self: center; display: grid; gap: 4px; justify-self: end; }
.feature { display: flex; align-items: center; gap: 14px; padding: 10px 16px 10px 12px; border-radius: 14px; font-weight: 600; font-size: var(--fs-sm); }
.feature__icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(251, 248, 243, .12); border: 1px solid rgba(251, 248, 243, .22); }
.feature__icon svg { width: 20px; height: 20px; }

.glass {
  background: rgba(15, 27, 45, .42);
  backdrop-filter: blur(16px) saturate(1.3); -webkit-backdrop-filter: blur(16px) saturate(1.3);
  border: 1px solid rgba(251, 248, 243, .2);
  border-radius: var(--radius-card);
  color: var(--sand-50);
}
.hero-card { display: grid; grid-template-columns: 96px 1fr; gap: 16px; padding: 12px; align-items: center; text-decoration: none; }
.hero-card:hover { text-decoration: none; background: rgba(15, 27, 45, .55); }
.hero-card__img { aspect-ratio: 4 / 5; border-radius: 12px; background: var(--sand-100); overflow: hidden; display: grid; place-items: center; }
.hero-card__img img { width: 92%; }
.hero-card__body { display: grid; gap: 4px; min-width: 0; }
.hero-card__label { color: var(--sun); }
.hero-card__name { font-family: var(--font-display); font-weight: 600; font-size: 1.15rem; line-height: 1.1; text-transform: uppercase; }
.hero-card__meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 6px; font-size: var(--fs-sm); }
.hero-card__meta .more { font-weight: 700; text-decoration: underline; text-underline-offset: .25em; }
.hero__card--new { grid-column: 1; grid-row: 2; justify-self: start; width: min(380px, 100%); }
.hero__card--book { grid-column: 2; grid-row: 2; }
.hero__card--book .hero-card__img { background: transparent; }

/* Video thumbnail with play button (reference #6), shown on wide screens */
.hero__reel {
  position: absolute; right: clamp(24px, 3.4vw, 56px); top: calc(var(--header-h) + 24px);
  display: none;
}

/* Entrance: line-by-line headline, then cards. Runs once on load. */
.js .hero__title .line > span { animation: rise var(--t-slow) var(--ease) both; }
.js .hero__title .line:nth-child(2) > span { animation-delay: 90ms; }
.js .hero__title .line:nth-child(3) > span { animation-delay: 180ms; }
.js .hero__sub, .js .hero__ctas, .js .kicker { animation: fade var(--t-slow) var(--ease) 260ms both; }
.js .hero__features { animation: fade var(--t-slow) var(--ease) 420ms both; }
.js .hero__card--new { animation: riseCard var(--t-slow) var(--ease) 480ms both; }
.js .hero__card--book { animation: riseCard var(--t-slow) var(--ease) 580ms both; }
@keyframes rise { from { transform: translateY(105%); } }
@keyframes fade { from { opacity: 0; transform: translateY(10px); } }
@keyframes riseCard { from { opacity: 0; transform: translateY(24px); } }

@media (max-width: 1023px) {
  .hero__inner { grid-template-columns: 1fr; grid-template-rows: 1fr auto; padding-inline: 24px; padding-bottom: 20px; row-gap: 18px; }
  .hero__features { display: none; }
  .hero__cards-row { grid-column: 1; grid-row: 2; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .hero__card--new, .hero__card--book { grid-column: auto; grid-row: auto; width: auto; }
}
@media (min-width: 1024px) { .hero__cards-row { display: contents; } }
@media (max-width: 719px) {
  .hero { height: max(600px, calc(100svh - var(--announce-h) - var(--proto-h) - var(--frame-inset))); border-radius: 22px; }
  .hero__inner { padding-inline: 18px; padding-bottom: 14px; }
  .hero__title { font-size: clamp(2.9rem, 13.5vw, 4.25rem); }
  .hero__ctas .btn { flex: 1 1 100%; }
  .hero-card { grid-template-columns: 1fr; gap: 8px; padding: 8px; }
  .hero-card__img { display: none; }
  .hero-card__name { font-size: .95rem; }
  .hero-card__meta { margin-top: 2px; font-size: var(--fs-xs); }
  .hero__scrim { background: linear-gradient(180deg, rgba(15, 27, 45, .45) 0%, rgba(15, 27, 45, 0) 22%), linear-gradient(0deg, rgba(15, 27, 45, .92) 0%, rgba(15, 27, 45, .8) 42%, rgba(15, 27, 45, .1) 78%); }
}

/* ---------- Marquee ---------- */
.marquee { overflow: hidden; border-block: 1px solid var(--sand-200); padding-block: 22px; margin-top: var(--space-6); }
.marquee__track { display: flex; width: max-content; animation: marquee 38s linear infinite; }
.marquee:hover .marquee__track { animation-play-state: paused; }
.marquee__group { display: flex; align-items: center; gap: 28px; padding-right: 28px; }
.marquee__item { font-family: var(--font-display); font-weight: 500; text-transform: uppercase; font-size: clamp(1.25rem, 1rem + 1.2vw, 2rem); letter-spacing: .01em; white-space: nowrap; }
.marquee .stars { color: var(--korsou-blue); width: 1.3em; height: 1em; }
@keyframes marquee { to { transform: translateX(-50%); } }

/* ---------- Section heads ---------- */
.section-head { display: flex; align-items: end; justify-content: space-between; gap: var(--space-5); margin-bottom: var(--space-6); flex-wrap: wrap; }
.section-head .h2 { max-width: 18ch; }
.link-arrow { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: var(--ink-900); text-decoration: none; font-size: var(--fs-sm); }
.link-arrow:hover { color: var(--korsou-blue); text-decoration: none; }
.link-arrow svg { width: 18px; height: 18px; transition: transform var(--t-fast) var(--ease); }
.link-arrow:hover svg { transform: translateX(3px); }

/* ---------- Category tiles ---------- */
.cats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-4); }
.cat {
  position: relative; display: grid; align-content: end; aspect-ratio: 3 / 4.4; padding: 18px;
  border-radius: var(--radius-card); overflow: hidden; color: var(--ink-900); text-decoration: none;
  background: var(--tile, var(--sand-100));
}
.cat:hover { text-decoration: none; }
.cat__img { position: absolute; inset: 8% 6% 22%; display: grid; place-items: center; transition: transform var(--t-mid) var(--ease); }
.cat__img img { max-height: 100%; width: auto; }
.cat:hover .cat__img { transform: translateY(-6px) scale(1.03); }
.cat__name { position: relative; font-family: var(--font-display); font-weight: 600; font-size: 1.15rem; line-height: 1.1; text-transform: uppercase; padding-right: 52px; }
.cat__count { position: relative; font-size: var(--fs-sm); color: var(--ink-600); }
.cat__go {
  position: absolute; right: 14px; bottom: 14px; width: 44px; height: 44px; border-radius: 50%;
  display: grid; place-items: center; background: var(--ink-900); color: var(--sand-50);
  transition: background-color var(--t-fast) var(--ease);
}
.cat:hover .cat__go { background: var(--korsou-blue); }
.cat__go svg { width: 18px; height: 18px; }
.cat--ebook .cat__img .cover { width: 52%; }
@media (max-width: 1023px) {
  .cats { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(200px, 42%); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
  .cat { scroll-snap-align: start; }
}
@media (max-width: 719px) { .cats { grid-auto-columns: 62%; } }

/* ---------- Tabs and product rail ---------- */
.tabs { display: inline-flex; gap: 4px; padding: 4px; background: var(--sand-100); border-radius: var(--radius-pill); }
.tab {
  height: 40px; padding: 0 18px; border: 0; border-radius: var(--radius-pill); background: transparent;
  font-weight: 700; font-size: var(--fs-sm); color: var(--ink-600);
}
.tab[aria-selected="true"] { background: var(--ink-900); color: var(--sand-50); }
.tab:not([aria-selected="true"]):hover { color: var(--ink-900); }
.rail { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-5) var(--space-4); }
@media (max-width: 1023px) {
  .rail { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(220px, 40%); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
  .rail > * { scroll-snap-align: start; }
}
@media (max-width: 719px) { .rail { grid-auto-columns: 72%; } }

/* ---------- Product card ---------- */
.card { position: relative; display: grid; gap: 12px; align-content: start; }
.card__media {
  position: relative; aspect-ratio: 4 / 5; border-radius: var(--radius-card); overflow: hidden;
  background: var(--sand-100);
}
.card__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 6%; transition: opacity var(--t-mid) var(--ease), transform var(--t-slow) var(--ease); }
.card__media img + img { opacity: 0; }
.card:hover .card__media img:first-child { opacity: 0; }
.card:hover .card__media img + img { opacity: 1; }
.card:hover .card__media img:only-child { opacity: 1; transform: scale(1.03); }
.card__media--book img { padding: 12% 22%; }
.card__tags { position: absolute; left: 12px; right: 62px; top: 12px; display: flex; gap: 6px; flex-wrap: wrap; z-index: 1; } /* right: clear of the heart button */
.card__tags .chip { white-space: nowrap; }
.heart-btn {
  position: absolute; right: 10px; top: 10px; z-index: 1; width: 44px; height: 44px; border-radius: 50%;
  display: grid; place-items: center; border: 0; background: rgba(251, 248, 243, .9); color: var(--ink-900);
}
.heart-btn svg { width: 20px; height: 20px; }
.heart-btn[aria-pressed="true"] svg { fill: var(--coral); stroke: var(--coral-ink); }
.heart-btn:hover { color: var(--coral-ink); }
.quick-add {
  position: absolute; left: 12px; right: 12px; bottom: 12px; z-index: 1;
  opacity: 0; transform: translateY(8px); transition: opacity var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
}
.card:hover .quick-add, .card:focus-within .quick-add { opacity: 1; transform: none; }
@media (hover: none) {
  .quick-add { opacity: 1; transform: none; left: auto; right: 10px; bottom: 10px; }
  .quick-add .btn { width: auto; box-shadow: var(--shadow-float); }
}
.size-picker {
  position: absolute; left: 12px; right: 12px; bottom: 12px; z-index: 2; padding: 14px;
  background: var(--sand-50); border-radius: 16px; box-shadow: var(--shadow-float);
}
.size-picker p { font-size: var(--fs-sm); font-weight: 700; margin-bottom: 10px; }
.size-picker .sizes { display: flex; flex-wrap: wrap; gap: 6px; }
.card__info { display: grid; gap: 4px; }
.card__row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.card__name { font-weight: 700; color: var(--ink-900); text-decoration: none; }
.card__name::after { content: ""; position: absolute; inset: 0; }
.card__name:hover { color: var(--korsou-blue); text-decoration: none; }
.card .heart-btn, .card .quick-add, .card .size-picker { z-index: 2; }
.card__sub { font-size: var(--fs-sm); color: var(--ink-600); }
.dots { display: flex; gap: 6px; }
.dot { width: 14px; height: 14px; border-radius: 50%; background: var(--c); box-shadow: inset 0 0 0 1px rgba(15, 27, 45, .18); }

/* ---------- Collection banner ---------- */
.feature-split {
  display: grid; grid-template-columns: 1.15fr 1fr; border-radius: var(--radius-card); overflow: hidden; background: var(--sand-100);
}
.feature-split__img { min-height: 420px; position: relative; }
.feature-split__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.feature-split__body { padding: clamp(28px, 4vw, 64px); display: grid; align-content: center; gap: var(--space-5); }
.feature-split__products { display: flex; gap: 10px; }
.feature-split__products a { width: 84px; aspect-ratio: 4 / 5; border-radius: 12px; background: var(--sand-50); display: grid; place-items: center; }
.feature-split__products img { width: 90%; }
.feature-split__art { position: relative; min-height: 440px; background: var(--flamingo); display: grid; place-items: center; overflow: hidden; }
.feature-split__art img { position: absolute; width: 50%; max-width: 340px; }
.feature-split__art img:first-child { left: 10%; top: 12%; transform: rotate(-6deg); }
.feature-split__art img:last-child { right: 8%; bottom: 4%; transform: rotate(5deg); }
@media (max-width: 859px) { .feature-split { grid-template-columns: 1fr; } .feature-split__img, .feature-split__art { min-height: 300px; } }

/* ---------- eBook spotlight ---------- */
.ebook {
  background: var(--korsou-blue); color: var(--sand-50); border-radius: var(--radius-hero);
  display: grid; grid-template-columns: minmax(240px, 0.8fr) 1.2fr; gap: clamp(32px, 5vw, 80px); align-items: center;
  padding: clamp(32px, 5vw, 80px); overflow: hidden; position: relative;
}
.ebook .h2 { color: var(--sand-50); }
.ebook p { color: rgba(251, 248, 243, .88); }
.ebook__stage { perspective: 1200px; display: grid; place-items: center; }
.cover {
  --rx: 0deg; --ry: -14deg;
  position: relative; width: min(320px, 78%); aspect-ratio: 2 / 3; border-radius: 4px 12px 12px 4px; overflow: hidden;
  background: var(--korsou-blue) url(../img/ebook-cover-art.svg) center / cover;
  box-shadow: -1px 0 0 rgba(251, 248, 243, .25) inset, 30px 40px 60px -20px rgba(0, 0, 0, .55), 0 0 0 1px rgba(251, 248, 243, .12);
  transform: rotateX(var(--rx)) rotateY(var(--ry)); transform-style: preserve-3d;
  transition: transform var(--t-mid) var(--ease);
  color: var(--sand-50); container-type: inline-size;
}
.cover::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4%; background: linear-gradient(90deg, rgba(0, 0, 0, .3), rgba(255, 255, 255, .08)); }
.cover__text { position: absolute; inset: 9% 9% auto; display: grid; gap: 4cqw; }
.cover__title { font-family: var(--font-display); font-weight: 600; text-transform: uppercase; font-size: 12.5cqw; line-height: .9; letter-spacing: -0.01em; }
.cover__title i { font-family: var(--font-serif); font-weight: 400; text-transform: none; font-size: 1.1em; }
.cover__sub { font-size: 4.4cqw; line-height: 1.3; opacity: .9; max-width: 80%; }
.cover__author { position: absolute; left: 9%; top: 64%; font-weight: 700; letter-spacing: .2em; font-size: 4.2cqw; }
.cover--sm { width: 100%; border-radius: 2px 6px 6px 2px; transform: none; box-shadow: 0 8px 18px -8px rgba(0, 0, 0, .5); }
.ebook__body { display: grid; gap: var(--space-5); max-width: 560px; }
.badges { display: flex; flex-wrap: wrap; gap: 8px; }
.badges .chip { background: rgba(251, 248, 243, .14); color: var(--sand-50); }
.inline-form { display: flex; gap: 8px; flex-wrap: wrap; }
.inline-form .field { flex: 1 1 220px; }
.input {
  width: 100%; height: 48px; padding: 0 18px; border-radius: var(--radius-pill);
  border: 1.5px solid var(--ink-600); background: var(--sand-50); color: var(--ink-900);
}
.input::placeholder { color: var(--ink-600); }
.on-dark .input { border-color: rgba(251, 248, 243, .55); background: rgba(251, 248, 243, .08); color: var(--sand-50); }
.on-dark .input::placeholder { color: rgba(251, 248, 243, .78); }
.fine { font-size: var(--fs-xs); color: var(--ink-600); }
.on-dark .fine { color: rgba(251, 248, 243, .8); }
.form-msg { font-size: var(--fs-sm); font-weight: 700; }
@media (max-width: 859px) { .ebook { grid-template-columns: 1fr; } .cover { width: min(240px, 70%); } }

/* ---------- Brand story ---------- */
.story { position: relative; overflow: hidden; }
.story__word {
  font-family: var(--font-display); font-weight: 600; text-transform: uppercase; line-height: .8;
  font-size: clamp(4.5rem, 18.5vw, 19rem); letter-spacing: -0.02em; white-space: nowrap;
  color: transparent; -webkit-text-stroke: 1.5px var(--ink-600); opacity: .35;
  text-align: center; user-select: none;
}
.story__stage { position: relative; display: grid; place-items: center; margin-top: calc(clamp(4.5rem, 18.5vw, 19rem) * -0.62); }
.story__photos { position: relative; width: min(980px, 100%); height: clamp(360px, 44vw, 560px); }
.story__photo { position: absolute; border-radius: var(--radius-card); overflow: hidden; box-shadow: var(--shadow-float); }
.story__photo img { width: 100%; height: 100%; object-fit: cover; }
.story__photo--a { left: 0; top: 18%; width: 26%; aspect-ratio: 4 / 5; }
.story__photo--b { left: 33%; top: 0; width: 34%; aspect-ratio: 4 / 5; }
.story__photo--c { right: 0; top: 28%; width: 26%; aspect-ratio: 4 / 5; }
.statement {
  max-width: 28ch; margin: var(--space-8) auto 0; text-align: center;
  font-size: clamp(1.5rem, 1rem + 2vw, 2.6rem); line-height: 1.25; font-weight: 500; letter-spacing: -0.01em; color: var(--ink-600);
}
.statement strong { color: var(--ink-900); font-weight: 700; }
.story__cta { display: flex; justify-content: center; margin-top: var(--space-6); }
@media (max-width: 719px) {
  .story__photos { height: 420px; }
  .story__photo--a { width: 44%; top: 34%; }
  .story__photo--b { width: 56%; left: 22%; }
  .story__photo--c { width: 40%; top: 52%; }
}

/* ---------- Value row ---------- */
.values { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); }
.value { display: grid; gap: 10px; align-content: start; padding: 24px; border-radius: var(--radius-card); background: var(--sand-100); }
.value svg { width: 28px; height: 28px; color: var(--korsou-blue); }
.value h3 { font-size: var(--fs-md); font-family: var(--font-body); font-weight: 700; line-height: 1.3; }
.value p { font-size: var(--fs-sm); color: var(--ink-600); }
@media (max-width: 1023px) { .values { grid-template-columns: 1fr 1fr; } }

/* ---------- Journal ---------- */
.journal { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.post { display: grid; gap: 14px; color: var(--ink-900); text-decoration: none; }
.post:hover { text-decoration: none; }
.post__img { aspect-ratio: 4 / 3; border-radius: var(--radius-card); overflow: hidden; }
.post__img img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--t-slow) var(--ease); }
.post:hover .post__img img { transform: scale(1.04); }
.post h3 { font-size: var(--fs-lg); font-family: var(--font-body); font-weight: 700; line-height: 1.3; letter-spacing: -0.01em; }
.post:hover h3 { color: var(--korsou-blue); }
@media (max-width: 859px) {
  .journal { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
  .post { scroll-snap-align: start; }
}

/* ---------- Newsletter ---------- */
.newsletter {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: var(--space-6); align-items: center;
  padding: clamp(28px, 4vw, 56px); border-radius: var(--radius-hero); background: var(--mint);
}
.newsletter .h2 { font-size: var(--fs-xl); }
.newsletter .input { background: var(--sand-50); }
@media (max-width: 859px) { .newsletter { grid-template-columns: 1fr; } }

/* ---------- Footer ---------- */
.site-footer { margin-top: var(--section-y); }
.site-footer__body { background: var(--ink-900); color: var(--sand-50); padding-block: var(--space-8) var(--space-6); }
.footer-grid { display: grid; grid-template-columns: 1.4fr repeat(4, minmax(0, 1fr)); gap: var(--space-6); }
.site-footer h2 { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(251, 248, 243, .75); margin-bottom: 14px; }
.site-footer ul { display: grid; gap: 8px; }
.site-footer a { color: var(--sand-50); text-decoration: none; font-size: var(--fs-sm); }
.site-footer a:hover { text-decoration: underline; }
.footer-brand { display: grid; gap: 16px; align-content: start; }
.footer-brand p { color: rgba(251, 248, 243, .8); font-size: var(--fs-sm); max-width: 32ch; }
.footer-base { display: flex; flex-wrap: wrap; gap: 16px 32px; justify-content: space-between; align-items: center; margin-top: var(--space-7); padding-top: var(--space-5); border-top: 1px solid rgba(251, 248, 243, .14); font-size: var(--fs-sm); color: rgba(251, 248, 243, .8); }
.pay { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.pay .chip { background: rgba(251, 248, 243, .1); color: var(--sand-50); border: 1px solid rgba(251, 248, 243, .2); }
.footer-base .stars { color: var(--sun); }
@media (max-width: 1023px) { .footer-grid { grid-template-columns: 1fr 1fr; } .footer-brand { grid-column: 1 / -1; } }

/* ---------- Drawers, overlays, modals ---------- */
.scrim { position: fixed; inset: 0; z-index: 90; background: rgba(15, 27, 45, .45); backdrop-filter: blur(2px); }
.drawer {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 100; width: min(440px, 100%);
  display: grid; grid-template-rows: auto auto 1fr auto; background: var(--sand-50);
  box-shadow: -20px 0 60px -20px rgba(15, 27, 45, .4);
  padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); padding-right: env(safe-area-inset-right, 0px);
  animation: slideIn var(--t-mid) var(--ease);
}
@keyframes slideIn { from { transform: translateX(100%); } }
.drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 16px 16px 12px 24px; }
.drawer__head h2 { font-family: var(--font-display); font-weight: 600; text-transform: uppercase; font-size: 1.4rem; }
.ship-progress { padding: 0 24px 16px; display: grid; gap: 10px; font-size: var(--fs-sm); }
.ship-progress__track { height: 30px; border-radius: 8px; background: var(--sand-100); overflow: hidden; position: relative; }
.ship-progress__fill { position: absolute; inset: 0 auto 0 0; background: url(../img/punda-strip.svg) repeat-x left bottom / auto 30px; transition: width var(--t-slow) var(--ease); }
.drawer__lines { overflow-y: auto; padding: 0 24px; display: grid; align-content: start; gap: 16px; border-top: 1px solid var(--sand-200); padding-top: 16px; }
.line-item { display: grid; grid-template-columns: 84px 1fr auto; gap: 14px; align-items: start; }
.line-item__img { aspect-ratio: 4 / 5; border-radius: 12px; background: var(--sand-100); display: grid; place-items: center; overflow: hidden; }
.line-item__img img { width: 88%; }
.line-item__name { font-weight: 700; line-height: 1.3; }
.line-item__meta { font-size: var(--fs-sm); color: var(--ink-600); }
.line-item__actions { display: flex; align-items: center; gap: 14px; margin-top: 10px; }
.stepper { display: inline-flex; align-items: center; border: 1.5px solid var(--ink-600); border-radius: var(--radius-pill); height: 40px; }
.stepper button { width: 40px; height: 100%; border: 0; background: none; border-radius: var(--radius-pill); display: grid; place-items: center; }
.stepper button:hover { background: var(--sand-100); }
.stepper svg { width: 16px; height: 16px; }
.stepper output, .stepper input { width: 30px; text-align: center; font-weight: 700; border: 0; background: none; font-variant-numeric: tabular-nums; }
.text-btn { display: inline-flex; align-items: center; gap: 4px; border: 0; background: none; padding: 6px 0; font-size: var(--fs-sm); font-weight: 600; color: var(--ink-600); text-decoration: underline; text-underline-offset: .2em; }
.text-btn:hover { color: var(--ink-900); }
.drawer__foot { padding: 16px 24px 24px; border-top: 1px solid var(--sand-200); display: grid; gap: 12px; }
.sum-row { display: flex; justify-content: space-between; font-weight: 700; font-size: var(--fs-md); font-variant-numeric: tabular-nums; }

.search.fcwl-block {
  position: fixed; inset: 0 0 auto; z-index: 100; background: var(--sand-50);
  padding-top: calc(env(safe-area-inset-top, 0px) + 20px); padding-bottom: 32px; box-shadow: var(--shadow-float);
  max-height: 100svh; overflow-y: auto; animation: dropIn var(--t-mid) var(--ease);
}
@keyframes dropIn { from { transform: translateY(-16px); opacity: 0; } }
.search__bar { display: flex; align-items: center; gap: 12px; }
.search__field { position: relative; flex: 1; }
.search__field svg { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); width: 22px; height: 22px; color: var(--ink-600); }
.search__field input { width: 100%; height: 60px; padding: 0 20px 0 56px; border-radius: var(--radius-pill); border: 1.5px solid var(--ink-900); background: var(--sand-50); font-size: var(--fs-md); }
.search__cols { display: grid; grid-template-columns: 1fr 2fr; gap: var(--space-7); margin-top: var(--space-6); }
.search__cols h2 { margin-bottom: 12px; color: var(--ink-600); }
.chips-row { display: flex; flex-wrap: wrap; gap: 8px; }
.chip--btn { border: 1.5px solid var(--sand-200); background: var(--sand-50); height: 36px; padding: 0 14px; font-size: var(--fs-sm); font-weight: 600; cursor: pointer; }
.chip--btn:hover { border-color: var(--ink-900); }
.suggest { display: grid; gap: 4px; }
.suggest a { display: grid; grid-template-columns: 56px 1fr auto; gap: 14px; align-items: center; padding: 8px; border-radius: 14px; color: var(--ink-900); text-decoration: none; }
.suggest a:hover, .suggest a:focus-visible { background: var(--sand-100); }
.suggest__img { aspect-ratio: 4 / 5; border-radius: 10px; background: var(--sand-100); display: grid; place-items: center; overflow: hidden; }
.suggest__img img { width: 88%; }
.suggest mark { background: var(--sun); color: inherit; border-radius: 3px; padding: 0 1px; }
@media (max-width: 719px) { .search__cols { grid-template-columns: 1fr; gap: var(--space-5); } }

.sheet {
  position: fixed; inset: 0; z-index: 100; background: var(--sand-50); overflow-y: auto;
  display: grid; grid-template-rows: auto auto 1fr auto;
  padding: calc(env(safe-area-inset-top, 0px) + 12px) max(16px, env(safe-area-inset-right, 0px)) calc(env(safe-area-inset-bottom, 0px) + 16px) max(16px, env(safe-area-inset-left, 0px));
  animation: dropIn var(--t-mid) var(--ease);
}
.sheet__top { display: flex; justify-content: space-between; align-items: center; }
.sheet .search__field input { height: 52px; }
.sheet nav { margin-top: 16px; }
.sheet details { border-bottom: 1px solid var(--sand-200); }
.sheet summary, .sheet .sheet__link {
  display: flex; justify-content: space-between; align-items: center; min-height: 56px; padding: 0 4px;
  font-family: var(--font-display); font-weight: 600; text-transform: uppercase; font-size: 1.35rem; list-style: none; cursor: pointer; color: var(--ink-900); text-decoration: none;
}
.sheet .sheet__link { border-bottom: 1px solid var(--sand-200); }
.sheet .sheet__soon { color: var(--ink-600); cursor: default; justify-content: flex-start; gap: 12px; margin: 0; }
.sheet summary::-webkit-details-marker { display: none; }
.sheet summary svg { width: 20px; height: 20px; transition: transform var(--t-fast) var(--ease); }
.sheet details[open] summary svg { transform: rotate(180deg); }
.sheet details ul { padding: 0 4px 14px; display: grid; }
.sheet details ul a { display: flex; align-items: center; min-height: 44px; color: var(--ink-900); text-decoration: none; font-weight: 600; }
.sheet__bottom { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 24px; }

.modal { border: 0; padding: 0; border-radius: var(--radius-card); width: min(680px, calc(100% - 32px)); background: var(--sand-50); color: var(--ink-900); box-shadow: var(--shadow-float); }
.modal::backdrop { background: rgba(15, 27, 45, .5); backdrop-filter: blur(2px); }
.modal__head { display: flex; justify-content: space-between; align-items: center; padding: 20px 20px 8px 28px; }
.modal__body { padding: 8px 28px 28px; display: grid; gap: 16px; }
.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; font-size: var(--fs-sm); }
.table th, .table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--sand-200); white-space: nowrap; }
.table th { font-weight: 700; }
.unit-toggle { display: inline-flex; padding: 3px; border-radius: var(--radius-pill); background: var(--sand-100); }
.unit-toggle button { height: 32px; padding: 0 14px; border: 0; border-radius: var(--radius-pill); background: none; font-weight: 700; font-size: var(--fs-sm); color: var(--ink-600); }
.unit-toggle button[aria-pressed="true"] { background: var(--ink-900); color: var(--sand-50); }

/* ---------- Product page ---------- */
.crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: var(--fs-sm); color: var(--ink-600); padding-block: 20px 8px; }
.crumbs a { color: var(--ink-600); text-decoration: none; }
.crumbs a:hover { color: var(--korsou-blue); text-decoration: underline; }
.crumbs li + li::before { content: "/"; margin-right: 8px; color: var(--sand-200); }
.crumbs [aria-current] { color: var(--ink-900); font-weight: 600; }
.pdp { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 72px); align-items: start; padding-top: 12px; }
.gallery { display: grid; grid-template-columns: 1fr 112px; gap: 12px; position: sticky; top: calc(var(--header-h) + 16px); }
.gallery__main { position: relative; aspect-ratio: 4 / 5; border-radius: var(--radius-card); background: var(--sand-100); overflow: hidden; cursor: zoom-in; }
.gallery__main img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 4%; transition: transform var(--t-mid) var(--ease); }
.gallery__main.is-zoomed img { transform: scale(1.8); cursor: zoom-out; }
.gallery__thumbs { display: grid; gap: 12px; align-content: start; }
.thumb { aspect-ratio: 4 / 5; border-radius: 14px; border: 2px solid transparent; background: var(--sand-100); padding: 0; overflow: hidden; display: grid; place-items: center; }
.thumb img { width: 92%; }
.thumb[aria-current="true"] { border-color: var(--ink-900); }
.thumb--photo img { width: 100%; height: 100%; object-fit: cover; }
.gallery__dots { display: none; }
.pdp__info { display: grid; gap: var(--space-5); }
.pdp__title-row { display: flex; justify-content: space-between; gap: 16px; align-items: start; }
.pdp__title { font-size: clamp(2.2rem, 1.5rem + 2.6vw, 3.6rem); }
.pdp__title-row .heart-btn { position: static; flex: none; border: 1.5px solid var(--sand-200); }
.rating-line { display: flex; gap: 10px; align-items: center; font-size: var(--fs-sm); color: var(--ink-600); }
.pdp__price { font-size: var(--fs-xl); font-family: var(--font-body); }
.opt { display: grid; gap: 12px; }
.opt__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.opt__head .label { color: var(--ink-600); }
.opt__head strong { font-weight: 700; }
.swatches { display: flex; flex-wrap: wrap; gap: 10px; }
.swatch {
  width: 44px; height: 44px; border-radius: 50%; border: 0; padding: 0; background: var(--c);
  box-shadow: inset 0 0 0 1px rgba(15, 27, 45, .18), 0 0 0 0 var(--ink-900);
  transition: box-shadow var(--t-fast) var(--ease);
}
.swatch[aria-checked="true"] { box-shadow: inset 0 0 0 1px rgba(15, 27, 45, .18), 0 0 0 3px var(--sand-50), 0 0 0 5px var(--ink-900); }
.sizes { display: flex; flex-wrap: wrap; gap: 8px; }
.size {
  min-width: 52px; height: 44px; padding: 0 14px; border-radius: var(--radius-pill);
  border: 1.5px solid var(--ink-600); background: var(--sand-50); font-weight: 700; font-size: var(--fs-sm);
}
.size:hover { border-color: var(--ink-900); }
.size[aria-checked="true"] { background: var(--ink-900); border-color: var(--ink-900); color: var(--sand-50); }
.size:disabled { color: var(--ink-600); border-color: var(--sand-200); background: var(--sand-100); text-decoration: line-through; cursor: not-allowed; }
.buy-row { display: grid; grid-template-columns: auto 1fr; gap: 12px; }
.buy-row .stepper { height: 52px; }
.buy-row .btn { min-height: 52px; font-size: var(--fs-base); }
.info-box { display: grid; grid-template-columns: auto 1fr; gap: 14px; padding: 18px 20px; border-radius: 16px; background: var(--sand-100); font-size: var(--fs-sm); }
.info-box svg { width: 24px; height: 24px; color: var(--korsou-blue); }
.info-box strong { display: block; font-size: var(--fs-base); margin-bottom: 2px; }
.accordion { border-top: 1px solid var(--sand-200); }
.accordion details { border-bottom: 1px solid var(--sand-200); }
.accordion summary { display: flex; justify-content: space-between; align-items: center; min-height: 60px; font-weight: 700; cursor: pointer; list-style: none; }
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary svg { width: 20px; height: 20px; transition: transform var(--t-fast) var(--ease); }
.accordion details[open] summary svg { transform: rotate(45deg); }
.accordion .acc-body { padding-bottom: 20px; color: var(--ink-600); display: grid; gap: 10px; font-size: var(--fs-sm); max-width: 60ch; }
.accordion .acc-body ul { list-style: none; display: grid; gap: 6px; }
.accordion .acc-body li { display: flex; gap: 10px; }
.accordion .acc-body li .stars { flex: none; margin-top: .35em; color: var(--korsou-blue); }
.sticky-atc {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: none;
  padding: 10px max(16px, env(safe-area-inset-right, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
  background: rgba(251, 248, 243, .94); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 -1px 0 var(--sand-200);
  align-items: center; gap: 12px; transform: translateY(110%); transition: transform var(--t-mid) var(--ease);
}
.sticky-atc.is-visible { transform: none; }
.sticky-atc__img { width: 44px; aspect-ratio: 4 / 5; border-radius: 8px; background: var(--sand-100); display: grid; place-items: center; }
.sticky-atc__img img { width: 90%; }
.sticky-atc__text { flex: 1; min-width: 0; font-size: var(--fs-sm); line-height: 1.3; }
.sticky-atc__text strong { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1023px) {
  .pdp { grid-template-columns: 1fr; }
  .gallery { position: static; grid-template-columns: 1fr; }
  .gallery__thumbs { grid-auto-flow: column; grid-auto-columns: 72px; overflow-x: auto; }
}
@media (max-width: 719px) {
  .sticky-atc { display: flex; }
  .gallery { margin-inline: calc(-1 * max(var(--page-pad), env(safe-area-inset-left, 0px))); }
  .gallery__main { border-radius: 0; }
  .gallery__thumbs { padding-inline: 16px; }
}

/* ---------- Account ("My Island") ---------- */
.acct { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); padding-top: var(--space-6); align-items: start; }
.acct-nav { position: sticky; top: calc(var(--header-h) + 16px); display: grid; gap: 2px; padding: 10px; border-radius: var(--radius-card); background: var(--sand-100); }
.acct-nav a {
  display: flex; align-items: center; gap: 12px; min-height: 46px; padding: 0 14px; border-radius: 12px;
  color: var(--ink-900); text-decoration: none; font-weight: 600; font-size: var(--fs-sm); white-space: nowrap;
}
.acct-nav a svg { width: 20px; height: 20px; color: var(--ink-600); }
.acct-nav a:hover { background: var(--sand-50); }
.acct-nav a[aria-current="page"] { background: var(--ink-900); color: var(--sand-50); }
.acct-nav a[aria-current="page"] svg { color: var(--sun); }
.acct-nav hr { border: 0; border-top: 1px solid var(--sand-200); margin: 6px 8px; }
.acct-main { display: grid; gap: var(--space-6); }
.acct-hello { display: grid; gap: 10px; }
.acct-hello h1 { font-size: var(--fs-2xl); }
.panel { border-radius: var(--radius-card); background: var(--sand-100); padding: clamp(20px, 2.6vw, 32px); display: grid; gap: var(--space-5); }
.panel--line { background: var(--sand-50); box-shadow: inset 0 0 0 1px var(--sand-200); }
.panel__head { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.panel__head h2 { font-family: var(--font-display); font-weight: 600; text-transform: uppercase; font-size: var(--fs-lg); }
.order-top { display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; }
.thumbs-stack { display: flex; }
.thumbs-stack span { width: 56px; aspect-ratio: 4 / 5; border-radius: 10px; background: var(--sand-50); display: grid; place-items: center; box-shadow: 0 0 0 3px var(--sand-100); }
.thumbs-stack span + span { margin-left: -14px; }
.thumbs-stack img { width: 88%; }
.tracker { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); position: relative; }
.tracker::before { content: ""; position: absolute; left: 12.5%; right: 12.5%; top: 15px; height: 4px; border-radius: 2px; background: var(--sand-200); }
.tracker::after { content: ""; position: absolute; left: 12.5%; top: 15px; height: 4px; border-radius: 2px; background: var(--korsou-blue); width: calc(75% * var(--p, 0)); }
.step { position: relative; z-index: 1; display: grid; justify-items: center; gap: 10px; text-align: center; font-size: var(--fs-sm); }
.step__dot { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--sand-50); box-shadow: inset 0 0 0 2px var(--sand-200); color: var(--ink-600); }
.step__dot svg { width: 18px; height: 18px; }
.step.is-done .step__dot { background: var(--korsou-blue); color: var(--sand-50); box-shadow: none; }
.step.is-current .step__dot { background: var(--sun); color: var(--ink-900); box-shadow: 0 0 0 5px rgba(247, 201, 72, .35); }
.step strong { display: block; }
.step__date { color: var(--ink-600); font-size: var(--fs-xs); }
.track-row { display: flex; flex-wrap: wrap; gap: 12px 24px; justify-content: space-between; align-items: center; padding-top: var(--space-4); border-top: 1px solid var(--sand-200); font-size: var(--fs-sm); }
.quick { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.quick a { display: grid; gap: 10px; padding: 18px; border-radius: 16px; background: var(--sand-50); box-shadow: inset 0 0 0 1px var(--sand-200); color: var(--ink-900); text-decoration: none; font-weight: 700; font-size: var(--fs-sm); }
.quick a:hover { box-shadow: inset 0 0 0 1.5px var(--ink-900); }
.quick svg { width: 24px; height: 24px; color: var(--korsou-blue); }
.quick small { font-weight: 500; color: var(--ink-600); }
.acct-cols { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-5); }
.book-row { display: grid; grid-template-columns: 96px 1fr; gap: 20px; align-items: start; }
.book-row .actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.orders { display: grid; }
.order-line { display: grid; grid-template-columns: 1fr auto auto; gap: 16px; align-items: center; padding-block: 14px; border-bottom: 1px solid var(--sand-200); font-size: var(--fs-sm); }
.order-line:last-child { border-bottom: 0; }
.order-line strong { display: block; font-size: var(--fs-base); }
.wish-mini { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.wish-mini a { display: grid; gap: 6px; color: var(--ink-900); text-decoration: none; font-size: var(--fs-sm); font-weight: 600; }
.wish-mini span.img { aspect-ratio: 4 / 5; border-radius: 12px; background: var(--sand-50); display: grid; place-items: center; }
.wish-mini img { width: 88%; }
@media (max-width: 1023px) {
  .acct { grid-template-columns: 1fr; padding-top: var(--space-4); }
  .acct-nav { position: static; display: flex; overflow-x: auto; padding: 6px; border-radius: var(--radius-pill); scroll-snap-type: x proximity; }
  .acct-nav a { border-radius: var(--radius-pill); min-height: 44px; scroll-snap-align: start; }
  .acct-nav hr { display: none; }
  .quick { grid-template-columns: 1fr 1fr; }
  .acct-cols { grid-template-columns: 1fr; }
}
@media (max-width: 719px) {
  .order-top { grid-template-columns: 1fr auto; }
  .order-top .thumbs-stack { display: none; }
  .step__date { display: none; }
  .order-line { grid-template-columns: 1fr auto; }
  .order-line .btn { grid-column: 1 / -1; justify-self: start; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; animation-delay: 0ms !important; transition-duration: 1ms !important; scroll-behavior: auto !important; }
  .marquee__track { animation: none; }
  .hero__media { animation: none !important; transform: none; }
  .loadbar { display: none; }
  .cover { transform: rotateY(-14deg) !important; }
}

/* ---------- WordPress glue ---------- */
/* Template parts render a wrapper; the header inside sticks to the page and the hero slides under it. */
.fcwl-header-part, .fcwl-footer-part { display: contents; }
.wp-site-blocks > * { margin-block-start: 0; }
.wp-site-blocks > main, .wp-site-blocks main#main { min-height: 40vh; }
.admin-bar .site-header { top: var(--wp-admin--admin-bar--height, 32px); }
.fcwl-block.alignfull { max-width: none; }
.wp-block-fcwl-hero.hero { margin: calc(var(--frame-inset) - var(--header-h)) var(--frame-inset) 0; width: auto; }
/* Homepage sections space themselves; drop WordPress's default gap between them. */
.fcwl-stack > * { margin-block: 0; }
.fcwl-stack > .wp-block-fcwl-hero.hero { margin-block-start: calc(var(--frame-inset) - var(--header-h)); }

/* WooCommerce's ".woocommerce img { height: auto }" would otherwise blow the logo up on store pages. */
.brand img.brand__mark { height: 48px; width: auto; max-width: none; }
@media (max-width: 719px) { .brand img.brand__mark { height: 40px; } }

/* Pieces the prototype styled inline */
.ebook__buy { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.ebook__chapter { display: grid; gap: 10px; }
.newsletter__intro, .newsletter__form { display: grid; gap: 12px; }
.card__media--book { display: grid; place-items: center; padding: 12% 20%; }
.cover--image { background: none; }
.cover--image::before { display: none; }
.cover--image img { width: 100%; height: 100%; object-fit: cover; }
.sheet .sheet__search { justify-content: flex-start; margin-top: 16px; padding-left: 20px; }
.sheet .sheet__search svg { position: static; transform: none; width: 20px; height: 20px; }
.mega h3 a { color: inherit; text-decoration: none; }
.mega h3 a:hover { color: var(--korsou-blue); }
.mega__collection .ph--art img { position: static; }

/* ---------- Page and Journal ---------- */
.fcwl-page-title { padding-block: var(--space-7) var(--space-5); }
.fcwl-page-title .lede { margin-top: var(--space-4); }
.wp-block-post-content :where(ul, ol) { padding-left: 1.4em; }
.wp-block-post-content > :where(h2) { font-size: var(--fs-lg); margin-top: var(--space-6); }
/* The design's narrower .lede would otherwise sit centered, out of line with the text. */
.wp-block-post-content.is-layout-constrained > .lede { max-width: var(--wp--style--global--content-size); }
/* Page drafts waiting for the owner: a clear note on top and a marker on each missing detail. */
.fcwl-draft-note { padding: 12px 16px; border-radius: 12px; background: #FDF1CC; color: #4F3D00; font-size: var(--fs-sm); font-weight: 600; }
mark.fcwl-missing { background: #FDF1CC; color: #4F3D00; padding: 0 4px; border-radius: 4px; box-shadow: inset 0 0 0 1px #E2C66A; }
.fcwl-facts { list-style: none; padding-left: 0 !important; display: grid; gap: 8px; }
.cats--collections { margin-top: var(--space-6); }
/* The tile's small line under the name: near-black, so it reads on every tile color (9:1 or better) */
.cat__count { color: var(--ink-900); }
@media (min-width: 1024px) { .cats.cats--collections { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); } }
.fcwl-journal .journal { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-7) var(--space-5); padding: 0; margin: 0; list-style: none; }
.journal .wp-block-post { margin: 0; }
.journal .post { display: grid; gap: 12px; }
.journal .post__img { margin: 0; border-radius: var(--radius-card); overflow: hidden; }
.journal .post__img img { transition: transform var(--t-slow) var(--ease); }
.journal .post:hover .post__img img { transform: scale(1.04); }
.journal .post__title { font-family: var(--font-body); font-weight: 700; font-size: var(--fs-lg); line-height: 1.3; letter-spacing: -0.01em; text-transform: none; }
.journal .post__title a { color: var(--ink-900); text-decoration: none; }
.journal .post__title a:hover { color: var(--korsou-blue); }
.journal .wp-block-post-terms a { color: inherit; text-decoration: none; }
.section .journal { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
@media (max-width: 859px) {
  .section .journal { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
  .section .journal > * { scroll-snap-align: start; }
  .fcwl-journal .journal { grid-template-columns: 1fr; }
}
.link-arrow a { color: inherit; text-decoration: none; }
.link-arrow a::after { content: " \2192"; }
.fcwl-pagination { margin-top: var(--space-7); gap: 8px; }
.fcwl-pagination a, .fcwl-pagination .current { display: inline-grid; place-items: center; min-width: 44px; height: 44px; padding: 0 12px; border-radius: var(--radius-pill); text-decoration: none; color: var(--ink-900); font-weight: 700; }
.fcwl-pagination .current { background: var(--ink-900); color: var(--sand-50); }

/* Journal article: a calm reading layout */
.fcwl-article__head { display: grid; gap: 12px; padding-block: var(--space-7) var(--space-5); }
.fcwl-article__head .wp-block-post-title { font-size: var(--fs-2xl); }
.fcwl-article__head a { color: inherit; text-decoration: none; }
.fcwl-article__image { border-radius: var(--radius-hero); overflow: hidden; margin-block: var(--space-5) var(--space-7); }
.fcwl-article__body { font-size: 1.1rem; line-height: 1.75; }
.fcwl-article__body > * + * { margin-block-start: 1.2em; }
.fcwl-article__body h2 { font-size: var(--fs-xl); margin-block-start: 1.8em; }
.fcwl-article .punda { margin-block: var(--space-8) var(--space-5); }
.fcwl-article__nav a { font-weight: 700; color: var(--ink-900); }

/* 404 */
.fcwl-404 { padding-block: var(--space-9) var(--space-6); display: grid; gap: var(--space-5); }
.fcwl-404 h1 { font-size: var(--fs-2xl); }
.wp-block-search__inside-wrapper { gap: 8px; border: 0; padding: 0; }
.wp-block-search__input { height: 52px; padding: 0 20px; border-radius: var(--radius-pill); border: 1.5px solid var(--ink-600); background: var(--sand-50); }
.wp-block-search__button { margin: 0; }
.fcwl-404 .wp-block-search { width: min(100%, 480px); margin-inline: auto; }
.fcwl-404 .wp-block-search__inside-wrapper { width: 100% !important; }

/* ---------- WooCommerce mini-cart (header icon and drawer) ---------- */
.header-actions .wc-block-mini-cart { display: inline-flex; }
.header-actions .wc-block-mini-cart__button { position: relative; width: 44px; height: 44px; padding: 0; border-radius: 50%; color: inherit; display: inline-grid; place-items: center; }
.header-actions .wc-block-mini-cart__button:hover { background: rgba(15, 27, 45, .07); }
.is-over-hero:not(.is-solid) .header-actions .wc-block-mini-cart__button:hover { background: rgba(251, 248, 243, .14); }
.header-actions .wc-block-mini-cart__icon { width: 22px; height: 22px; }
.header-actions .wc-block-mini-cart__badge { position: absolute; top: 4px; right: 2px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--sun) !important; color: var(--ink-900) !important; font-size: 11px; font-weight: 700; line-height: 18px; border: 0; transform: none; margin: 0; }
.wc-block-mini-cart__drawer .components-modal__content { background: var(--sand-50); }
.wc-block-mini-cart__drawer .wc-block-mini-cart__title { font-family: var(--font-display); font-weight: 600; text-transform: uppercase; font-size: 1.4rem; letter-spacing: 0; }
.wc-block-mini-cart__drawer .wc-block-cart-item__image img { border-radius: 12px; background: var(--sand-100); aspect-ratio: 4 / 5; object-fit: contain; }
.wc-block-mini-cart__drawer .wc-block-components-button:not(.is-link) { border-radius: var(--radius-pill); min-height: 48px; font-weight: 700; }
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-checkout { background: var(--ink-900); color: var(--sand-50); border: 0; }
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-checkout:hover { background: var(--korsou-blue); }
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-cart { border: 1.5px solid var(--ink-900); color: var(--ink-900); background: transparent; }

/* ---------- Shop, category, collection and search pages ---------- */
.woocommerce-breadcrumb, .fcwl-crumbs { padding-top: 20px; font-size: var(--fs-sm); color: var(--ink-600); }
.woocommerce-breadcrumb a { color: var(--ink-600); text-decoration: none; }
.woocommerce-breadcrumb a:hover { color: var(--korsou-blue); text-decoration: underline; }
.fcwl-shop__head { display: grid; gap: 12px; padding-block: 12px var(--space-6); }
.fcwl-shop__head .wp-block-query-title { font-size: var(--fs-2xl); }
.fcwl-shop__layout { display: grid; grid-template-columns: 236px minmax(0, 1fr); gap: var(--space-7); align-items: start; padding-bottom: var(--section-y); }
.fcwl-shop__filters { position: sticky; top: calc(var(--header-h) + 16px); }
.fcwl-shop .wc-block-product-filters { display: flex; flex-direction: column; gap: 28px; }
.fcwl-shop .wc-block-product-filters h3.label { color: var(--ink-600); margin: 0 0 10px; font-family: var(--font-body); }
.fcwl-shop .wc-block-product-filter-checkbox-list__items { display: grid; gap: 4px; }
.fcwl-shop .wc-block-product-filter-checkbox-list__label { display: flex; align-items: center; gap: 10px; min-height: 36px; font-size: var(--fs-sm); cursor: pointer; }
.fcwl-shop .wc-block-product-filter-checkbox-list__input { accent-color: var(--ink-900); }
.fcwl-shop .has-swatch .wc-block-product-filter-checkbox-list__mark, .fcwl-shop .has-swatch::before { box-shadow: inset 0 0 0 1px rgba(15, 27, 45, .2); }
.fcwl-shop .wc-block-product-filter-chips__items { display: flex; flex-wrap: wrap; gap: 6px; }
.fcwl-shop .wc-block-product-filter-chips__item { min-width: 44px; height: 40px; padding: 0 12px; border-radius: var(--radius-pill); border: 1.5px solid var(--ink-600); background: var(--sand-50); color: var(--ink-900); font-weight: 700; font-size: var(--fs-sm); }
.fcwl-shop .wc-block-product-filter-chips__item[aria-checked="true"] { background: var(--ink-900); border-color: var(--ink-900); color: var(--sand-50); }
.fcwl-shop .wc-block-product-filter-price-slider input[type="text"] { width: 76px; height: 40px; border-radius: 10px; border: 1.5px solid var(--ink-600); background: var(--sand-50); padding: 0 10px; font-size: var(--fs-sm); }
.fcwl-shop .wc-block-product-filter-price-slider input[type="range"] { accent-color: var(--ink-900); }
.fcwl-shop__toolbar { align-items: center; gap: 12px; margin-bottom: var(--space-5); }
.fcwl-shop .woocommerce-result-count { margin: 0; color: var(--ink-600); font-size: var(--fs-sm); }
.fcwl-shop select.orderby, .fcwl-shop .wc-block-catalog-sorting select {
  height: 44px; padding: 0 40px 0 18px; border-radius: var(--radius-pill); border: 1.5px solid var(--ink-600); background: var(--sand-50); color: var(--ink-900); font-weight: 600; font-size: var(--fs-sm);
}
.fcwl-grid.wc-block-product-template { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-7) var(--space-4); list-style: none; margin: 0; padding: 0; }
.fcwl-grid.wc-block-product-template > li { width: auto !important; margin: 0 !important; max-width: none !important; }
.fcwl-load-more { margin-top: var(--space-7); }
.fcwl-load-more a { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 28px; border-radius: var(--radius-pill); border: 1.5px solid var(--ink-900); color: var(--ink-900); font-weight: 700; text-decoration: none; }
.fcwl-load-more a:hover { background: var(--ink-900); color: var(--sand-50); }
.fcwl-load-more a[aria-busy="true"] { opacity: .6; pointer-events: none; }
.fcwl-empty { padding: var(--space-6); border-radius: var(--radius-card); background: var(--sand-100); }
/* Phone filter panel (WooCommerce's overlay): a button that matches our pills, and a sand sheet. */
.fcwl-shop .wc-block-product-filters__open-overlay { display: none; }
@media (width <= 1023px) { .fcwl-shop .wc-block-product-filters.is-mobile-overlay .wc-block-product-filters__open-overlay { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 20px; border-radius: var(--radius-pill); border: 1.5px solid var(--ink-900); background: transparent; color: var(--ink-900); font-weight: 700; } }
.fcwl-shop .wc-block-product-filters__overlay-content, .fcwl-shop .wc-block-product-filters__overlay-dialog { background: var(--sand-50); }
.fcwl-shop .wc-block-product-filters__apply { border-radius: var(--radius-pill); background: var(--ink-900); color: var(--sand-50); min-height: 48px; width: 100%; }
@media (max-width: 1023px) {
  .fcwl-shop__layout { grid-template-columns: 1fr; gap: var(--space-4); }
  .fcwl-shop__filters { position: static; }
  .fcwl-grid.wc-block-product-template { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6) var(--space-3); }
}
@media (max-width: 719px) {
  .fcwl-grid .card__tags .chip:nth-child(n+2) { display: none; }
  .fcwl-grid .card__row { flex-direction: column; align-items: flex-start; gap: 2px; }
  .fcwl-grid .card__name { font-size: var(--fs-sm); }
}
.fcwl-grid--4.wc-block-product-template { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1023px) { .fcwl-grid--4.wc-block-product-template { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- Product page ---------- */
.fcwl-product-page .pdp { padding-top: 12px; }
.pdp__info > * { margin-block: 0 !important; }
.pdp__info .pdp__title { font-size: clamp(2.2rem, 1.5rem + 2.6vw, 3.6rem); overflow-wrap: break-word; text-wrap: balance; }
.pdp__info .pdp__title.pdp__title--long { font-size: clamp(1.75rem, 1.25rem + 1.7vw, 2.6rem); }
/* The fit note from the product's size chart ("This hoodie runs small...") */
.size-guide__note { padding: 10px 14px; border-radius: 12px; background: var(--sand-100); font-weight: 600; }
/* Saved items: the sprite's heart reads its fill from --icon-fill. */
.heart-btn[aria-pressed="true"] { --icon-fill: var(--coral); color: var(--coral-ink); }
.pdp__title-row .heart-btn--page { position: static; flex: none; border: 1.5px solid var(--sand-200); }
.pdp__price, .pdp__price .wc-block-components-product-price { font-size: var(--fs-xl); font-weight: 700; }
.pdp__price del { color: var(--ink-600); font-weight: 500; font-size: .6em; }
.pdp__price ins { text-decoration: none; color: var(--coral-ink); }
.pdp__summary { color: var(--ink-600); max-width: 52ch; }
.product-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.product-badges a.chip { text-decoration: none; }

/* Gallery: 4:5 main image on sand, thumbnails in a column on the right (a row on phones). */
.pdp__gallery { position: sticky; top: calc(var(--header-h) + 16px); }
.pdp__gallery .wc-block-product-gallery {
  --wc-block-product-gallery-large-image-ratio-width: 4; --wc-block-product-gallery-large-image-ratio-height: 5;
  display: grid; grid-template-columns: minmax(0, 1fr) 104px; gap: 12px; align-items: start;
}
.pdp__gallery .wc-block-product-gallery-large-image { border-radius: var(--radius-card); background: var(--sand-100); }
.pdp__gallery .wc-block-product-gallery-large-image img { object-fit: contain !important; }
.pdp__gallery .wc-block-product-gallery-thumbnails { width: auto !important; }
.pdp__gallery .wc-block-product-gallery-thumbnails__scrollable { display: grid; gap: 12px; max-height: none; overflow: visible; }
.pdp__gallery .wc-block-product-gallery-thumbnails__thumbnail { border-radius: 14px; overflow: hidden; background: var(--sand-100); }
.pdp__gallery .wc-block-product-gallery-thumbnails__thumbnail__image { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: contain; border: 2px solid transparent; border-radius: 14px; }
.pdp__gallery .wc-block-product-gallery-thumbnails__thumbnail__image--is-active { border-color: var(--ink-900); }
.pdp__gallery .wc-block-next-previous-buttons__button { width: 44px; height: 44px; border-radius: 50%; background: rgba(251, 248, 243, .9); border: 0; }
@media (max-width: 1023px) {
  .pdp__gallery { position: static; }
  .pdp__gallery .wc-block-product-gallery { grid-template-columns: 1fr; }
  .pdp__gallery .wc-block-product-gallery-thumbnails__scrollable { grid-auto-flow: column; grid-auto-columns: 72px; overflow-x: auto; }
}

/* Options (WooCommerce's pills), quantity and Add to cart */
.pdp__buy { display: grid; gap: 18px; }
.pdp__buy .wp-block-woocommerce-add-to-cart-with-options-variation-selector-attribute-name, .pdp__buy .wc-block-add-to-cart-with-options-variation-selector-attribute-name { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-600); }
.pdp__buy .wc-block-product-filter-chips__items { display: flex; flex-wrap: wrap; gap: 8px; }
.pdp__buy .wc-block-product-filter-chips__item {
  min-width: 52px; height: 44px; padding: 0 16px; border-radius: var(--radius-pill);
  border: 1.5px solid var(--ink-600); background: var(--sand-50); color: var(--ink-900); font-weight: 700; font-size: var(--fs-sm);
}
.pdp__buy .wc-block-product-filter-chips__item:hover { border-color: var(--ink-900); }
.pdp__buy .wc-block-product-filter-chips__item[aria-checked="true"] { background: var(--ink-900); border-color: var(--ink-900); color: var(--sand-50); }
.pdp__buy .wc-block-product-filter-chips__item:disabled, .pdp__buy .wc-block-product-filter-chips__item[aria-disabled="true"] { color: var(--ink-600); border-color: var(--sand-200); background: var(--sand-100); text-decoration: line-through; }
.pdp__buy .has-swatch { display: inline-flex; align-items: center; gap: 8px; }
.pdp__buy .has-swatch::before, .fcwl-shop .has-swatch::before { content: ""; width: 18px; height: 18px; border-radius: 50%; background: var(--swatch); box-shadow: inset 0 0 0 1px rgba(15, 27, 45, .2); flex: none; }
.fcwl-shop input.has-swatch { appearance: none; -webkit-appearance: none; width: 20px; height: 20px; margin: 0; border-radius: 50%; background: var(--swatch); box-shadow: inset 0 0 0 1px rgba(15, 27, 45, .25); }
.fcwl-shop input.has-swatch::before { display: none; }
.fcwl-shop input.has-swatch:checked { box-shadow: 0 0 0 2px var(--sand-50), 0 0 0 4px var(--ink-900); }
.fcwl-shop input.has-swatch + .wc-block-product-filter-checkbox-list__mark { display: none; }
.pdp__buy .wc-block-components-quantity-selector { border: 1.5px solid var(--ink-600); border-radius: var(--radius-pill); height: 52px; overflow: hidden; }
.pdp__buy .wc-block-components-quantity-selector input { font-weight: 700; }
.pdp__buy .wp-block-woocommerce-product-button { flex: 1; }
.pdp__buy .wp-block-woocommerce-product-button .wp-block-button__link,
.pdp__buy .wc-block-components-product-button__button { width: 100%; min-height: 52px; border-radius: var(--radius-pill); background: var(--ink-900); color: var(--sand-50); font-weight: 700; font-size: var(--fs-base); }
.pdp__buy .wc-block-components-product-button__button:hover:not(:disabled, .disabled) { background: var(--korsou-blue); }
/* Before a size is chosen (WooCommerce adds .disabled and fades the button to half): solid sand with
   dark text instead, readable at 5.6:1 */
.pdp__buy .wc-block-components-product-button__button:disabled,
.pdp__buy .wc-block-components-product-button__button.disabled { opacity: 1; background: var(--sand-200); color: var(--ink-600) !important; cursor: not-allowed; }
.size-guide .text-btn svg { width: 18px; height: 18px; }

/* Accordions from WordPress's own Details block */
.accordion { border-top: 1px solid var(--sand-200); }
.accordion .wp-block-details { border-bottom: 1px solid var(--sand-200); margin: 0; }
.accordion .wp-block-details summary { display: flex; justify-content: space-between; align-items: center; min-height: 60px; font-weight: 700; cursor: pointer; list-style: none; }
.accordion .wp-block-details summary::-webkit-details-marker { display: none; }
.accordion .wp-block-details summary::after { content: "+"; font-size: 1.5rem; font-weight: 400; line-height: 1; }
.accordion .wp-block-details[open] summary::after { content: "\2212"; }
.accordion .wp-block-details > :not(summary) { padding-bottom: 20px; margin: 0; color: var(--ink-600); font-size: var(--fs-sm); max-width: 60ch; }
/* Product descriptions (tools/catalog): small headings and a plain list */
.accordion .wp-block-woocommerce-product-description > * { margin: 0; }
.accordion .wp-block-woocommerce-product-description > * + * { margin-top: 10px; }
.accordion .wp-block-woocommerce-product-description h3 { margin-top: 20px; font-size: var(--fs-sm); font-weight: 700; color: var(--ink-900); }
.accordion .wp-block-woocommerce-product-description ul { display: grid; gap: 4px; padding-left: 1.2em; }
.care-list { display: grid; gap: 6px; list-style: none; padding: 0; margin: 0 0 20px; color: var(--ink-600); font-size: var(--fs-sm); }
.care-list li { display: flex; gap: 10px; }
.care-list .stars { flex: none; margin-top: .35em; color: var(--korsou-blue); }

/* Related, recently viewed, reviews */
.fcwl-related { padding-block: var(--section-y) var(--space-7); }
.fcwl-related .h2 { margin-bottom: var(--space-6); }
.fcwl-reviews { padding-block: var(--space-7) var(--section-y); max-width: 760px; }
.fcwl-reviews .woocommerce-Reviews-title, .fcwl-reviews #reply-title { font-family: var(--font-display); font-weight: 600; text-transform: uppercase; font-size: var(--fs-lg); }
.fcwl-reviews .comment-form { display: grid; gap: 14px; margin-top: 16px; }
.fcwl-reviews .comment-form input[type="text"], .fcwl-reviews .comment-form input[type="email"], .fcwl-reviews .comment-form textarea, .fcwl-reviews .comment-form select {
  width: 100%; padding: 12px 16px; border-radius: 14px; border: 1.5px solid var(--ink-600); background: var(--sand-50);
}
.fcwl-reviews .comment-form .submit { min-height: 48px; padding: 0 28px; border-radius: var(--radius-pill); border: 0; background: var(--ink-900); color: var(--sand-50); font-weight: 700; }
.sticky-atc .price del { display: none; }
.pdp__buy .opt { display: grid; gap: 10px; margin: 0 0 6px; }
.pdp__buy .wp-block-woocommerce-add-to-cart-with-options-variation-selector { display: grid; gap: 14px; }
.pdp__buy .buy-row { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: stretch; margin: 0; }
.pdp__buy .wp-block-woocommerce-product-stock-indicator:empty, .pdp__buy .wp-block-woocommerce-add-to-cart-with-options-variation-description:empty { display: none; }
.pdp__buy > *, .pdp__buy .wp-block-group > * { margin-block: 0; }
.pdp__buy .size-guide { margin-top: -6px; }
.pdp__buy .wc-block-components-quantity-selector { display: inline-flex; align-items: center; min-width: 132px; }
.pdp__buy .wc-block-components-quantity-selector input { width: 44px; border: 0 !important; background: transparent; box-shadow: none; text-align: center; -moz-appearance: textfield; }
.pdp__buy .wc-block-components-quantity-selector input::-webkit-inner-spin-button { -webkit-appearance: none; }
.pdp__buy .wc-block-components-quantity-selector__button { width: 44px; height: 100%; border: 0; background: none; font-size: 1.25rem; color: var(--ink-900); }
.pdp__gallery .wc-block-product-gallery-thumbnails__thumbnail { aspect-ratio: 4 / 5 !important; flex-basis: auto !important; }
.pdp__buy .wp-block-add-to-cart-with-options-quantity-selector { border: 0; padding: 0; background: none; box-shadow: none; }
.pdp__gallery .wc-block-product-gallery-thumbnails__thumbnail { width: 100%; }
@media (max-width: 1023px) { .pdp__gallery .wc-block-product-gallery-thumbnails__thumbnail { width: 72px; } }
.pdp__gallery .wc-block-product-gallery-thumbnails { aspect-ratio: auto !important; height: auto !important; }

/* ---------- eBook page ---------- */
.ebook-panel { display: grid; place-items: center; padding: clamp(32px, 6vw, 80px) 24px; border-radius: var(--radius-hero); background: var(--korsou-blue); }
.ebook-cover-stage { perspective: 1200px; width: 100%; display: grid; place-items: center; }
.ebook-cover-stage .cover { width: min(340px, 74%); }
.ebook-facts { display: grid; gap: 10px; }
.ebook-facts__author { font-family: var(--font-serif); font-style: italic; font-size: var(--fs-lg); color: var(--ink-600); }
.ebook-facts .badges .chip { background: var(--sand-100); color: var(--ink-900); }
.free-chapter { display: grid; gap: 10px; padding: 20px; border-radius: var(--radius-card); box-shadow: inset 0 0 0 1px var(--sand-200); }
.free-chapter .label { color: var(--ink-600); }
.toc-list { margin: 0 0 20px; padding-left: 1.4em; display: grid; gap: 6px; color: var(--ink-600); font-size: var(--fs-sm); }

/* ---------- Cart and checkout (WooCommerce blocks, restyled) ---------- */
.fcwl-cart-page, .fcwl-checkout-page { padding-bottom: var(--section-y); }
.fcwl-import-note { margin: 12px 0 0; font-size: var(--fs-xs); line-height: 1.5; color: var(--ink-600); }
.fcwl-checkout-page { padding-top: var(--space-6); }
.wc-block-cart, .wc-block-checkout { font-size: var(--fs-base); }
.wc-block-cart .wc-block-cart-items th, .wc-block-checkout .wc-block-components-title { font-family: var(--font-body); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: var(--fs-xs); color: var(--ink-600); }
.wc-block-components-product-name { color: var(--ink-900); font-weight: 700; text-decoration: none; }
:is(.wc-block-cart-items, .wc-block-components-order-summary, .wc-block-mini-cart__drawer) .wc-block-components-product-name { font-weight: 700; }
/* Line items keep their options (color, size) but not the product blurb, which repeats the product page. */
:is(.wc-block-cart-items, .wc-block-components-order-summary, .wc-block-mini-cart__drawer) .wc-block-components-product-metadata__description { display: none; }
.wc-block-cart-item__image img, .wc-block-components-order-summary-item__image img { border-radius: 12px; background: var(--sand-100); aspect-ratio: 4 / 5; object-fit: contain; }
.wc-block-components-button:not(.is-link) { border-radius: var(--radius-pill); min-height: 52px; font-weight: 700; }
.wc-block-components-button.contained, .wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button { background: var(--ink-900); color: var(--sand-50); border: 0; }
.wc-block-components-button.contained:hover, .wc-block-cart__submit-button:hover, .wc-block-components-checkout-place-order-button:hover { background: var(--korsou-blue); color: var(--sand-50); }
.wc-block-components-text-input input, .wc-block-components-select select, .wc-block-components-combobox .components-combobox-control input, .wc-blocks-components-select__select {
  border-radius: 14px !important; border: 1.5px solid var(--ink-600) !important; background: var(--sand-50) !important;
}
.wc-block-components-text-input.is-active input, .wc-block-components-text-input input:focus { border-color: var(--ink-900) !important; box-shadow: 0 0 0 1px var(--ink-900) !important; }
.wc-block-components-sidebar .wc-block-components-panel, .wc-block-components-totals-wrapper { border-color: var(--sand-200) !important; }
.wc-block-cart__sidebar, .wp-block-woocommerce-checkout-order-summary-block { background: var(--sand-100); border-radius: var(--radius-card); padding: 8px 20px; border: 0 !important; }
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value { font-size: var(--fs-lg); font-weight: 700; }
.wc-block-components-radio-control__option, .wc-block-components-radio-control-accordion-option { border-radius: 14px; }
.wc-block-components-notice-banner { border-radius: 14px; }
.wc-block-cart .wc-block-cart__empty-cart__title { font-family: var(--font-display); font-weight: 600; text-transform: uppercase; font-size: var(--fs-xl); }

/* Focused checkout header */
.checkout-header .site-header__inner { grid-template-columns: 1fr auto 1fr; }
.checkout-header__secure { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-weight: 700; font-size: var(--fs-sm); }
.checkout-header__secure svg { width: 18px; height: 18px; color: var(--lagoon-ink); }
.checkout-header .link-back { justify-self: end; font-weight: 600; font-size: var(--fs-sm); color: var(--ink-900); }
@media (max-width: 719px) { .checkout-header .site-header__inner { grid-template-columns: auto 1fr; } .checkout-header .link-back { display: none; } .checkout-header__secure { justify-self: end; } }

/* Thank-you page */
.fcwl-thanks { padding-block: var(--space-7) var(--section-y); }
.fcwl-thanks__head { display: grid; gap: 12px; margin-bottom: var(--space-6); }
.fcwl-thanks__head h1 { font-size: var(--fs-2xl); }
.fcwl-thanks .wc-block-order-confirmation-status p { color: var(--ink-600); font-size: var(--fs-md); }
.fcwl-thanks .wc-block-order-confirmation-summary { background: var(--sand-100); border-radius: var(--radius-card); padding: 20px 24px; }
.fcwl-thanks h2.h3 { margin-block: var(--space-6) var(--space-4); }
.next-steps { margin-block: var(--space-6); }
.next-steps__list { list-style: none; padding: 0; margin: var(--space-4) 0 0; display: grid; gap: 14px; }
.next-steps__list li { display: grid; grid-template-columns: 40px 1fr; gap: 14px; align-items: start; }
.next-steps__num { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--sun); font-weight: 700; }
.next-steps__list strong { display: block; }
.next-steps__list span:last-child { color: var(--ink-600); }

/* Coming soon screen */
.coming-soon { position: relative; min-height: 100svh; display: grid; color: var(--sand-50); background: var(--ink-900); overflow: hidden; isolation: isolate; }
.coming-soon__media, .coming-soon__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.coming-soon__scrim { position: absolute; inset: 0; z-index: -1; background: linear-gradient(20deg, rgba(15, 27, 45, .92) 0%, rgba(15, 27, 45, .78) 38%, rgba(15, 27, 45, .25) 75%); }
.coming-soon__inner { display: grid; grid-template-rows: auto 1fr auto; gap: var(--space-6); padding-block: 28px 72px; min-height: 100svh; }
.coming-soon__copy { align-self: end; display: grid; gap: var(--space-5); max-width: 760px; }
.coming-soon .hero__title { font-size: clamp(3rem, 1.4rem + 7vw, 8rem); }
.coming-soon .hero__sub { max-width: 52ch; }
.coming-soon .input { background: rgba(251, 248, 243, .1); border-color: rgba(251, 248, 243, .55); color: var(--sand-50); }
.coming-soon .input::placeholder { color: rgba(251, 248, 243, .8); }
.coming-soon__owner a { color: rgba(251, 248, 243, .85); font-size: var(--fs-sm); }
.coming-soon__strip { position: absolute; left: 0; right: 0; bottom: 0; }
.coming-soon .form-msg { color: var(--sand-50); }
.fcwl-thanks .thanks-heading { font-size: var(--fs-2xl); margin: 0; }
/* With our heading present, WooCommerce's status title becomes a quiet subtitle (screen readers still hear it). */
.fcwl-thanks__head:has(.thanks-heading) .wc-block-order-confirmation-status h1 { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.fcwl-thanks .wc-block-order-confirmation-status h1 { font-size: var(--fs-xl); }

/* ---------- My Island account (WooCommerce My Account, restyled) ---------- */
.fcwl-account-page { padding-block: var(--space-6) var(--section-y); }
.fcwl-account-page .acct { padding-top: 0; }
/* WooCommerce caps account pages at 1000px in block themes; the account grid uses the full container. */
:root .woocommerce-account main .woocommerce { max-width: none; }
/* WooCommerce floats the menu and content at 30% and 68%; the grid lays them out instead. */
:root .woocommerce-account .acct > .woocommerce-MyAccount-navigation,
:root .woocommerce-account .acct > .woocommerce-MyAccount-content { float: none; width: auto; margin: 0; }
.acct-main > *, .acct-hello > *, .panel > *, .panel__head > *, .acct-empty p, .book-row p { margin: 0; }
.acct-hello { gap: 8px; }
.acct-hello p { max-width: 60ch; }
.order-top__meta { font-size: var(--fs-sm); }
.thumbs-stack span { overflow: hidden; }
.thumbs-stack img { width: 100%; height: 100%; object-fit: cover; }
.step { align-content: start; }
.track-row p { margin: 0; }
.track-row__actions, .order-line__actions, .book-row .actions { display: flex; flex-wrap: wrap; gap: 8px; }
.order-line__actions { justify-content: flex-end; }
.order-line__num { color: inherit; text-decoration: none; }
.order-line__num:hover { text-decoration: underline; }
.tabular { font-variant-numeric: tabular-nums; }
@media (min-width: 1024px) { .acct-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.book-row a:not(.btn) { color: inherit; text-decoration: none; }
.book-row a:not(.btn):hover { text-decoration: underline; }
.book-row__meta { font-size: var(--fs-sm); margin-top: 4px !important; }
.book-row .fine { margin-top: 10px; }
.book-row form.inline { display: contents; }
.ebook-list { display: grid; gap: var(--space-5); }
.ebook-list .book-row { grid-template-columns: 120px 1fr; }
.wish-mini span.img { overflow: hidden; background: var(--sand-100); }
.wish-mini img { width: 100%; height: 100%; object-fit: cover; }
.wish-mini .price { color: var(--ink-600); font-weight: 500; }
.wish-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: var(--space-6) var(--space-5); }
.wish-grid:empty { display: none; }
@media (max-width: 599px) { .wish-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5) 12px; } }
.acct-empty { justify-items: start; }
.acct-pages { display: flex; justify-content: space-between; gap: 12px; }
.fcwl-order-progress { margin-block: var(--space-5); }
@media (max-width: 719px) {
  .order-line { grid-template-columns: 1fr auto; }
  .order-line__actions { grid-column: 1 / -1; justify-content: flex-start; }
  .ebook-list .book-row { grid-template-columns: 96px 1fr; }
}

/* WooCommerce's own account content: order details, addresses and forms */
:root .woocommerce :is(.woocommerce-order-details, .woocommerce-customer-details, .woocommerce-Addresses) h2 {
  font-family: var(--font-display); font-weight: 600; text-transform: uppercase; font-size: var(--fs-lg); line-height: 1.1; margin: 0 0 var(--space-4);
}
.woocommerce-order-details, .woocommerce-customer-details { margin-top: var(--space-6); }
:root .woocommerce mark { background: none; color: inherit; font-weight: 700; padding: 0; }
:root .woocommerce table.shop_table { width: 100%; border: 1px solid var(--sand-200); border-radius: 16px; border-collapse: separate; border-spacing: 0; overflow: hidden; margin: 0 0 var(--space-4); background: var(--sand-50); }
:root .woocommerce table.shop_table th, :root .woocommerce table.shop_table td { padding: 14px 18px; border-top: 1px solid var(--sand-200); line-height: 1.5; vertical-align: top; }
:root .woocommerce table.shop_table thead th { border-top: 0; background: var(--sand-100); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-600); }
:root .woocommerce table.shop_table td a { color: var(--ink-900); }
:root .woocommerce table.shop_table :is(td.product-total, tfoot td) { text-align: right; }
:root .woocommerce table.shop_table tfoot th { font-weight: 600; }
:root .woocommerce :is(.col2-set.addresses, .woocommerce-columns--addresses) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
:root .woocommerce :is(.col2-set.addresses, .woocommerce-columns--addresses)::before,
:root .woocommerce :is(.col2-set.addresses, .woocommerce-columns--addresses)::after,
:root .woocommerce .woocommerce-Address-title::before, :root .woocommerce .woocommerce-Address-title::after { content: none; }
:root .woocommerce :is(.col2-set.addresses, .woocommerce-columns--addresses) > * { float: none; width: auto; max-width: none; }
.woocommerce-Address { padding: clamp(20px, 2.6vw, 28px); border-radius: var(--radius-card); background: var(--sand-50); box-shadow: inset 0 0 0 1px var(--sand-200); }
.woocommerce-Address-title { display: grid; justify-items: start; gap: 6px; margin-bottom: var(--space-4); }
:root .woocommerce .woocommerce-Address-title h2 { margin: 0; }
:root .woocommerce .woocommerce-Address-title a.edit { float: none; font-weight: 700; font-size: var(--fs-sm); color: var(--ink-900); }
:root .woocommerce :is(.woocommerce-Address, .woocommerce-customer-details) address { font-style: normal; line-height: 1.7; border: 0; padding: 0; }
:root .woocommerce .woocommerce-customer-details address { padding: 16px 18px; border: 1px solid var(--sand-200); border-radius: 12px; background: var(--sand-50); }
.woocommerce-MyAccount-content > p:first-of-type { max-width: 60ch; }
@media (max-width: 719px) {
  :root .woocommerce :is(.col2-set.addresses, .woocommerce-columns--addresses) { grid-template-columns: 1fr; }
}

/* Form fields on the account, sign-in and order tracking pages */
:root .woocommerce form .form-row { padding: 0; margin: 0 0 var(--space-4); }
:root .woocommerce form .form-row label:not(.woocommerce-form__label-for-checkbox) { display: block; margin-bottom: 6px; font-weight: 600; font-size: var(--fs-sm); line-height: 1.4; }
:root .woocommerce form .form-row .required { color: var(--coral-ink); text-decoration: none; }
:root .woocommerce form :is(input.input-text, select, textarea) {
  width: 100%; min-height: 52px; padding: 0 16px; border: 1.5px solid var(--ink-600); border-radius: 14px; background: var(--sand-50); color: var(--ink-900); font: inherit; font-size: var(--fs-base);
}
:root .woocommerce form textarea { padding-block: 12px; }
:root .woocommerce form .show-password-input { top: 50%; transform: translateY(-50%); right: 14px; min-width: 24px; min-height: 24px; }
.woocommerce-form__label-for-checkbox { display: inline-flex; align-items: center; gap: 10px; font-size: var(--fs-sm); cursor: pointer; }
:root .woocommerce form .woocommerce-form__label-for-checkbox input { flex: none; width: 18px; height: 18px; accent-color: var(--ink-900); margin: 0; }
:root .woocommerce .select2-container .select2-selection--single { height: 52px; border: 1.5px solid var(--ink-600); border-radius: 14px; background: var(--sand-50); }
:root .woocommerce .select2-container .select2-selection--single .select2-selection__rendered { line-height: 49px; padding-left: 16px; color: var(--ink-900); }
:root .woocommerce .select2-container .select2-selection--single .select2-selection__arrow { height: 49px; right: 10px; }
.woocommerce-EditAccountForm, .woocommerce-address-fields { max-width: 640px; }
/* Password changes live on their own page ("Password & security"). */
.woocommerce-EditAccountForm:not(.fcwl-security) fieldset:has(#password_current) { display: none; }
#account_display_name_description em { font-style: normal; font-size: var(--fs-xs); color: var(--ink-600); }
.fcwl-security { display: grid; gap: 0; max-width: 520px; }
.woocommerce-privacy-policy-text p { font-size: var(--fs-xs); color: var(--ink-600); }

/* Sign in, create an account, reset a password */
.fcwl-login { display: grid; gap: var(--space-5); max-width: 560px; margin-inline: auto; }
.fcwl-login--two { max-width: 1040px; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.fcwl-login__intro, .fcwl-login__guest { grid-column: 1 / -1; }
.fcwl-login__intro { display: grid; gap: 8px; margin-bottom: var(--space-3); }
.fcwl-login__intro > *, .fcwl-login__box > *, .fcwl-login__guest { margin: 0; }
.fcwl-login__intro p { max-width: 60ch; }
.fcwl-login__title { font-size: var(--fs-2xl); margin: 0 0 var(--space-5); }
.fcwl-login .fcwl-login__title { margin: 0; }
.fcwl-login__box { gap: var(--space-4); align-content: start; }
:root .woocommerce .fcwl-login :is(form.login, form.register) { border: 0; padding: 0; margin: 0; border-radius: 0; }
.fcwl-login__row { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px 16px; }
/* WooCommerce's clearfix spacers would become extra flex items and push the checkbox right. */
:root .woocommerce form .fcwl-login__row::before, :root .woocommerce form .fcwl-login__row::after { content: none; }
.fcwl-login__lost { font-size: var(--fs-sm); font-weight: 600; color: var(--ink-900); }
:root .woocommerce-account main .woocommerce:has(> .lost_reset_password) { max-width: 560px; margin-inline: auto; padding-top: var(--space-4); }
:root .woocommerce form.lost_reset_password .form-row { float: none; width: 100%; }
@media (max-width: 859px) {
  .fcwl-login--two { grid-template-columns: 1fr; }
}

/* Guest order tracking */
.fcwl-track { max-width: 720px; gap: var(--space-4); }
.fcwl-track > * { margin: 0; }
.fcwl-track__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--space-4); }
.fcwl-track__account { margin-top: var(--space-4); }
.woocommerce .order-info { font-size: var(--fs-md); }
@media (max-width: 599px) {
  .fcwl-track__fields { grid-template-columns: 1fr; }
}

/* Contact page form */
.contact-form { display: grid; gap: var(--space-4); }
.contact-form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.contact-form__field { display: grid; gap: 6px; }
.contact-form__field label { font-weight: 600; font-size: var(--fs-sm); line-height: 1.4; }
.contact-form .input { height: 52px; padding: 0 16px; border-radius: 14px; font-size: var(--fs-base); }
.contact-form textarea.input { height: auto; min-height: 160px; padding-block: 12px; resize: vertical; }
.contact-form__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.contact-form__send { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 16px; }
.contact-form__send .form-msg, .contact-form > .fine { margin: 0; }
@media (max-width: 599px) {
  .contact-form__row { grid-template-columns: 1fr; }
}
