/* JEUPAD collection refresh: original brand, real catalog imagery. */
:root { --paper: #f5f5f2; --muted: #626772; }
body { overflow-x: clip; }
main { overflow: clip; }
.shell { width: min(1240px, calc(100% - 64px)); }
.section { padding-block: 100px; }
.site-header { background: #0b0d12; }
.header-inner { height: 80px; gap: 22px; }
.site-nav { gap: 26px; }
.site-nav a { color: #c9cbd0; }
.hero { min-height: 790px; grid-template-columns: 1fr 1fr; gap: 48px; padding-top: 126px; padding-bottom: 64px; }
.hero::before { position: absolute; z-index: -1; top: 0; bottom: 0; left: calc((min(1240px, 100vw - 64px) - 100vw)/2); right: calc((min(1240px, 100vw - 64px) - 100vw)/2); background: #0b0d12; }
.hero::after { display: none; }
.hero { isolation: isolate; }
.hero h1 { font-size: clamp(3.4rem, 5.35vw, 5.2rem); line-height: 1.04; letter-spacing: -.065em; }
.hero h1 em { white-space: normal; }
.hero h1 em::after { display: none; }
.hero-lead { max-width: 430px; color: #c0c4cc; line-height: 1.8; }
.hero-points { font-size: .64rem; gap: 20px; color: #c3c8d0; }
.hero-showcase { min-height: 0; padding: 25px; background: #fafaf9; border-radius: 24px; color: var(--ink); box-shadow: none; overflow: hidden; }
.hero-showcase::before { display: none; }
.showcase-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: .63rem; font-weight: 800; letter-spacing: .09em; color: #656b72; }
.showcase-dot { padding: 5px 9px; background: #e9eddc; border-radius: 6px; color: #35421e; white-space: nowrap; }
.hero-showcase .showcase-main { position: static; width: 100%; height: auto; aspect-ratio: 2/1; object-fit: contain; margin: 30px 0 20px; mix-blend-mode: normal; filter: none; }
.showcase-caption { display:flex; align-items:center; justify-content:space-between; padding-bottom: 23px; }
.showcase-caption span { font: 700 .65rem 'Manrope',sans-serif; color: #656b72; letter-spacing: .08em; }
.showcase-caption h2 { margin:4px 0 0; font: 600 1.7rem 'Space Grotesk',sans-serif; letter-spacing: -.04em; }
.showcase-caption>a { display:grid; place-items:center; background:var(--ink); color:white; border-radius:50%; width:42px; height:42px; }
.showcase-pair { display:grid; grid-template-columns:1fr 1fr; gap: 12px; }
.showcase-pair a { background:white; border:1px solid #e2e4e2; border-radius:14px; padding:12px; }
.hero-showcase .showcase-pair img { position:static; width:100%; height:88px; object-fit:contain; mix-blend-mode:normal; filter:none; }
.showcase-pair span { display:flex; justify-content:space-between; margin-top:12px; color:#484e56; font-size:.65rem; font-weight:800; }
.showcase-pair i { font-style:normal; }
.showcase-note { margin:16px 0 0; font-size:.62rem; color:#606771; }
.ticker { padding-block: 16px; }
.ticker-track { animation:none; justify-content:center; width:100%; gap: 35px; }
.ticker-track > :nth-child(n+9) { display:none; }
.ticker span { font-size: .67rem; white-space:nowrap; }
.section-heading h2 { font-size:clamp(2.8rem,4.7vw,4.4rem); line-height:1.04; }
.section-heading >p { max-width:350px; font-size:.88rem; line-height:1.8; color:#5c626c; }
.collection-toolbar { margin-bottom:24px; }
.filter-bar { margin:0; padding:0 0 14px; scrollbar-width:thin; }
.filter-button { min-height:46px; padding:6px 11px 6px 17px; }
.filter-count { margin:6px 0 0; color:#646b75; font-size:.72rem; }
.product-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px 22px; }
.product-card { border-radius:20px; background:white; border:1px solid #e1e4e4; overflow:hidden; }
.product-image-wrap { position:relative; padding:18px 16px 0; }
.product-photo { display:block; width:100%; padding:0; border:0; background:white; cursor:zoom-in; }
.product-photo img { width:100%; height:204px; object-fit:contain; transition:transform .3s; }
.product-photo:hover img { transform:scale(1.025); }
.photo-zoom { position:absolute; right:19px; bottom:5px; display:grid; place-items:center; width:27px; height:27px; border:1px solid #dfe3e8; background:#ffffffec; color:#606773; border-radius:50%; font-size:.75rem; pointer-events:none; }
.product-views { display:flex; gap:7px; min-height:43px; align-items:center; padding:0 18px; }
.view-choice { min-height:32px; border:0; border-radius:5px; background:transparent; padding:5px 8px; color:#686e78; font:600 .63rem 'Manrope',sans-serif; cursor:pointer; }
.view-choice.is-active { color:#20252d; background:#eef1e9; }
.product-detail { padding:16px 22px 22px; border-top:1px solid #eceeeb; }
.product-kicker { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:.63rem; font-weight:800; letter-spacing:.07em; margin:0 0 9px; }
.product-kicker span { font-weight:500; letter-spacing:0; color:#696f78; }
.product-detail h3 { font:600 1.26rem 'Space Grotesk',sans-serif; letter-spacing:-.035em; margin:0 0 11px; }
.product-size { margin:0; font-size:.72rem; color:#424951; font-weight:600; }
.product-size span { color:#666e78; font-weight:400; font-size:.64rem; }
.product-example { margin:5px 0 20px; font-size:.68rem; color:#606873; }
.product-action { min-height:43px; padding:10px 0 0; border-top:1px solid #e4e6e4; display:flex; align-items:center; justify-content:space-between; font-weight:800; font-size:.75rem; }
.product-action:hover { color:var(--blue-deep); }
.product-shop { display:inline-flex; min-height:38px; align-items:center; color:#43546b; font-size:.72rem; text-decoration:underline; text-underline-offset:3px; }
.collection-note { max-width:850px; margin:30px 0 0; color:#606873; font-size:.73rem; line-height:1.8; }
.designer-section { padding-block:100px; background:#e9ecef; }
.designer-heading h2 { font-size:clamp(2.8rem,4.5vw,4.7rem); line-height:1.05; }
.designer-heading>p:not(.eyebrow) { color:#535d6a; }
.designer-heading ul { color:#535d6a; }
.control-block p,.control-group output,.reset-button { color:#596270; }
.download-button small { color:#e1e8f5; }
.canvas-hint { position:static; transform:none; width:fit-content; margin:12px auto 0; text-align:center; }
.privacy-note { color:#56606e; font-size:.72rem; }
.benefits-inner { padding-block:100px; }
.benefit-image-wrap { min-height:400px; }
.benefit-copy h2 { font-size:clamp(2.8rem,4.5vw,4.5rem); line-height:1.05; }
.contact-section { padding:95px 0; background:#11151b; color:white; }
.contact-heading h2 { margin:0; font:600 clamp(3rem,5.5vw,5rem)/1.02 'Space Grotesk',sans-serif; letter-spacing:-.055em; }
.contact-heading h2 em { color:var(--lime); font-style:normal; }
.contact-heading>p:last-child { max-width:500px; color:#c0c5cc; margin:28px 0 42px; font-size:.92rem; }
.contact-layout { display:grid; grid-template-columns:1fr 1fr; gap:90px; align-items:start; }
.order-steps { margin:0; padding:0; list-style:none; }
.order-steps li { display:flex; gap:22px; padding:20px 0; border-top:1px solid #353b43; }
.order-steps>li>span { font-size:.75rem; color:var(--lime); padding-top:4px; }
.order-steps h3 { margin:0 0 6px; font-size:1rem; }
.order-steps p { margin:0; color:#adb6c2; font-size:.82rem; max-width:370px; }
.contact-card { border:1px solid #3d454d; border-radius:22px; padding:32px; background:#1b2129; }
.contact-card h3 { margin:0 0 24px; font:600 1.75rem 'Space Grotesk',sans-serif; letter-spacing:-.04em; }
.contact-card label { display:block; font-size:.75rem; margin-bottom:7px; color:#c5ced9; }
.contact-card select { width:100%; min-height:48px; padding:12px; border-radius:9px; background:#11151b; color:white; border:1px solid #5a6470; font:inherit; margin-bottom:20px; }
.contact-card .button { width:100%; }
.contact-email { display:block; margin-top:24px; color:#d3dbe4; font-weight:600; font-size:.88rem; overflow-wrap:anywhere; }
.contact-phones { display:flex; flex-wrap:wrap; gap:12px 25px; margin-top:12px; color:#d3dbe4; font-size:.8rem; }
.contact-phones a { padding-block:7px; }
.contact-card>p { margin:18px 0 0; color:#abb5c2; font-size:.67rem; }
.faq { margin-top:65px; }
.faq details { padding:22px 0; border-top:1px solid #353b43; }
.faq summary { cursor:pointer; font-weight:600; font-size:.9rem; }
.faq details p { max-width:760px; margin:18px 0 0; color:#c1cad5; font-size:.83rem; }
.closing { padding-block:70px; }
.closing-card { min-height:300px; padding:40px; }
.closing h2 { font-size:clamp(2.6rem,4.5vw,4.5rem); }
.footer-inner nav { flex-wrap:wrap; }
.copyright { color:#a8b0bc; }
.footer-inner>p:not(.copyright) { color:#b7bfca; }
.image-dialog { width:min(1000px,calc(100% - 32px)); max-height:calc(100dvh - 40px); border:0; border-radius:20px; padding:24px; overflow:auto; color:var(--ink); }
.image-dialog::backdrop { background:#050b15d9; backdrop-filter:blur(5px); }
.dialog-top { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.dialog-top h2 { font:600 1.3rem 'Space Grotesk',sans-serif; margin:0; }
.dialog-top button { min-width:44px; height:44px; border:0; border-radius:50%; background:#edf0f3; cursor:pointer; }
.image-dialog img { width:100%; max-height:70dvh; object-fit:contain; margin-top:15px; }
.image-dialog p { margin:16px 0 0; font-size:.8rem; color:#586271; }
body.dialog-open { overflow:hidden; }
:focus-visible { outline:3px solid #1a73d9; outline-offset:4px; }
.hero :focus-visible,.contact-section :focus-visible,.site-header :focus-visible { outline-color:var(--lime); }
.reveal { opacity:1; transform:none; }
.mobile-buy small { color:#b8c1ce; }
@media(min-width:761px) and (max-width:1040px) { .site-nav { gap:18px; } .header-cta { display:none; } .hero { gap:30px; } .hero h1 { font-size:3.4rem; } .hero-showcase { padding:18px; } .showcase-caption h2 { font-size:1.35rem; } .showcase-pair { gap:7px; } .hero-showcase .showcase-pair img { height:66px; } .hero-points { gap:12px; } .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .designer-shell { grid-template-columns:1fr; } .contact-layout { gap:40px; } }
@media(max-width:760px) {
 .shell { width:calc(100% - 36px); } .header-inner { height:72px; } .site-nav { z-index:1; visibility:hidden; } .site-nav.is-open { visibility:visible; } .menu-toggle { z-index:2; } .menu-toggle[aria-expanded="true"] span:nth-child(2) { transform:translateY(3px) rotate(45deg); }
 .hero { grid-template-columns:1fr; padding-top:112px; padding-bottom:40px; gap:35px; min-height:0; }
 .hero::before { left:-18px; right:-18px; } .hero h1 { font-size:clamp(2.9rem,13.8vw,4.3rem); } .hero-lead { margin-top:25px; } .hero-actions { gap:10px; margin-top:25px; } .hero-points { gap:14px; font-size:.6rem; }
 .hero-showcase { padding:18px; min-height:0; } .hero-showcase .showcase-main { margin-top:24px; } .showcase-caption h2 { font-size:1.5rem; } .hero-showcase .showcase-pair img { height:70px; }
 .ticker-track { justify-content:flex-start; padding-left:20px; gap:20px; } .ticker span { font-size:.6rem; }
 .section { padding-block:68px; } .section-heading { gap:20px; } .section-heading h2 { font-size:clamp(2.5rem,11vw,3.5rem); } .section-heading>p { font-size:.85rem; }
 .filter-button { font-size:.75rem; padding:6px 10px 6px 14px; } .filter-button span { min-width:24px; height:24px; }
 .product-grid { grid-template-columns:1fr; gap:22px; } .product-photo img { height:220px; } .product-detail { padding:16px 20px 20px; } .product-views { padding-inline:15px; } .view-choice { min-height:38px; }
 .designer-section { padding-block:68px; } .designer-heading h2 { font-size:clamp(2.6rem,11.5vw,3.8rem); } .designer-heading li { flex-wrap:wrap; gap:2px 12px; } .designer-heading>p:not(.eyebrow) { font-size:.88rem; }
 .designer-preview { padding:16px; } .designer-controls { padding-inline:16px; } .control-row { gap:8px; } .control-group>label { flex-wrap:wrap; } .canvas-hint { font-size:.62rem; max-width:100%; }
 .benefits-inner { padding-block:68px; gap:45px; } .benefit-image-wrap { min-height:300px; } .benefit-copy h2 { font-size:2.9rem; }
 .contact-section { padding-block:68px; } .contact-heading h2 { font-size:3.4rem; } .contact-layout { grid-template-columns:1fr; gap:30px; } .contact-card { padding:23px; } .contact-email { font-size:.83rem; } .contact-phones { gap:8px 20px; } .faq { margin-top:40px; }
 .closing { padding-block:48px; } .closing-card { padding:30px 24px; min-height:400px; } .closing h2 { font-size:2.8rem; } .closing-link { width:145px; height:145px; font-size:.95rem; }
 .image-dialog { padding:16px; } .dialog-top h2 { font-size:1.1rem; } .mobile-buy { bottom:max(9px,env(safe-area-inset-bottom)); } .footer-inner nav { gap:15px; }
}