/* Make Your Odd — the selected painting-studio direction. */
:root { color-scheme: only light; --paper:#f9f5ed; --ink:#141317; --muted:#625c60; --red:#9b0b18; --red-dark:#790d19; --cream:#fff0c8; --line:#dcd4ca; --soft:#eee7dd; --white:#fffaf3; --radius:24px; --page:clamp(22px,4.2vw,72px); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:24px; }
body { margin:0; background:var(--paper); color:var(--ink); font:15px/1.6 'Manrope',sans-serif; -webkit-font-smoothing:antialiased; }
body:has(dialog[open]) { overflow:hidden; }
button,input,textarea { font:inherit; color:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
button { background:none; border:0; }
button:disabled { cursor:not-allowed; opacity:.55; }
a { color:inherit; text-decoration:none; }
button,a,input,summary { touch-action:manipulation; }
:focus-visible { outline:3px solid #d16b36; outline-offset:5px; }
img,video { display:block; max-width:100%; }
figure,p,h1,h2,h3 { margin:0; }
h1,h2,h3,.brand,.footer-wordmark { font-family:'Outfit',sans-serif; }
h2 { font-size:clamp(36px,4.1vw,64px); line-height:1.02; letter-spacing:-.045em; font-weight:800; }
h3 { font-size:28px; line-height:1.08; letter-spacing:-.035em; font-weight:750; }
h1,h2,h3 { word-spacing:.025em; }
h2 { letter-spacing:-.03em; }
[hidden] { display:none!important; }
.icon { width:22px; height:22px; flex:0 0 22px; object-fit:contain; }
.sr-only,.hot-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.skip-link { position:fixed; top:12px; left:12px; transform:translateY(-150%); padding:12px 20px; border-radius:24px; background:var(--ink); color:white; z-index:100; }
.skip-link:focus { transform:none; }
.site-header { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:22px var(--page); min-height:84px; max-width:1600px; margin:auto; }
.brand { font-size:clamp(24px,2.45vw,36px); font-weight:800; letter-spacing:-.065em; white-space:nowrap; line-height:1; }
.brand { font-size:clamp(24px,2.7vw,38px); }
.brand>span,.footer-wordmark>span { color:var(--red); }
.desktop-nav { display:flex; align-items:center; gap:clamp(18px,2.5vw,38px); font-size:13px; font-weight:650; }
.desktop-nav a { padding:9px 0; }
.desktop-nav a:hover,.text-link:hover { color:var(--red); }
.header-actions { display:flex; align-items:center; gap:12px; }
.search-toggle { display:flex; align-items:center; gap:9px; width:148px; padding:8px 12px; text-align:left; border:1px solid var(--line); border-radius:30px; font-size:12px; color:var(--muted); }
.icon-button { display:grid; place-items:center; width:44px; height:44px; flex:0 0 44px; border-radius:50%; }
.icon-button:hover { background:var(--soft); }
.bag-toggle { position:relative; }
.bag-toggle .icon { width:27px; height:27px; }
.bag-count { position:absolute; top:0; right:0; min-width:19px; height:19px; padding:0 4px; border-radius:20px; background:var(--red); color:white; font-size:10px; line-height:19px; text-align:center; }
.menu-toggle { display:none; }
.header-music-controls { display:flex; align-items:center; border:1px solid var(--line); border-radius:24px; }
.music-quick-toggle { display:flex; align-items:center; justify-content:center; gap:5px; min-height:36px; padding:6px 8px; font-size:11px; }
.music-quick-toggle .icon { width:13px; height:13px; flex-basis:13px; }
.music-settings-toggle { width:28px; min-height:36px; display:grid; place-items:center; border-left:1px solid var(--line); }
.music-settings-toggle .icon { width:15px; height:15px; }
.mobile-nav { padding:16px var(--page) 24px; border-bottom:1px solid var(--line); background:var(--paper); }
.mobile-nav a { display:block; padding:12px 0; font-weight:650; }
.studio-hero { display:grid; grid-template-columns:43% 57%; align-items:stretch; margin:0 auto; padding:0 18px 0 var(--page); max-width:1600px; }
.hero-copy { padding:32px 22px 46px 0; align-self:center; }
.eyebrow { font-size:10px; font-weight:800; letter-spacing:.24em; text-transform:uppercase; line-height:1.5; margin-bottom:16px; }
.hero-copy h1 { font-size:clamp(60px,7.25vw,114px); font-weight:850; line-height:.86; letter-spacing:-.063em; margin:0 0 23px; }
.hero-copy h1 span { color:var(--red); }
.hero-description { font-size:clamp(16px,1.65vw,23px); line-height:1.35; letter-spacing:-.025em; max-width:475px; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:18px 24px; margin-top:28px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:20px; min-height:54px; padding:14px 25px; border:1px solid transparent; border-radius:40px; font-size:13px; line-height:1.3; font-weight:750; text-align:center; transition:background .18s,transform .18s; }
.button:hover:not(:disabled) { transform:translateY(-2px); }
.button-dark { background:var(--red); color:white; }
.button-dark:hover:not(:disabled) { background:var(--red-dark); }
.button-dark .icon { filter:brightness(0) invert(1); width:18px; height:18px; flex-basis:18px; }
.button-outline { border-color:currentColor; background:transparent; }
.text-link { display:inline-flex; align-items:center; gap:16px; width:fit-content; font-size:13px; font-weight:650; text-decoration:underline; text-decoration-color:#9b0b1855; text-underline-offset:7px; }
.text-link .icon { width:18px; height:18px; flex-basis:18px; }
.hero-art { position:relative; min-width:0; min-height:475px; overflow:hidden; border-radius:100px 48px 85px 0; }
.hero-art>img { width:100%; height:100%; position:absolute; object-fit:cover; object-position:center; }
.season-pill { position:absolute; top:20px; right:22px; display:flex; gap:9px; align-items:center; padding:10px 18px; border-radius:40px; background:var(--cream); font-size:12px; font-weight:650; }
.season-pill .icon { width:18px; height:18px; flex-basis:18px; }
.hero-art figcaption { position:absolute; right:24px; bottom:24px; padding:6px 12px; color:white; background:#281b13d9; border-radius:20px; font-size:12px; font-style:italic; }
.project-picker { position:relative; display:grid; grid-template-columns:33% minmax(0,1fr); gap:28px; padding:32px var(--page); margin:auto; max-width:1600px; background:var(--red-dark); color:var(--white); border-radius:38px 38px 0 0; }
.project-intents { align-self:center; }
.project-intents h2 { word-spacing:.06em; }
.project-intents h2 { font-size:clamp(29px,3.25vw,48px); line-height:1; letter-spacing:-.04em; margin:0 0 28px 12px; }
.project-intents [role=group] { display:grid; gap:10px; }
button[data-project-intent] { display:flex; align-items:center; gap:18px; min-height:59px; padding:12px 22px; border-radius:44px; background:#ffffff1a; color:white; text-align:left; font-size:16px; font-weight:600; transition:background .2s; }
button[data-project-intent] .icon { filter:brightness(0) invert(1); width:26px; height:26px; flex-basis:26px; }
button[data-project-intent] .icon:last-child { width:19px; height:19px; flex-basis:19px; margin-left:auto; }
button[data-project-intent]:hover { background:#ffffff2a; }
button[data-project-intent][aria-pressed=true] { background:var(--cream); color:var(--ink); }
button[data-project-intent][aria-pressed=true] .icon { filter:none; }
.project-recommendation { min-width:0; display:grid; grid-template-columns:44% minmax(0,1fr); gap:26px; background:var(--white); color:var(--ink); padding:18px; border-radius:24px; }
.project-photo { display:grid; grid-template-rows:minmax(0,1fr) auto; min-width:0; background:#e5d7c5; border-radius:19px; overflow:hidden; }
.project-photo img { width:100%; height:100%; min-height:245px; object-fit:contain; }
.project-photo figcaption { padding:8px 10px; font-size:10px; line-height:1.4; color:#494137; background:#f1e9db; }
.project-copy { align-self:center; padding:4px 8px 4px 0; }
.small-label { display:block; font-size:10px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; }
.project-copy h3 { font-size:clamp(25px,2.55vw,39px); margin:8px 0; line-height:1; }
.project-copy h3 { max-width:290px; }
.project-copy h3 { max-width:250px; margin:6px 0; }
.project-picker { grid-template-columns:32% minmax(0,1fr); padding-top:24px; padding-bottom:22px; }
.project-builds { margin:10px 0; }
.project-copy .button { margin-top:10px; }
.project-copy .price-footnote { margin-top:5px; }
.project-price { font-size:20px; font-weight:800; color:var(--red); }
.project-builds { display:flex; border:1px solid #d2c6ba; border-radius:36px; overflow:hidden; margin:10px 0; }
.project-builds button { width:50%; padding:8px 12px; min-height:48px; border-radius:30px; font-size:12px; line-height:1.25; }
.project-builds strong { display:block; font-weight:700; margin-top:3px; }
.project-builds [aria-pressed=true] { background:var(--red); color:white; }
[data-project-includes] { font-size:12px; color:var(--muted); line-height:1.5; }
.project-description { font-size:11px; margin-top:7px; color:var(--muted); }
.project-copy .button { width:100%; margin-top:10px; min-height:47px; }
.price-footnote { font-size:10px; line-height:1.5; color:var(--muted); margin-top:8px; }
.section-pad { padding:65px var(--page); max-width:1600px; margin:auto; }
.season-finds { padding-top:34px; padding-bottom:50px; }
.finds-heading { display:grid; grid-template-columns:30% 1fr auto; gap:25px; align-items:center; margin-bottom:18px; }
.finds-heading h2 { font-size:clamp(29px,3vw,43px); }
.finds-heading h2 span { color:var(--red); }
.finds-heading h2 .finds-prefix { color:var(--ink); }
.finds-heading p { font-size:13px; line-height:1.6; color:var(--muted); }
.finds-heading .text-link { color:var(--red); font-size:12px; }
.season-finds-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.find-tile { min-width:0; padding:0; text-align:left; }
.find-art { display:block; position:relative; height:clamp(180px,17vw,265px); background:#e9dfd0; border-radius:15px; overflow:hidden; }
.find-art>img { width:100%; height:100%; object-fit:contain; transition:opacity .2s; }
.find-art { height:clamp(180px,15.3vw,235px); }
.find-art>img[src*="/painting/"] { object-fit:cover; }
.find-tile:hover .find-art { outline:2px solid var(--red); outline-offset:3px; }
.product-type,.hot-type { display:inline-block; width:fit-content; padding:4px 10px; border-radius:20px; color:#2e2527; background:var(--white); font-size:10px; font-weight:650; line-height:1.4; }
.find-art .product-type { position:absolute; right:10px; top:10px; }
.image-note { position:absolute; bottom:0; left:0; width:100%; padding:5px 9px; color:white; background:#302017e6; font-size:9px; line-height:1.4; }
.find-title { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:11px 5px 0; font-size:12px; font-weight:800; line-height:1.4; }
.find-title strong { flex-shrink:0; }
.find-note { display:block; padding:3px 5px 0; font-size:11px; line-height:1.5; color:var(--muted); }
.hot-section { display:grid; grid-template-columns:40% minmax(0,1fr); gap:7%; background:#eae3d9; align-items:center; }
.hot-copy>p:not(.eyebrow) { max-width:400px; color:var(--muted); margin:22px 0; }
.hot-copy h2 { font-size:clamp(42px,5.3vw,78px); }
.hot-carousel { display:grid; gap:14px; padding:22px; background:var(--paper); border-radius:28px; min-width:0; }
.hot-heading { display:flex; justify-content:space-between; align-items:center; }
.hot-heading h2 { font-size:28px; letter-spacing:-.035em; }
.hot-type { background:var(--red); color:white; }
.hot-slide { display:grid; grid-template-rows:300px auto; gap:14px; min-width:0; }
.hero-product-image { display:block; width:100%; min-width:0; height:100%; background:#e7ddcf; border-radius:16px; overflow:hidden; }
.hero-product-image img { width:100%; height:100%; object-fit:contain; object-position:center; transform:none; }
.hero-product-caption { display:flex; justify-content:space-between; gap:14px; align-items:center; width:100%; text-align:left; padding:0; }
.hero-product-caption small { display:block; font-size:9px; letter-spacing:.08em; color:var(--muted); text-transform:uppercase; }
.hero-product-caption strong { display:block; font:700 24px/1.1 'Outfit',sans-serif; margin:4px 0; }
.hero-price { display:flex; gap:8px; align-items:center; font-weight:750; }
.hot-reference { display:block; font-size:10px; color:var(--muted); max-width:350px; }
.hot-controls { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:14px; border-top:1px solid var(--line); padding-top:10px; }
.hot-arrows { display:flex; align-items:center; gap:7px; font-size:10px; }
.hot-arrows button,.hot-toggle { min-height:38px; padding:6px; font-size:11px; border-radius:10px; }
.hot-arrows button:hover,.hot-toggle:hover { background:var(--soft); }
.hot-count { font-variant-numeric:tabular-nums; font-size:10px; }
.hot-dots { display:flex; justify-content:center; gap:1px; }
.hot-dots button { display:grid; place-items:center; min-width:23px; min-height:36px; padding:4px; }
.hot-dots span { display:block; width:5px; height:5px; background:#c7bbb0; border-radius:50%; }
.hot-dots [aria-pressed=true] span { background:var(--red); width:16px; border-radius:6px; }
.section-heading,.paint-offers-heading { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:32px; }
.section-heading>p,.paint-offers-heading>p { color:var(--muted); max-width:370px; font-size:14px; }
.collection-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); padding:0 0 20px; }
.filter-list { display:flex; gap:6px; flex-wrap:wrap; }
.filter { padding:9px 18px; min-height:44px; border-radius:30px; font-size:12px; font-weight:650; }
.filter:hover { background:var(--soft); }
.filter.active { background:var(--red); color:white; }
.catalog-search { display:flex; align-items:center; gap:10px; border:1px solid var(--line); border-radius:30px; padding:8px 14px; width:260px; }
.catalog-search input { width:100%; min-width:0; padding:3px 0; border:0; background:transparent; outline-offset:3px; font-size:12px; }
.catalog-search .icon { width:18px; height:18px; flex-basis:18px; }
.catalog-status { margin:16px 0; font-size:11px; color:var(--muted); }
.active-build,.active-season { display:flex; justify-content:space-between; gap:15px; padding:14px 18px; margin-top:15px; background:#efe0d4; border-radius:12px; font-size:12px; }
.active-build button,.active-season button { text-decoration:underline; white-space:nowrap; }
.product-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px 18px; align-items:start; }
.product-card { min-width:0; }
.product-image-wrap { position:relative; display:grid; grid-template-rows:36px minmax(0,1fr) auto; aspect-ratio:4/5; padding:10px; gap:5px; background:#e9e0d4; border-radius:18px; }
.product-image-button { grid-row:2; min-height:0; width:100%; padding:0; }
.product-image { width:100%; height:100%; object-fit:contain; object-position:center; transform:none; }
.product-type { grid-row:3; align-self:end; margin-top:4px; }
.save-button { grid-row:1; justify-self:end; padding:9px; border-radius:50%; width:36px; height:36px; background:var(--paper); }
.save-button .icon { width:18px; height:18px; }
.save-button[aria-pressed=true] { background:#eeb7b5; }
.product-card h3 { font:750 18px/1.2 'Outfit',sans-serif; letter-spacing:-.025em; margin-top:14px; }
.product-card h3 button { padding:0; text-align:left; }
.product-meta { display:flex; gap:10px; justify-content:space-between; margin:9px 0 13px; font-size:11px; }
.product-meta>span:first-child { font-weight:800; font-size:13px; }
.product-meta>span:last-child { color:var(--muted); text-align:right; }
.product-brand,.product-reference { font-size:10px; color:var(--muted); margin-top:8px; }
.product-package-actions { display:flex; border:1px solid var(--line); border-radius:13px; overflow:hidden; margin-top:8px; }
.product-package-actions button { display:grid; gap:2px; width:50%; padding:8px 5px; font-size:10px; }
.product-package-actions button+button { border-left:1px solid var(--line); }
.product-package-actions button:hover { background:var(--soft); }
.product-package-actions strong { font-size:12px; color:var(--red); }
.build-product-link { font-size:10px; text-align:left; padding:10px 0; color:var(--red); }
.quick-add { display:flex; align-items:center; justify-content:space-between; width:100%; padding:11px 14px; border-radius:30px; background:var(--ink); color:white; font-size:11px; font-weight:650; min-height:40px; }
.quick-add:hover { background:var(--red); }
.catalog-note { display:flex; justify-content:space-between; gap:20px; border-top:1px solid var(--line); margin-top:38px; padding-top:20px; font-size:12px; color:var(--muted); }
.paint-offers { background:#f0e9df; }
.paint-offers h2 span,.about-section h2 span { color:var(--red); }
.paint-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); list-style:none; padding:0; margin:35px 0; gap:30px; }
.paint-steps li { display:grid; grid-template-columns:38px 1fr; gap:3px 14px; }
.paint-steps li>span { grid-row:1/3; font:700 25px/1.1 'Outfit',sans-serif; color:var(--red); }
.paint-steps strong { font-size:13px; }
.paint-steps small { color:var(--muted); font-size:11px; }
.paint-offer-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.paint-offer-card { overflow:hidden; background:var(--paper); border-radius:25px; }
.paint-offer-art { display:grid; grid-template-rows:300px auto; }
.paint-offer-art img { height:100%; width:100%; object-fit:cover; }
.paint-offer-art figcaption { padding:9px 20px; background:var(--cream); font-size:9px; font-weight:650; letter-spacing:.04em; }
.paint-offer-body { padding:28px; }
.paint-offer-number { font-size:10px; letter-spacing:.12em; color:var(--muted); }
.paint-offer-title { display:flex; justify-content:space-between; align-items:start; gap:20px; margin:16px 0; }
.paint-offer-title h3 { font-size:38px; }
.paint-offer-price { text-align:right; font-size:11px; }
.paint-offer-price strong { display:block; font:800 29px/1.1 'Outfit',sans-serif; color:var(--red); }
.paint-offer-price small { display:block; }
.paint-offer-body>p,.paint-offer-body li { font-size:12px; }
.paint-offer-body ul { padding:10px 0 10px 18px; color:var(--muted); }
.paint-offer-body li { padding-bottom:6px; }
.paint-offer-body .button { width:100%; }
.paint-offers-note { font-size:11px; color:var(--muted); margin-top:20px; max-width:1100px; }
.paint-film { display:grid; grid-template-columns:1fr 320px; align-items:center; gap:70px; padding:65px 7% 0; }
.paint-film h3 { font-size:clamp(50px,6vw,90px); line-height:.95; }
.paint-film-copy>p:not(.eyebrow) { margin:20px 0; font-size:14px; max-width:450px; }
.paint-film-copy>.paint-film-note { font-size:11px!important; color:var(--muted); }
.paint-film figure { min-width:0; }
.paint-film video { max-height:480px; width:100%; height:auto; border-radius:24px; background:#271511; }
.paint-film figcaption { font-size:10px; line-height:1.5; margin-top:10px; color:var(--muted); }
.seasonal-section { display:grid; grid-template-columns:1fr 1fr; max-width:1600px; margin:auto; background:var(--season-surface,#570b14); color:var(--season-ink,#fffaf3); }
.seasonal-art { position:relative; min-height:550px; background:#dfd2c2; padding:30px; }
.seasonal-art img { width:100%; height:100%; max-height:550px; object-fit:contain; }
.seasonal-art figcaption { position:absolute; left:25px; bottom:20px; font-size:10px; color:#302a26; background:var(--paper); padding:6px 12px; border-radius:20px; }
.seasonal-copy { align-self:center; padding:60px 12%; }
.seasonal-copy h2 { font-size:clamp(46px,5.8vw,85px); }
.seasonal-copy>p:not(.eyebrow) { margin:25px 0; opacity:.9; font-size:13px; }
.seasonal-copy .button { background:var(--season-ink,#fffaf3); color:var(--season-surface,#570b14); }
.seasonal-copy .button .icon { filter:none; }
.seasonal-heading-accent { color:inherit; }
.stl-section { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:12%; border-bottom:1px solid var(--line); }
.stl-copy>p:not(.price-footnote) { margin:20px 0; color:var(--muted); font-size:14px; }
.status-label { font-size:10px; letter-spacing:.08em; font-weight:750; }
.about-section { display:grid; grid-template-columns:30% 1fr; gap:8%; }
.about-section>div>p { max-width:650px; margin:30px 0; color:var(--muted); font-size:15px; }
.faq-section { display:grid; grid-template-columns:35% 1fr; gap:5%; background:#eee6db; }
.faq-list details { border-bottom:1px solid #cfc4b6; }
.faq-list summary { display:flex; justify-content:space-between; align-items:center; cursor:pointer; list-style:none; padding:22px 0; gap:20px; font-weight:750; font-size:14px; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary>span { display:none; }
.faq-list summary>.icon { width:18px; height:18px; flex-basis:18px; transition:transform .2s; }
.faq-list details[open] summary>.icon { transform:rotate(90deg); }
.faq-list p { padding:0 28px 24px 0; font-size:12px; color:var(--muted); }
.contact-section { display:flex; justify-content:space-between; align-items:center; gap:32px; padding:55px var(--page); max-width:1600px; margin:auto; background:var(--red); color:var(--paper); }
.contact-section h2 { font-size:clamp(35px,4vw,60px); }
.site-footer { padding:36px var(--page); max-width:1600px; margin:auto; }
.footer-links { display:flex; flex-wrap:wrap; gap:22px; font-size:11px; align-items:center; }
.footer-links>span { margin-left:auto; color:var(--muted); }
.footer-links button { padding:0; font-size:11px; }
.footer-wordmark { display:block; width:fit-content; font-size:clamp(38px,10.3vw,155px); letter-spacing:-.065em; font-weight:800; line-height:1.2; margin:22px 0 5px; }
.site-footer>p { font-size:9px; letter-spacing:.2em; color:var(--muted); }
/* Every real product keeps its complete silhouette. No hover zoom. */
@supports (object-view-box:inset(1%)) {
  img[src$="boo-tyful-ghost.jpg"] { object-view-box:inset(28% 0 27% 0); }
  img[src$="stl/chloe-bat.png"] { object-view-box:inset(22% 27% 17% 24%); }
  img[src$="stl/chloe-cat.png"] { object-view-box:inset(23% 27% 15% 27%); }
  img[src$="stl/spicy-gus.png"] { object-view-box:inset(22% 25% 13% 19%); }
  img[src$="stl/skeleton-santa.png"] { object-view-box:inset(17% 22% 7% 17%); }
}
dialog { border:0; background:var(--paper); color:var(--ink); box-shadow:0 20px 90px #160d0e40; }
dialog::backdrop { background:#1c1214aa; backdrop-filter:blur(6px); }
.product-dialog { width:min(1100px,calc(100% - 40px)); max-height:90dvh; padding:30px; border-radius:28px; }
.product-dialog>.dialog-close { position:absolute; top:12px; right:12px; z-index:2; background:var(--paper); }
.product-detail-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:32px; align-items:start; }
.detail-image { width:100%; height:min(67dvh,600px); object-fit:contain; padding:18px; background:#e9e0d4; border-radius:18px; }
.detail-model-preview { min-width:0; margin:0; }
.detail-model-preview figcaption { padding:12px 4px; font-size:10px; color:var(--muted); }
.detail-model-preview figcaption strong { display:block; color:var(--ink); margin-bottom:4px; }
.detail-copy { min-width:0; padding-top:20px; }
.detail-copy h2 { font-size:clamp(28px,3.2vw,44px); }
.detail-description { font-size:12px; line-height:1.8; margin-top:20px; }
.detail-brand,.detail-note,.detail-copy-link { font-size:10px; line-height:1.7; color:var(--muted); margin-top:15px; }
.detail-copy-link { text-decoration:underline; padding:0; }
.detail-copy>.text-link { margin-top:18px; font-size:11px; }
.detail-file-contents,.detail-license,.detail-safety { padding:16px; background:#eee4d7; border-radius:12px; font-size:11px; margin-top:18px; overflow-wrap:anywhere; }
.detail-file-contents h3,.detail-license h3 { font-size:17px; margin-bottom:8px; }
.detail-file-contents ul { padding-left:18px; margin:8px 0; }
.detail-safety { background:#f1ded7; }
.build-options { border:0; padding:0; margin:22px 0; min-width:0; }
.build-options legend { font-size:13px; font-weight:800; margin-bottom:10px; }
.build-option-list { display:grid; gap:8px; }
.build-option-list button { padding:12px 14px; border:1px solid var(--line); border-radius:14px; text-align:left; display:grid; grid-template-columns:1fr auto; gap:4px 12px; }
.build-option-list strong { font-size:12px; }
.build-option-list small { grid-column:1/-1; color:var(--muted); font-size:10px; }
.build-option-price { font-size:12px; font-weight:800; }
.build-option-list [aria-pressed=true] { border:2px solid var(--red); padding:11px 13px; background:#f3e3dc; }
.detail-palette-colors { display:flex; flex-wrap:wrap; gap:8px; padding:0; list-style:none; margin:15px 0; }
.detail-palette-colors li { display:flex; align-items:center; gap:6px; font-size:10px; }
.paint-swatch { display:inline-block; width:16px; height:16px; border:1px solid #9d9389; background:var(--paint-color); border-radius:50%; }
.build-palette,.build-disclosure { font-size:10px; color:var(--muted); margin:10px 0; }
.detail-selection { font-size:11px; font-weight:700; }
.detail-price { font:800 31px/1.2 'Outfit',sans-serif; margin:5px 0 16px; color:var(--red); }
.detail-purchase>.button { width:100%; }
.bag-dialog { position:fixed; inset:0 0 0 auto; width:min(520px,100%); height:100dvh; max-height:none; max-width:100%; margin:0; padding:28px; border-radius:25px 0 0 25px; }
.drawer-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.drawer-heading h2 { font-size:43px; }
.drawer-heading .eyebrow { margin-bottom:4px; }
.bag-intro { font-size:12px; color:var(--muted); margin:20px 0; }
.bag-item { display:grid; grid-template-columns:90px minmax(0,1fr); gap:17px; padding:20px 0; border-bottom:1px solid var(--line); }
.bag-item img { width:90px; height:110px; object-fit:contain; padding:5px; background:#e9e0d4; border-radius:12px; }
.bag-item h3 { font-size:20px; }
.bag-item p { font-size:10px; margin-top:5px; color:var(--muted); }
.bag-item-controls { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px; }
.quantity-controls { display:flex; align-items:center; border:1px solid var(--line); border-radius:20px; font-size:12px; }
.quantity-controls button { min-width:35px; min-height:35px; }
.remove-item { font-size:10px; text-decoration:underline; padding:6px; }
.digital-bag-note { font-size:10px; }
.bag-footer { padding-top:24px; }
.bag-summary>div { display:flex; justify-content:space-between; font-size:17px; }
.bag-summary p,.bag-footer>p,.checkout-status,.checkout-reason { color:var(--muted); font-size:10px; line-height:1.6; margin:10px 0; }
.bag-footer .button { width:100%; margin-top:10px; font-size:12px; }
.bag-footer .button-dark:disabled { opacity:.5; }
.bag-empty,.empty-state { padding:35px 0; font:700 27px/1.1 'Outfit',sans-serif; }
.bag-empty p,.empty-state p { font:12px/1.7 'Manrope',sans-serif; margin:20px 0; }
.empty-state { grid-column:1/-1; text-align:center; min-height:300px; }
.empty-state>.icon { margin:0 auto 20px; width:44px; height:44px; }
.music-panel { position:fixed; right:20px; top:86px; z-index:10; width:min(360px,calc(100% - 40px)); max-height:calc(100dvh - 110px); overflow:auto; border:1px solid var(--line); border-radius:22px; background:var(--paper); padding:22px; box-shadow:0 18px 55px #2b182226; }
.music-header { display:flex; align-items:center; justify-content:space-between; }
.music-header .eyebrow { margin-bottom:5px; font-size:8px; }
.music-header h2 { font-size:34px; }
.music-now-playing { margin-top:20px; }
#music-current-title { font-size:14px; font-weight:750; }
#music-current-artist,#music-status,.music-disclosure { font-size:10px; color:var(--muted); }
.radio-controls { display:flex; gap:8px; margin:18px 0; }
.radio-controls button { background:var(--soft); border-radius:20px; min-height:38px; padding:8px 14px; font-size:11px; }
#radio-play-pause { background:var(--red); color:white; }
.music-volume { display:flex; gap:10px; align-items:center; font-size:10px; margin-bottom:10px; }
.music-volume input { width:100%; min-width:0; accent-color:var(--red); }
#music-queue { list-style:none; padding:0; margin:15px 0; }
#music-queue button { display:flex; align-items:center; gap:10px; text-align:left; width:100%; padding:11px; border-radius:10px; font-size:11px; }
#music-queue button[aria-current=true],#music-queue button:hover { background:var(--soft); }
.track-title { font-weight:700; }
.track-artist,.track-duration { font-size:9px; color:var(--muted); }
.toast { position:fixed; bottom:24px; left:50%; transform:translate(-50%,20px); opacity:0; pointer-events:none; max-width:calc(100% - 32px); padding:13px 24px; border-radius:28px; background:var(--ink); color:white; font-size:12px; z-index:30; transition:opacity .2s,transform .2s; }
.toast.visible { opacity:1; transform:translate(-50%,0); }
@media(min-width:1600px) { .studio-hero { padding-left:72px; } }
@media(max-width:1250px) { .site-header { gap:20px; } .desktop-nav { gap:20px; } .search-toggle { width:90px; } .header-music-controls { border:0; } .music-control-name { display:none; } .music-settings-toggle { border:0; } .project-picker { gap:24px; } .project-recommendation { gap:20px; } .project-copy h3 { font-size:30px; } .project-description { display:none; } .hero-copy h1 { font-size:7.3vw; } .hero-actions { gap:17px; } .hero-actions .button { padding:14px 22px; } .hero-actions .text-link { font-size:12px; } }
@media(max-width:1050px) { .desktop-nav { display:none; } .menu-toggle { display:grid; } .site-header { min-height:80px; } .search-toggle { width:130px; } .hero-copy h1 { font-size:7.3vw; } .hero-art { min-height:440px; border-radius:75px 35px 60px 0; } .hero-copy { padding-top:24px; padding-bottom:35px; } .hero-copy .eyebrow { font-size:8px; } .hero-description { font-size:17px; } .hero-actions { flex-direction:column; align-items:start; } .project-picker { grid-template-columns:29% minmax(0,1fr); gap:20px; padding:26px var(--page); } .project-intents h2 { margin-left:0; font-size:31px; } button[data-project-intent] { padding:12px 15px; gap:10px; font-size:13px; } .project-recommendation { grid-template-columns:40% minmax(0,1fr); padding:14px; gap:18px; } .project-copy h3 { font-size:26px; } .project-copy .small-label { font-size:8px; } .project-price { font-size:17px; } .project-photo img { min-height:260px; } .project-builds button { font-size:10px; } [data-project-includes] { font-size:10px; } .project-copy .button { min-height:44px; font-size:11px; } .finds-heading { grid-template-columns:1fr 1fr; gap:18px; } .finds-heading .text-link { grid-column:2; } .finds-heading p { font-size:12px; } .finds-heading h2 { grid-row:1/3; font-size:34px; } .product-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .hot-section { gap:5%; grid-template-columns:35% minmax(0,1fr); } .hot-controls { grid-template-columns:1fr auto; } .hot-dots { grid-column:1/-1; grid-row:2; } .hot-toggle { grid-column:2; grid-row:1; } .paint-film { padding-left:0; padding-right:0; gap:40px; grid-template-columns:1fr 280px; } .paint-offer-title h3 { font-size:31px; } }
@media(max-width:760px) { :root { --page:24px; } .site-header { padding-top:18px; padding-bottom:18px; gap:12px; } .brand { font-size:27px; } .header-actions { gap:3px; } .search-toggle { width:38px; min-height:40px; border:0; padding:8px; } .search-toggle span { display:none; } .header-music-controls { display:none; } .icon-button { width:38px; height:40px; flex-basis:38px; } .bag-count { top:0; right:0; } .studio-hero { grid-template-columns:1fr; padding:0 var(--page); gap:24px; } .hero-copy { padding:25px 0 0; } .hero-copy .eyebrow { font-size:9px; margin-bottom:19px; } .hero-copy h1 { font-size:clamp(65px,12vw,90px); line-height:.9; margin-bottom:20px; } .hero-description { font-size:18px; max-width:430px; } .hero-actions { flex-direction:row; align-items:center; margin-top:25px; margin-bottom:5px; } .hero-actions .button { padding:15px 24px; font-size:12px; } .hero-art { min-height:0; height:auto; aspect-ratio:4/3; border-radius:55px 25px 55px 0; } .season-pill { top:15px; right:15px; font-size:10px; padding:8px 12px; } .hero-art figcaption { bottom:16px; right:16px; font-size:10px; } .project-picker { grid-template-columns:1fr; margin-top:28px; border-radius:30px 30px 0 0; gap:25px; padding:28px var(--page); } .project-intents h2 { font-size:34px; margin:0 0 20px; } .project-intents h2 br { display:none; } .project-intents [role=group] { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; } button[data-project-intent] { flex-direction:column; gap:7px; justify-content:center; padding:13px 8px; border-radius:18px; font-size:10px; line-height:1.3; text-align:center; min-height:80px; } button[data-project-intent] .icon:last-child { display:none; } .project-recommendation { grid-template-columns:42% minmax(0,1fr); gap:17px; padding:14px; } .project-copy h3 { font-size:clamp(23px,4vw,31px); } .project-photo img { min-height:260px; } .project-copy .small-label { font-size:8px; } .section-pad { padding:45px var(--page); } .season-finds { padding-top:30px; } .finds-heading { grid-template-columns:1fr; gap:12px; } .finds-heading h2 { grid-row:auto; font-size:34px; } .finds-heading h2 br { display:none; } .finds-heading p { font-size:12px; } .finds-heading .text-link { grid-column:auto; } .season-finds-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 14px; } .find-art { height:auto; aspect-ratio:4/3; } .find-title { font-size:11px; gap:8px; } .find-note { font-size:10px; } .image-note { font-size:8px; } .hot-section { grid-template-columns:1fr; gap:28px; } .hot-copy h2 { font-size:52px; } .hot-copy>p:not(.eyebrow) { margin:18px 0; } .hot-copy h2 br { display:none; } .hot-slide { grid-template-rows:300px auto; } .hot-heading h2 { font-size:27px; } .section-heading,.paint-offers-heading { align-items:start; flex-direction:column; gap:18px; margin-bottom:25px; } .section-heading h2 { font-size:43px; } .section-heading>p,.paint-offers-heading>p { font-size:12px; } .collection-toolbar { align-items:stretch; flex-direction:column; gap:16px; } .filter-list { gap:2px; } .filter { padding:8px 14px; font-size:11px; } .catalog-search { width:100%; } .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:27px 14px; } .product-card h3 { font-size:18px; } .product-image-wrap { padding:8px; gap:3px; border-radius:14px; } .product-type { font-size:8px; padding:4px 7px; } .product-meta { flex-direction:column; gap:3px; } .product-meta>span:last-child { text-align:left; font-size:9px; } .product-package-actions button { font-size:9px; padding:7px 3px; } .product-package-actions strong { font-size:11px; } .build-product-link { font-size:9px; } .quick-add { padding:10px 12px; font-size:10px; min-height:42px; } .catalog-note { flex-direction:column; font-size:11px; gap:12px; } .paint-offers h2 { font-size:38px; } .paint-steps { gap:18px; grid-template-columns:1fr; margin:25px 0; } .paint-offer-grid { grid-template-columns:1fr; gap:22px; } .paint-offer-art { grid-template-rows:auto auto; } .paint-offer-art img { aspect-ratio:4/3; } .paint-offer-body { padding:24px; } .paint-offer-title h3 { font-size:35px; } .paint-film { grid-template-columns:1fr; gap:25px; padding-top:40px; } .paint-film h3 { font-size:65px; } .paint-film figure { max-width:300px; margin:auto; } .paint-film-copy>p:not(.eyebrow) { font-size:12px; } .seasonal-section { grid-template-columns:1fr; } .seasonal-art { min-height:330px; height:390px; padding:25px; } .seasonal-art img { max-height:340px; } .seasonal-copy { padding:40px var(--page); } .seasonal-copy h2 { font-size:59px; } .stl-section { grid-template-columns:1fr; gap:25px; } .stl-section h2 { font-size:48px; } .about-section { grid-template-columns:1fr; gap:6px; } .about-section h2 { font-size:39px; } .about-section>div>p { font-size:13px; margin:23px 0; } .faq-section { grid-template-columns:1fr; gap:24px; } .faq-section h2 { font-size:43px; } .faq-list summary { font-size:13px; } .contact-section { flex-direction:column; align-items:start; gap:25px; padding:38px var(--page); } .contact-section h2 { font-size:39px; } .footer-links { gap:15px; font-size:10px; } .footer-links>span { width:100%; margin-left:0; } .footer-wordmark { font-size:9vw; white-space:nowrap; } .product-dialog { width:calc(100% - 22px); padding:20px; border-radius:22px; } .product-detail-grid { grid-template-columns:1fr; gap:10px; } .detail-image { height:330px; padding:12px; } .detail-copy h2 { font-size:35px; } .detail-copy { padding-top:15px; } .bag-dialog { padding:24px; } .bag-item { grid-template-columns:76px minmax(0,1fr); gap:13px; } .bag-item img { width:76px; height:100px; } .bag-item h3 { font-size:18px; } .music-panel { top:70px; } }
@media(max-width:420px) { .brand { font-size:24px; } .header-actions { gap:0; } .search-toggle { display:none; } .hero-copy h1 { font-size:clamp(58px,15.2vw,65px); } .hero-actions { gap:20px; } .hero-actions .button { min-height:51px; } .hero-art { aspect-ratio:1.18; } .project-intents h2 { font-size:31px; } .project-recommendation { grid-template-columns:1fr; } .project-photo { grid-template-rows:180px auto; } .project-photo img { min-height:0; } .project-copy { padding:5px; } .project-copy h3 { font-size:29px; } .project-price { font-size:20px; } .project-builds button { font-size:12px; } [data-project-includes] { font-size:12px; } .project-copy .small-label { font-size:9px; } .project-copy .button { min-height:48px; font-size:12px; } .finds-heading h2 { font-size:31px; } .hot-carousel { padding:17px; } .hot-slide { grid-template-rows:250px auto; } .hero-product-caption strong { font-size:21px; } .hot-controls { gap:4px; } .product-grid { gap:25px 12px; } .product-card h3 { font-size:16px; } .product-type { font-size:7px; } .paint-offer-title h3 { font-size:29px; } .paint-offer-price strong { font-size:25px; } .product-image-wrap { aspect-ratio:3/4; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; animation:none!important; } }
@media(min-width:1051px) {
 .site-header { min-height:72px; padding-top:14px; padding-bottom:14px; }
 .hero-copy { padding-top:32px; padding-bottom:22px; align-self:stretch; }
 .hero-copy h1 { font-size:7.45vw; font-weight:800; letter-spacing:-.025em; line-height:.79; }
 .hero-description { line-height:1.25; }
 .hero-actions { margin-top:24px; }
 .hero-art { min-height:472px; }
}
@media(max-width:760px) {
 .header-music-controls { display:flex; }
 .music-settings-toggle,.search-toggle { display:none; }
 .music-quick-toggle { min-height:38px; min-width:29px; padding:6px; }
 .header-actions { gap:0; }
 .brand { font-size:24px; }
 .product-type { font-size:9px; }
 .seasonal-section { grid-template-columns:minmax(0,1fr); }
 .seasonal-art,.seasonal-copy { min-width:0; }
 .seasonal-copy h2 { font-size:clamp(42px,13.7vw,59px); }
 .desktop-break { display:none; }
}