/* Storefront refresh. The original theme and assets are preserved in backups/. */
@font-face {
    font-family: 'Peek Sans';
    src: url('/fonts/filament/filament/inter/inter-latin-wght-normal-NRMW37G5.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}
:root {
    --bg: #faf9f6;
    --surface: #fff;
    --ink: #292637;
    --muted: #706a7d;
    --line: #e7e3ec;
    --accent: #7152b8;
    --accent-dark: #563b93;
    --soft: #f1ebfc;
    --success: #24755d;
    --danger: #b23950;
    font-family: 'Peek Sans', ui-rounded, system-ui, sans-serif;
    font-synthesis: none;
}
body { background: var(--bg); color: var(--ink); line-height: 1.5; }
button, input, select, textarea { font-family: inherit; }
h1, h2, h3 { color: var(--ink); letter-spacing: -.035em; line-height: 1.18; }
h1, h2 { font-weight: 800; }
.shell, .home-shell { width: min(1320px, calc(100% - 64px)); }
.site-header { background: #fffefa; border-bottom: 1px solid var(--line); }
.header-inner { min-height: 80px; gap: 24px; }
.brand { gap: 9px; font-size: 1.1rem; font-weight: 850; letter-spacing: -.035em; white-space: nowrap; }
.brand img { width: 49px; height: 49px; }
.header-inner nav { align-items: center; gap: 26px; }
.header-inner nav a { color: #514a60; font-size: .85rem; font-weight: 650; white-space: nowrap; }
.header-inner nav a:hover { color: var(--accent-dark); }
.header-inner .cart-link { background: var(--soft); padding: 9px 14px; border-radius: 999px; }
.cart-count { background: var(--accent); }
.section { padding: 38px 0; }
.eyebrow { color: var(--accent-dark); font-size: .67rem; letter-spacing: .16em; font-weight: 800; }
.section-heading { margin-bottom: 22px; }
.section-heading h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); }
.section-heading p { color: var(--muted); font-size: .95rem; }
.home-hero { padding: 42px 0; background: radial-gradient(ellipse at 86% 52%, #e9e0fa 0, transparent 43%), radial-gradient(ellipse at 12% 0, #fff1df 0, transparent 50%), #f7f3fb; border-bottom: 1px solid #eee7f4; }
.hero-layout:has(.mascot-companion) { grid-template-columns: minmax(0, 1.25fr) minmax(350px, 1fr); gap: 48px; }
.home-hero h1 { font-size: clamp(2.5rem, 4.5vw, 4.2rem); line-height: 1.04; letter-spacing: -.055em; margin: 18px 0; max-width: 680px; }
.hero-highlight { color: var(--accent); }
.home-hero p { font-size: 1rem; color: #686075; max-width: 470px; line-height: 1.65; }
.hero-actions { gap: 12px; margin-top: 23px; }
.hero-perks { list-style: none; padding: 0; margin: 22px 0 0; display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: .7rem; color: #655c74; }
.hero-perks li::before { content: '✓'; margin-right: 6px; color: var(--success); font-weight: 800; }
.button, .hero-shop-link, .product-builder-link { border-radius: 12px; font-weight: 750; text-align: center; transition: background-color .15s ease, border-color .15s ease; }
.button { padding: 12px 18px; font-size: .85rem; }
.button.primary, .home-hero .button.primary, .ready-made-card .button.primary, .builder-button, .journey-footer .button { background: var(--accent); color: #fff; }
.button.primary:hover, .home-hero .button.primary:hover, .ready-made-card .button.primary:hover, .button.builder-button:hover, .journey-footer .button:hover { background: var(--accent-dark); }
.button.secondary, .hero-shop-link { background: #fff; border: 1px solid #dcd3e9; color: #51416e; }
.button.secondary:hover, .hero-shop-link:hover { background: var(--soft); border-color: #c3b0df; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 3px solid #8a69c7; outline-offset: 3px; }
.home-section.section { padding: 32px 0 12px; }
.home-section .section-heading { margin-bottom: 20px; }
#catalog > .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
#builder-products > .grid { gap: 16px; }
.card, .panel, .pick-card, .choice { border-color: var(--line); box-shadow: 0 4px 18px #33264c05; background: #fff; }
.product-card, .pick-card { padding: 0; min-height: 0; border: 1px solid var(--line); border-radius: 19px; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 5px 16px #3c275c05; }
.product-media { position: relative; width: 100%; aspect-ratio: 4 / 3; flex-shrink: 0; background: #f3f0f7; overflow: hidden; border-bottom: 1px solid #eeebf2; }
.product-card:nth-child(4n + 2) .product-media, .pick-card:nth-child(4n + 2) .product-media { background: #eef5f0; }
.product-card:nth-child(4n + 3) .product-media, .pick-card:nth-child(4n + 3) .product-media { background: #fff3e7; }
.product-card:nth-child(4n + 4) .product-media, .pick-card:nth-child(4n + 4) .product-media { background: #faedf2; }
.product-image-layer { opacity: 1; background-size: contain; background-position: center; width: 100%; height: 100%; transition: transform .2s ease; }
.product-placeholder { display: grid; place-items: center; height: 100%; color: #af98d5; font-size: 3rem; }
.product-card-content, .pick-card-content { padding: 15px; color: var(--ink); text-shadow: none; width: 100%; }
.product-card-content { flex: 1; gap: 0; }
.product-card:has(.product-image-layer) .product-card-content { color: var(--ink); text-shadow: none; }
.product-card:has(.product-image-layer) h3, .product-card:has(.product-image-layer) .price { color: var(--ink); }
.product-card:has(.product-image-layer) p, .product-card:has(.product-image-layer) .muted { color: var(--muted); }
.product-card h3, .pick-card h3 { font-size: .96rem; line-height: 1.3; margin: 8px 0 7px; letter-spacing: -.025em; }
.product-card p { margin-bottom: 12px; font-size: .8rem; line-height: 1.5; }
.product-card .tag, .pick-card .tag { display: inline-block; max-width: 100%; background: #f1edf7; color: #75618d; padding: 3px 7px; font-size: .68rem; letter-spacing: .025em; }
.product-card .price, .pick-card .price { font-size: .94rem; font-weight: 800; white-space: nowrap; }
.product-card-content .card-row { gap: 8px; padding-top: 12px; }
.product-builder-link { width: 100%; margin-left: 0; padding: 9px 8px; background: var(--soft); border: 1px solid #e6dcf6; color: #563b93; font-size: .73rem; }
.product-builder-link:hover { background: #e5d9f8; border-color: #c4a9e5; }
.image-count { top: 10px; right: 10px; background: #fffffff0; color: #655775; border: 1px solid #e9e1ef; font-size: .65rem; padding: 3px 7px; }
.magnifier-button { top: 9px; right: 65px; background: #fffffff0; border-radius: 50%; font-size: .9rem; width: 27px; height: 27px; }
.colour-availability { font-size: .7rem; color: #6c607c; }
.colour-dot { width: 14px; height: 14px; flex-basis: 14px; border-color: #a69ab4; }
.stock-unavailable { color: #a53f55; background: #fff0f2; font-size: .7rem; }
.pick-card-content { align-self: stretch; flex: 1; padding-bottom: 8px; }
.pick-card .muted { color: #83798e; font-size: .65rem; }
.pick-card-controls { padding: 8px 14px 14px; min-height: 65px; gap: 10px; }
.colour-picker { color: #6b577c; font-size: .72rem; }
.qty-control { background: #f7f4fb; border-radius: 12px; padding: 3px; }
.qty-control button { width: 32px; height: 32px; color: var(--accent-dark); background: #fff; border-color: #e6ddf0; font-size: 1.05rem; }
.qty-control span { font-size: .8rem; min-width: 14px; text-align: center; }
.panel { padding: 24px; border-radius: 22px; }
.panel h2 { margin-top: 0; font-size: 1.15rem; letter-spacing: -.025em; }
.builder-layout, .checkout-layout { grid-template-columns: minmax(0, 1fr) 340px; gap: 24px; }
.summary { background: #f7f3fd; border-color: #e4d9f0; box-shadow: none; top: 100px; }
.summary .eyebrow { color: #7e639e; }
.choice { padding: 14px; border-radius: 15px; box-shadow: none; gap: 6px; }
.choice strong { font-size: .92rem; }
.choice span { font-size: .73rem; color: var(--muted); }
.choice input { accent-color: var(--accent); }
.choice:has(input:checked) { outline: 2px solid var(--accent); background: #f4effc; }
.notice { background: #edf6f1; color: #376a57; font-size: .8rem; border: 1px solid #d9eadd; }
.page-heading { padding: 4px 0 15px; }
.page-heading h1 { font-size: clamp(1.8rem, 3vw, 2.5rem); }
.page-heading > div:first-child { flex: 1; }
input, textarea, select { border-color: #e0d9e8; background: #fdfcfe; border-radius: 12px; color: var(--ink); }
.form-grid label { color: #564c64; font-size: .82rem; }
.field-hint { font-size: .75rem; }
.selected-row { gap: 10px; font-size: .81rem; border-color: #e3daee; }
.selected-row strong { white-space: nowrap; }
.selected-row .link-button { font-size: .7rem; }
.selected-row.total { font-size: 1rem; }
.cart-line-header h2 { font-size: 1.1rem; margin: 6px 0; }
.cart-line-items { font-size: .8rem; }
.cart-reservation { background: #fff7e7; border-color: #eedfbd; color: #765c29; font-size: .78rem; }
.catalog-pagination .button { border-radius: 999px; }
.pagination-position { background: none; color: var(--muted); font-size: .8rem; }
.how-it-works { margin-top: 36px; margin-bottom: 36px; padding: 36px 28px 24px; background: #eef5f0; border: 1px solid #deebe1; border-radius: 25px; }
.journey-heading h2 { font-size: clamp(1.5rem, 2.5vw, 2rem); }
.journey-heading p, .journey-step p { color: #68756c; }
.journey-path { color: #b6c9bd; }
.peek-speech { border: 1px solid #dae6dc; box-shadow: 0 4px 0 #e2ece5; color: #506353; font-size: .8rem; }
.peek-speech::after { border-color: #dae6dc; border-width: 1px; }
.journey-step h3 { font-size: .92rem; }
.journey-step p { font-size: .78rem; }
.journey-number { background: #60846b; border-color: #eef5f0; }
.journey-footer { border-color: #cadace; color: #526557; font-size: .8rem; }
.mascot-bubble { background: #fffefb; border: 1px solid #ded3ed; box-shadow: 0 5px 0 #e8dff3; border-radius: 22px 22px 5px 22px; }
.mascot-bubble::after { background: #fffefb; border-color: #ded3ed; border-width: 1px; }
.mascot-speaker { color: #9970ac; font-size: .6rem; }
.mascot-bubble [data-mascot-line] { color: #655274; font-size: .83rem; font-weight: 550; line-height: 1.5; min-height: 6em; }
.mascot-companion--shop .talking-mascot { width: 240px; }
.mascot-talk-controls button { color: #765888; }
.site-footer { border-color: var(--line); color: #8a7e97; font-size: .78rem; text-align: center; padding: 26px 0; background: #f4f0f8; margin-top: 36px; }
@media (hover: hover) {
    .product-card:hover, .pick-card:hover { border-color: #c8b5e1; }
    .product-image-layer:hover { transform: scale(1.035); }
}
@media (max-width: 1100px) {
    #catalog > .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .hero-layout:has(.mascot-companion) { gap: 24px; grid-template-columns: minmax(0, 1.1fr) minmax(320px, 1fr); }
    .builder-layout, .checkout-layout { grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; }
    .header-inner nav { gap: 18px; }
}
@media (max-width: 850px) {
    .shell, .home-shell { width: calc(100% - 32px); }
    .hero-layout:has(.mascot-companion) { grid-template-columns: 1fr; }
    .home-hero { padding: 28px 0; }
    .home-hero h1 { max-width: 100%; }
    .hero-copy { text-align: center; }
    .home-hero p { margin-left: auto; margin-right: auto; }
    .hero-actions, .hero-perks { justify-content: center; }
    .mascot-companion--shop { justify-content: center; }
    .builder-layout, .checkout-layout, .cart-layout { grid-template-columns: 1fr; }
    .summary, .checkout-summary { position: static; }
    #builder-products > .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .box-size-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    #catalog > .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
    .header-inner { flex-wrap: wrap; justify-content: space-between; gap: 8px; padding: 12px 0; }
    .brand { font-size: 1rem; }
    .header-inner nav { gap: 14px; }
    .header-inner nav a { font-size: .76rem; }
}
@media (max-width: 560px) {
    .header-inner nav { width: 100%; justify-content: space-between; gap: 6px; }
    .header-inner .cart-link { padding: 6px 10px; }
    .brand img { width: 38px; height: 38px; }
    .home-hero h1 { font-size: 2.6rem; }
    .hero-perks { gap: 7px 12px; font-size: .63rem; }
    .home-section.section { padding-top: 24px; }
    .section { padding: 26px 0; }
    .product-card-content, .pick-card-content { padding: 12px; }
    .product-card h3, .pick-card h3 { font-size: .84rem; }
    .product-card p { font-size: .76rem; }
    .product-card .price, .pick-card .price { font-size: .82rem; }
    .product-builder-link { font-size: .66rem; }
    .panel { padding: 16px; }
    .pick-card-controls { padding: 0 12px 12px; }
    .box-size-grid { gap: 8px; }
    .choice { padding: 10px 7px; }
    .choice span { font-size: .64rem; }
    .mascot-companion--shop .talking-mascot { width: 155px; }
    .journey-step { border-color: #b6c9bd; }
    .how-it-works { padding: 26px 18px 20px; }
}
@media (max-width: 380px) {
    #catalog > .grid, #builder-products > .grid { grid-template-columns: 1fr; }
    .product-media { aspect-ratio: 3 / 2; }
}
@media (prefers-reduced-motion: reduce) {
    .product-image-layer, .button, .hero-shop-link, .product-builder-link { transition: none; }
    .product-image-layer:hover { transform: none; }
}
.header-inner nav a[aria-current="page"] { color: var(--accent-dark); font-weight: 800; }
/* The builder keeps controls readable while leaving room for more picks. */
.pick-card .product-media { aspect-ratio: auto; height: 200px; }
@media (max-width: 560px) {
    #builder-products > .grid { grid-template-columns: 1fr; }
    .pick-card { display: grid; grid-template-columns: 100px minmax(0, 1fr); grid-template-rows: 1fr auto; gap: 0; }
    .pick-card .product-media { grid-column: 1; grid-row: 1 / -1; height: 100%; min-height: 180px; border-bottom: 0; border-right: 1px solid var(--line); }
    .pick-card-content { grid-column: 2; }
    .pick-card-controls { grid-column: 2; }
    .pick-card-controls .colour-picker { flex-basis: 100%; }
    .pick-card-controls .qty-control { margin-top: 2px; }
}
.magnifier-button { display: grid; place-items: center; color: #655775; }
.cart-line-actions, .cart-line-header { flex-wrap: wrap; }
.cart-line-actions .inline-form { flex-wrap: wrap; }
.cart-layout > *, .checkout-layout > *, .builder-layout > * { min-width: 0; }
/* Preserve native visibility for conditional form fields and optional controls. */
[hidden] { display: none !important; }

/* Compact hero and a mascot-led wordmark. */
@font-face {
    font-family: 'Peek Rounded';
    src: url('/fonts/brand/nunito-variable.ttf') format('truetype');
    font-weight: 200 1000;
    font-style: normal;
    font-display: swap;
}
.brand-wordmark { display: inline-flex; align-items: baseline; font-family: 'Peek Rounded', ui-rounded, 'Peek Sans', sans-serif; font-size: 1.65rem; font-weight: 900; letter-spacing: -.06em; line-height: 1; color: #3f3158; }
.brand-join { color: #a98ac9; font-size: .78em; margin: 0 1px; }
.brand-spark { font-family: 'Peek Sans', sans-serif; color: #cf9650; font-size: .5em; align-self: flex-start; margin: 1px 0 0 3px; }
.brand img { width: 48px; height: 48px; }
.home-hero { padding: 22px 0; }
.home-hero h1 { font-size: clamp(2.25rem, 3.6vw, 3.25rem); margin: 12px 0; }
.home-hero p { font-size: .92rem; line-height: 1.5; margin: 12px 0; }
.hero-copy { padding: 4px 0; }
.hero-actions { margin-top: 16px; }
.hero-perks { margin-top: 16px; }
.mascot-companion--shop .talking-mascot { width: 200px; }
.pick-card .product-media { height: 150px; }
.pick-card-content { padding: 11px 12px 6px; }
.pick-card-controls { padding: 6px 12px 12px; }
@media (min-width: 1101px) {
    #builder-products > .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
}
@media (max-width: 850px) {
    .home-hero p { margin-left: auto; margin-right: auto; }
    .hero-layout:has(.mascot-companion) { gap: 14px; }
}
@media (max-width: 560px) {
    .brand img { width: 38px; height: 38px; }
    .brand-wordmark { font-size: 1.45rem; }
    .home-hero { padding: 18px 0; }
    .home-hero h1 { font-size: 2.2rem; }
    .mascot-companion--shop .talking-mascot { width: 130px; }
    .pick-card { grid-template-columns: 88px minmax(0, 1fr); }
    .pick-card .product-media { height: 100%; min-height: 155px; }
}

/* Keep the two people in a gift order visually distinct. */
.checkout-party { min-width: 0; margin: 0 0 22px; border: 1px solid var(--line); }
.checkout-party legend { padding: 0 8px; font-size: 1.1rem; font-weight: 750; color: var(--ink, #30273c); max-width: 100%; }
.checkout-party--recipient { border-color: #b9d2c2; background: #f7fbf8; }
.checkout-step { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 50%; background: #eee6fa; color: #60408d; margin-right: 5px; }
.checkout-party--recipient .checkout-step { background: #deeee3; color: #3b6548; }
.checkout-party > p { margin-top: 0; line-height: 1.6; }
.checkout-party .form-grid { align-items: start; }
.manual-order-note { padding: 16px; margin: 18px 0; border-radius: 12px; background: #f4effa; line-height: 1.6; font-size: .86rem; }
.manual-order-note h3 { margin: 0; font-size: 1rem; }
.manual-order-note a { color: var(--accent-dark); font-weight: 700; }
.order-confirmation { margin-top: 24px; border-color: #b9d2c2; }
.gifting-intro p, .gifting-faq p { line-height: 1.7; }
.gifting-faq details { padding: 18px 0; border-bottom: 1px solid var(--line); }
.gifting-faq summary { font-weight: 750; cursor: pointer; }
.gifting-faq details p { max-width: 850px; }