/* Super Mundo 3D storefront identity. The spool renderer and filament colors stay untouched. */
:root{--paper:#f3f6fc;--surface:#fff;--surface-2:#e8edf5;--deco:#dce5f3;--ink:#142744;--muted:#5b6e88;--line:#d8e1ee;--line-strong:#7b91ae;--orange:#2464de;--orange-text:#1755c5;--on-orange:#fff;--lime:#ffd43b;--focus:#2464de}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--paper:#0b1323;--surface:#131f34;--surface-2:#1b2a44;--deco:#243651;--ink:#f2f6ff;--muted:#a7b9d2;--line:#2b3d59;--line-strong:#7d96b8;--orange:#3677ef;--orange-text:#8cb7ff;--on-orange:#fff;--lime:#ffd43b;--focus:#84b3ff}}
:root[data-theme="dark"]{--paper:#0b1323;--surface:#131f34;--surface-2:#1b2a44;--deco:#243651;--ink:#f2f6ff;--muted:#a7b9d2;--line:#2b3d59;--line-strong:#7d96b8;--orange:#3677ef;--orange-text:#8cb7ff;--on-orange:#fff;--lime:#ffd43b;--focus:#84b3ff}
body{background:var(--paper);color:var(--ink)}
.announce{background:#123263;color:#dce9ff;border:0;font-size:10px;letter-spacing:.15em}
.site-header{height:88px;padding-inline:4%;gap:22px;background:#0c172df7;color:#eaf1ff;border:0;box-shadow:0 4px 24px #06142a25}
.site-header::after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#2366e4 0 76%,#ffd43b 76% 92%,#ed3b36 92%)}
.brand{gap:11px;flex:none}.brand-logo{display:block;width:60px;height:60px;object-fit:contain;background:#05080e;border-radius:12px;border:1px solid #385077}
.brand-name{color:inherit;font-size:13px;line-height:1.2;letter-spacing:.015em}.brand-name b{color:#ffd43b}
.site-header nav{gap:24px;font-size:13px;white-space:nowrap}.site-header nav a{min-height:44px;display:flex;align-items:center}.site-header nav a:hover{color:#ffd43b}
.site-header .search{background:#182843;border-color:#34496a;border-radius:12px;max-width:360px}.site-header .search input{color:#eaf1ff;font-size:13px}.site-header .search input::placeholder{color:#abbcd5}.site-header .search-go:hover,.site-header .icon-btn:hover{background:#294064}.site-header .bag{font-size:13px;white-space:nowrap}.site-header .bag span{background:#ffd43b;color:#122542}
.hero{padding-top:58px;background:radial-gradient(ellipse at 50% 66%,#174073 0,transparent 56%),#0c172d;color:#f2f6ff;border-bottom:1px solid #254166;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 47px,#99b7ec05 48px 49px),repeating-linear-gradient(90deg,transparent 0 47px,#99b7ec05 48px 49px);mask-image:linear-gradient(transparent,#000 50%,transparent)}
.hero .eyebrow{font-size:10px;letter-spacing:.23em;color:#afc7ec}.hero .eyebrow>span{background:#ffd43b;box-shadow:0 0 0 4px #ffd43b16}
.hero h1{font-size:clamp(43px,5.5vw,80px);font-weight:600;letter-spacing:-.065em;line-height:1.05;color:#fff}.hero h1>span{color:#ffd43b}
.hero .hero-copy>p.hero-sub{color:#b5c8e5}.hero .hero-ctas{gap:12px}.hero .primary{background:#ffd43b;color:#112341;border:1px solid #ffe891;box-shadow:0 8px 28px #08132635}.hero .primary:hover{background:#ffe16b}
.hero .ghost-btn{background:#ffffff06;color:#dce9ff;border:1px solid #6c89b566}.hero .ghost-btn:hover{background:#ffffff10;border-color:#a7bfdf}
.hero .stage-word{color:#34659a24;letter-spacing:-.075em}.hero .orbit{border-color:#93bbed22}.hero .color-note{color:#c3d5ee}.hero .trust-row{color:#c7d8ef}.hero .trust-row li{border-color:#496589;background:#102341}
.section{padding-inline:5%}.block-head h2,.section-heading h2,.faq h2{letter-spacing:-.045em}.home-block .eyebrow{color:var(--orange-text);font-size:10px;letter-spacing:.17em}.block-head{border-bottom:1px solid var(--line);padding-bottom:23px;margin-bottom:26px}
.spool-filters label{font-size:11px;font-weight:600}.spool-filters select{border-radius:10px;border-color:var(--line);box-shadow:0 2px 8px #0b1d3705}
.spool-card{border-radius:20px;border-color:#d8e2f0;box-shadow:0 5px 20px #0b244709;transition:border-color .18s,box-shadow .18s}.spool-card:hover{border-color:#a5c0e6;box-shadow:0 10px 30px #173a6414}
.spool-card .card-media{background:#e8edf5}.spool-card .card-body{padding:19px}.spool-card .btn-add{border-color:#c3d2e7;color:#1c4b99;border-radius:12px;font-weight:700}.spool-card .btn-add:hover:not(:disabled){background:#1d55bc;color:#fff;border-color:#1d55bc}
.spool-open{color:#2157b2;box-shadow:0 3px 12px #102f5420}.spool-card .price{color:#162c4b}
.mat-tile,.color-tile{border-color:var(--line);border-radius:16px}.color-ribbon{background:#ffd43b;color:#122443;border-top:1px solid #ffe985;border-bottom:1px solid #e8bc26;font-size:15px;letter-spacing:.08em}
.steps3{counter-reset:sm-step}.steps3 li{border-top:3px solid #245edb;border-radius:0 0 14px 14px}.steps3 li:nth-child(2){border-top-color:#e1b523}.steps3 li:nth-child(3){border-top-color:#e24944}
.list-tools{top:88px}.filters-side{top:166px}.filters-side .fgroup legend{color:var(--ink)}.list-head h1{color:var(--ink)}
.site-footer{background:#0b172b;color:#b4c7e4;border-top:3px solid #2156b2}.site-footer .brand{color:#fff}.site-footer h3{color:#f0f5ff}.site-footer .legal{border-color:#2e4463;color:#93a9ca}.site-footer .theme-toggle{color:#d8e6fa;border-color:#3a5277}.site-footer .foot-brand>p{color:#a8bfdf}
@media(max-width:1150px){.site-header{padding-inline:3%;gap:16px}.site-header nav{gap:17px}.site-header .brand-name{display:none}.site-header .search{max-width:300px}}
@media(max-width:767px){.site-header{height:72px;padding-inline:16px;gap:12px}.site-header .brand-logo{width:50px;height:50px;border-radius:10px}.site-header .brand-name{display:block;font-size:11px}.site-header .bag{font-size:0;gap:7px}.site-header .search{max-width:none}.site-header.searching .search{top:12px;background:#182843}.hero{padding-top:38px}.hero h1{letter-spacing:-.055em}.list-tools{top:72px}.announce{font-size:9px;letter-spacing:.08em}.spool-card .card-body{padding:15px}.site-footer .brand-logo{width:66px;height:66px}}
@media(prefers-reduced-motion:reduce){.spool-card{transition:none}}

.brand .brand-lettering{display:block;width:134px;height:54px;object-fit:contain;flex:none}
@media(max-width:1150px) and (min-width:768px){.site-header .brand .brand-lettering{width:100px;height:44px}.site-header nav{gap:12px}}
@media(max-width:767px){.site-header .brand .brand-lettering{width:105px;height:42px}}
