/* ==========================================================================
   PddFalcon storefront — inner pages on the Snap design
   Overrides for the structural s-* sheets (listing, product, cart, checkout,
   account, auth, CMS pages, drawers). Loaded after snap.css.
   ========================================================================== */

/* Page chrome ------------------------------------------------------------- */
.s-wrap { max-inline-size: var(--sp-max); padding-inline: var(--sp-gutter); }
.s-section { padding-block: 1.25rem 2rem; }
.s-crumbs { font-size: var(--s-text-xs); color: var(--s-muted); padding-block: .9rem .2rem; }
.s-crumbs a { color: var(--s-muted); }
.s-crumbs a:hover { color: var(--s-accent-500); }
.s-head__title { position: relative; padding-block-end: .5rem; font-family: var(--s-font-display); font-weight: 800; letter-spacing: -.01em; color: var(--s-brand-800); }
.s-head__title::after { content: ""; position: absolute; inset-inline-start: 0; inset-block-end: 0; inline-size: 2.4rem; block-size: 3px; border-radius: 3px; background: var(--s-accent-500); }
.s-rule { display: none; }
.s-head__more { font-weight: 700; color: var(--s-accent-500); }
.s-head__eyebrow, .s-band__eyebrow { color: var(--s-accent-500); font-weight: 700; letter-spacing: var(--s-tracking-caps); text-transform: uppercase; font-size: var(--s-text-xs); }
.s-band__title { font-family: var(--s-font-display); font-weight: 800; color: var(--s-brand-800); }
.s-band__more { color: var(--s-accent-500); font-weight: 700; }

/* Buttons ----------------------------------------------------------------- */
.s-btn { border-radius: 999px; font-weight: 700; transition: background .2s, color .2s, transform .15s, box-shadow .2s; }
.s-btn:active { transform: scale(.97); }
.s-btn--primary { background: var(--s-accent-500); border-color: var(--s-accent-500); color: #fff; box-shadow: 0 10px 22px -12px rgb(196 38 12 / .8); }
.s-btn--primary:hover { background: var(--s-accent-600); border-color: var(--s-accent-600); }
.s-btn--ghost { background: #fff; border: 1px solid var(--sp-line); color: var(--s-brand-800); }
.s-btn--ghost:hover { border-color: var(--s-brand-800); background: var(--s-brand-800); color: #fff; }
.s-icon-btn { border-radius: 50%; }
.s-icon-btn:hover { background: var(--sp-tile); }

/* Forms ------------------------------------------------------------------- */
.s-input, .s-select, .s-field input:not([type="checkbox"]):not([type="radio"]), .s-field textarea, .s-field select, .s-coupon__input {
  border-radius: 12px; border: 1.5px solid var(--sp-line); background: #f7f8fb; min-block-size: 3rem; padding-inline: 1rem; transition: border-color .2s, background .2s, box-shadow .2s;
}
.s-input:focus, .s-select:focus, .s-field input:focus, .s-field textarea:focus, .s-field select:focus, .s-coupon__input:focus { background: #fff; border-color: var(--s-brand-800); box-shadow: 0 0 0 4px rgb(13 36 84 / .08); }
.s-field label, .s-field > span:first-child, .s-coupon__label { font-size: var(--s-text-sm); font-weight: 700; color: var(--s-ink); }
.s-field__help { color: var(--s-muted); }
.s-field__error { color: var(--s-danger); font-weight: 600; }
.s-fields { gap: 1rem 1.25rem; }
.s-check { gap: .6rem; }
.s-check input[type="checkbox"], .s-check input[type="radio"] { accent-color: var(--s-accent-500); inline-size: 1.15rem; block-size: 1.15rem; }
.s-reveal { position: relative; display: block; }
.s-reveal input { padding-inline-end: 3.2rem; }
.s-reveal__btn { position: absolute; inset-inline-end: .5rem; inset-block-start: 50%; translate: 0 -50%; inline-size: 2.2rem; block-size: 2.2rem; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgb(13 36 84 / .06); color: var(--s-brand-800); cursor: pointer; }
.s-reveal__btn svg { inline-size: 1.1rem; block-size: 1.1rem; }
.s-reveal__btn:hover { background: var(--s-brand-800); color: #fff; }
.s-select, .s-sort select { border-radius: 999px; background-color: #fff; padding-inline: 1rem 2.4rem; font-weight: 600; }

/* Panels + auth ------------------------------------------------------------ */
.s-panel, .s-authbox, .s-summary, .s-accountcard, .s-aside__card { border-radius: var(--sp-radius-lg); border: 1px solid var(--sp-line); background: #fff; box-shadow: var(--sp-shadow); }
.s-authbox { padding: 2rem; margin-block: 2.5rem 4rem; }
.s-authbox .s-head__title { margin-block-end: .3rem; }
.s-authbox .s-note { margin-block-end: 1.25rem; }
.s-authbox .s-fields { margin-block-start: .5rem; }
.s-authbox .s-btn--block { margin-block-start: .5rem; padding-block: .95rem; }
.s-note a { color: var(--s-accent-500); font-weight: 600; }

/* Listing ----------------------------------------------------------------- */
.s-toolbar { align-items: center; gap: 1rem; padding-block: .5rem 1rem; }
.s-toolbar__count { color: var(--s-muted); font-size: var(--s-text-sm); }
.s-toolbar__filter { border-radius: 999px; }
.s-filters { border-radius: var(--sp-radius-lg); border: 1px solid var(--sp-line); box-shadow: var(--sp-shadow); inset-block-start: calc(var(--sp-header-h, 4.6rem) + 4rem); }
.s-filters__head { padding: 1rem 1.1rem .5rem; }
.s-filters__heading { font-family: var(--s-font-display); font-weight: 800; color: var(--s-brand-800); }
.s-filters__title { font-size: var(--s-text-2xs); font-weight: 800; letter-spacing: var(--s-tracking-caps); text-transform: uppercase; color: var(--s-accent-500); }
.s-filters__group { padding: .8rem 1.1rem; border-block-start: 1px solid var(--sp-line); }
.s-filters .s-check { padding-block: .2rem; border-radius: 8px; }
.s-filters .s-check:hover { color: var(--s-accent-500); }
.s-check__count { color: var(--s-muted); font-size: var(--s-text-xs); }
.s-chip { border-radius: 999px; background: var(--s-brand-100); color: var(--s-brand-800); border: 0; font-weight: 600; }
.s-chip__x:hover { color: var(--s-accent-500); }
.s-pager { gap: .35rem; }
.s-pager a, .s-pager span { min-inline-size: 2.5rem; block-size: 2.5rem; border-radius: 50%; border: 1px solid var(--sp-line); background: #fff; font-weight: 700; display: inline-grid; place-items: center; }
.s-pager a:hover { border-color: var(--s-brand-800); }
.s-pager .s-current { background: var(--s-brand-800); border-color: var(--s-brand-800); color: #fff; }
.s-pager .s-disabled { opacity: .4; }
.s-grid { gap: var(--sp-gap); }
.s-head--pic { border-radius: var(--sp-radius-lg); overflow: hidden; }
.s-empty { padding: 3rem 1rem; border-radius: var(--sp-radius-lg); background: var(--sp-tile); }
.s-empty__mark { background: #fff; color: var(--s-accent-500); box-shadow: var(--sp-shadow); }
.s-empty__title { font-family: var(--s-font-display); font-weight: 800; color: var(--s-brand-800); }

/* Product page ------------------------------------------------------------- */
.s-gallery__stage { border-radius: var(--sp-radius-lg); border: 1px solid var(--sp-line); background: #fff; overflow: hidden; }
.s-gallery__thumb { border-radius: 12px; border: 2px solid transparent; background: var(--sp-tile); overflow: hidden; }
.s-gallery__thumb.s-active, .s-gallery__thumb[aria-current="true"] { border-color: var(--s-accent-500); }
.s-pdp__panel { border-radius: var(--sp-radius-lg); }
.s-pdp__cat { color: var(--s-accent-500); font-weight: 700; letter-spacing: var(--s-tracking-caps); text-transform: uppercase; font-size: var(--s-text-xs); }
.s-pdp__title { font-family: var(--s-font-display); font-weight: 800; color: var(--s-brand-800); letter-spacing: -.01em; }
.s-pdp__price { font-weight: 800; color: var(--s-ink); }
.s-pdp__off { color: var(--s-success); font-weight: 800; }
.s-pdp__block-title { font-family: var(--s-font-display); font-weight: 800; color: var(--s-brand-800); }
.s-picker__row { border-radius: 14px; border: 1.5px solid var(--sp-line); transition: border-color .2s, box-shadow .2s, background .2s; }
.s-picker__row + .s-picker__row { margin-block-start: .6rem; }
.s-picker__row:has(input:checked) { border-color: var(--s-brand-800); background: #f7f9fe; box-shadow: 0 0 0 3px rgb(13 36 84 / .06); }
.s-picker__total { border-radius: 16px; background: var(--sp-tile); }
.s-qty { border-radius: 999px; overflow: hidden; }
.s-qty__btn:hover { background: var(--s-brand-800); color: #fff; }
.s-policy__item { border-radius: 14px; background: var(--sp-tile); border: 0; }
.s-specs th, .s-specs td { padding: .7rem .9rem; }
.s-specs tr:nth-child(odd) { background: var(--sp-tile); }
.s-specs th { color: var(--s-muted); font-weight: 600; }
.s-stickybuy { border-radius: 18px 18px 0 0; box-shadow: 0 -10px 30px -12px rgb(13 36 84 / .35); }
.s-review { border-radius: var(--sp-radius); border: 1px solid var(--sp-line); }
.s-tag { border-radius: 6px; font-weight: 800; }
.s-tag--sale, .s-tag--deal { background: var(--s-accent-500); color: #fff; }
.s-stockline--in { color: var(--s-success); font-weight: 700; }
.s-stockline--low { color: var(--s-accent-500); font-weight: 700; }

/* Cart + checkout ---------------------------------------------------------- */
.s-line { padding: 1rem; border-radius: var(--sp-radius); border: 1px solid var(--sp-line); background: #fff; transition: box-shadow .2s; }
.s-line + .s-line { margin-block-start: .75rem; border-block-start: 1px solid var(--sp-line); }
.s-line:hover { box-shadow: var(--sp-shadow); }
.s-line__thumb { border-radius: 12px; background: var(--sp-tile); border: 0; overflow: hidden; }
.s-line__thumb img { object-fit: cover; }
.s-line__name { font-weight: 700; color: var(--s-brand-800); }
.s-line__price { font-weight: 800; }
.s-line__remove { color: var(--s-muted); }
.s-line__remove:hover { color: var(--s-accent-500); }
.s-cartpage .s-panel { padding: 1rem; }
.s-summary { padding: 1.4rem; position: sticky; inset-block-start: calc(var(--sp-header-h, 4.6rem) + 4rem); }
.s-cart__total--grand { font-family: var(--s-font-display); font-size: var(--s-text-xl); font-weight: 800; color: var(--s-brand-800); }
.s-coupon__row { gap: .5rem; }
.s-coupon__input { text-transform: uppercase; letter-spacing: .06em; font-weight: 700; }
.s-summary .s-btn--block { padding-block: 1rem; font-size: var(--s-text-md); }
.s-callout { border-radius: 14px; background: var(--s-cool-100); border: 1px solid var(--s-cool-200); }
.s-check--pay { border-radius: 14px; border: 1.5px solid var(--sp-line); padding: .9rem 1rem; }
.s-check--pay:has(input:checked) { border-color: var(--s-brand-800); background: #f7f9fe; }
.s-sumline { padding-block: .5rem; }

/* Account ------------------------------------------------------------------ */
.s-accountcard { padding: 1.25rem; transition: translate .25s var(--sp-ease), box-shadow .25s; }
.s-accountcard:hover { translate: 0 -3px; box-shadow: var(--sp-shadow-lg); }
.s-accountcard__mark { border-radius: 12px; background: var(--s-accent-100); color: var(--s-accent-500); }
.s-accountcard__title { font-family: var(--s-font-display); font-weight: 800; color: var(--s-brand-800); }
.s-accountcard__go { color: var(--s-accent-500); font-weight: 700; }
.s-address { border-radius: 14px; background: var(--sp-tile); }
.s-address__default { background: var(--s-brand-800); color: #fff; border-radius: 999px; }
.s-orderstate { border-radius: 999px; font-weight: 700; }
.s-timeline li::before { background: var(--s-accent-500); }

/* CMS pages ---------------------------------------------------------------- */
.s-pagehead { padding: 2rem 0 1rem; }
.s-pagehead__title { font-family: var(--s-font-display); font-weight: 800; color: var(--s-brand-800); letter-spacing: -.01em; }
.s-pagehead__stamp { color: var(--s-muted); }
.s-doc__body { border-radius: var(--sp-radius-lg); border: 1px solid var(--sp-line); padding: 1.5rem; background: #fff; }
.s-prose h2, .s-prose h3 { font-family: var(--s-font-display); color: var(--s-brand-800); }
.s-prose a { color: var(--s-accent-500); }
.s-aside__here { color: var(--s-accent-500); font-weight: 700; }
.s-faq { border-radius: 14px; border: 1px solid var(--sp-line); }

/* Drawers + phone menu ------------------------------------------------------ */
.s-cart { border-radius: 22px 0 0 22px; }
.s-cart__head, .s-menu__head { border-block-end: 1px solid var(--sp-line); }
.s-cart__title { font-family: var(--s-font-display); font-weight: 800; color: var(--s-brand-800); }
.s-cart__foot { border-radius: 0 0 0 22px; }
.s-menu { border-radius: 0 22px 22px 0; }
.s-menu__group-label { color: var(--s-accent-500); font-weight: 800; letter-spacing: var(--s-tracking-caps); text-transform: uppercase; font-size: var(--s-text-2xs); }
.s-menu__link { border-radius: 12px; font-weight: 600; }
.s-menu__link:hover { background: var(--sp-tile); color: var(--s-accent-500); }
.s-sheet { border-radius: 22px 22px 0 0; }
.s-sheet__head { font-family: var(--s-font-display); font-weight: 800; color: var(--s-brand-800); }

/* Phone: bottom bar clearance and tighter gutters. */
@media (max-width: 61.99rem) { .s-section { padding-block: 1rem 1.5rem; } .s-line { padding: .8rem; } }
.s-gallery__thumb.is-active { border-color: var(--s-accent-500); }

/* Category page: the picture becomes a banner behind the title. */
.s-head--pic { position: relative; display: flex; align-items: flex-end; min-block-size: 11rem; padding: 1.5rem; margin-block: .5rem 1rem; background: var(--s-brand-900); color: #fff; }
.s-head--pic .s-head__pic { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; object-fit: cover; opacity: .55; border: 0; border-radius: 0; }
.s-head--pic::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgb(6 16 49 / .92), rgb(6 16 49 / .35) 60%, rgb(6 16 49 / .1)); }
.s-head--pic > div { position: relative; z-index: 1; }
.s-head--pic .s-head__title { color: #fff; }
.s-head--pic .s-head__title::after { background: var(--s-cool-500); }
.s-head--pic p { color: rgb(255 255 255 / .85) !important; }
@media (min-width: 62rem) { .s-head--pic { min-block-size: 14rem; padding: 2.25rem 2.5rem; } }
/* Cart lines: a bigger picture and room to breathe. */
.s-line { grid-template-columns: 6rem 1fr; gap: 1rem; }
.s-line__thumb { inline-size: 6rem; block-size: 6rem; object-fit: cover; }
.s-cartpage > .s-panel:not(.s-summary) { padding: .5rem; border: 0; box-shadow: none; }