
:root{--cc-bg:#061014;--cc-panel:#0b181e;--cc-panel-2:#102129;--cc-line:rgba(255,255,255,.11);--cc-text:#f4f8fa;--cc-muted:#a9bbc4;--cc-accent:#d5ae62;--cc-max:1180px}
body.clean-commerce-page{background:var(--cc-bg);color:var(--cc-text)}
.clean-commerce-page main{overflow:hidden}
.cc-container{width:min(var(--cc-max),calc(100% - 36px));margin-inline:auto}
.cc-eyebrow{font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:var(--cc-accent);margin:0 0 12px}
.cc-hero{padding:92px 0 72px;background:radial-gradient(circle at 80% 10%,rgba(213,174,98,.13),transparent 32%),linear-gradient(180deg,#071318 0%,#061014 100%)}
.cc-hero__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:52px;align-items:center}
.cc-hero h1{font-size:clamp(2.5rem,6vw,5rem);line-height:.96;letter-spacing:-.045em;margin:0 0 20px;max-width:850px}
.cc-hero p{font-size:clamp(1rem,2vw,1.2rem);line-height:1.7;color:var(--cc-muted);max-width:720px}
.cc-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.cc-button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border-radius:10px;text-decoration:none;font-weight:800;border:1px solid var(--cc-line)}
.cc-button--primary{background:var(--cc-text);color:#061014}
.cc-button--secondary{color:var(--cc-text);background:rgba(255,255,255,.035)}
.cc-card{border:1px solid var(--cc-line);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));overflow:hidden}
.cc-card__body{padding:24px}
.cc-card h2,.cc-card h3{margin:0 0 10px}
.cc-card p{color:var(--cc-muted);line-height:1.6}
.cc-hero-card{padding:28px}
.cc-hero-card img{display:block;width:100%;height:auto;max-height:430px;object-fit:contain;border-radius:14px;background:#fff}
.cc-section{padding:72px 0}
.cc-section--alt{background:#08151b;border-block:1px solid var(--cc-line)}
.cc-section__head{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:28px}
.cc-section__head h2{font-size:clamp(2rem,4vw,3.3rem);line-height:1.02;letter-spacing:-.035em;margin:0}
.cc-section__head p{max-width:650px;color:var(--cc-muted);line-height:1.6;margin:0}
.cc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.cc-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cc-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.cc-link-card{display:block;padding:26px;border:1px solid var(--cc-line);border-radius:16px;background:var(--cc-panel);text-decoration:none;color:var(--cc-text);transition:.18s ease}
.cc-link-card:hover{transform:translateY(-2px);border-color:rgba(213,174,98,.55)}
.cc-link-card small{display:block;color:var(--cc-accent);font-weight:800;letter-spacing:.1em;text-transform:uppercase;margin-bottom:10px}
.cc-link-card strong{display:block;font-size:1.25rem;margin-bottom:8px}
.cc-link-card span{display:block;color:var(--cc-muted);line-height:1.55}
.cc-brand-feature{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:stretch}
.cc-brand-feature__media{min-height:360px;background:#0d1920 center/cover no-repeat;border-radius:18px;border:1px solid var(--cc-line)}
.cc-brand-feature__copy{padding:38px;border:1px solid var(--cc-line);border-radius:18px;background:var(--cc-panel)}
.cc-brand-feature__copy h2{font-size:clamp(2.1rem,4vw,3.6rem);margin:0 0 14px}
.cc-brand-feature__copy p{color:var(--cc-muted);line-height:1.7}
.cc-kicker{display:inline-flex;gap:8px;align-items:center;font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#d9e8ee;border:1px solid var(--cc-line);border-radius:999px;padding:7px 11px;margin-bottom:15px}
.cc-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.cc-product{border:1px solid var(--cc-line);border-radius:16px;background:var(--cc-panel);padding:18px}
.cc-product img{width:100%;aspect-ratio:1/1;object-fit:contain;background:#fff;border-radius:12px;margin-bottom:16px}
.cc-product h3{font-size:1.1rem;margin:0 0 8px}
.cc-product p{color:var(--cc-muted);line-height:1.5;margin:0 0 14px}
.cc-note{padding:18px 20px;border-left:3px solid var(--cc-accent);background:rgba(213,174,98,.08);color:#dce7eb;border-radius:0 10px 10px 0}
.cc-commercial-band{padding:38px;border:1px solid var(--cc-line);border-radius:20px;background:linear-gradient(115deg,rgba(213,174,98,.12),rgba(255,255,255,.035))}
.cc-commercial-band h2{font-size:clamp(2rem,4vw,3.2rem);margin:0 0 12px}
.cc-commercial-band p{color:var(--cc-muted);line-height:1.65;max-width:820px}
.cc-footer-links{display:flex;flex-wrap:wrap;gap:16px}

.cc-hero-mosaic{display:grid;grid-template-columns:1.35fr .65fr;grid-template-rows:1fr 1fr auto;gap:12px;min-height:500px}
.cc-hero-media{display:block;overflow:hidden;border:1px solid var(--cc-line);border-radius:18px;background:#0b181e}
.cc-hero-media--primary{grid-row:1 / span 2}
.cc-hero-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .25s ease}
.cc-hero-media:hover img{transform:scale(1.025)}
.cc-hero-store-badge{grid-column:1 / -1;display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;padding:16px 18px;border:1px solid var(--cc-line);border-radius:14px;background:rgba(6,16,20,.92);backdrop-filter:blur(10px)}
.cc-hero-store-badge span{font-size:.72rem;letter-spacing:.12em;color:var(--cc-accent);font-weight:900}
.cc-hero-store-badge strong{font-size:.95rem}
.cc-hero-store-badge a{color:var(--cc-text);font-weight:800;text-decoration:none}
.cc-visual-grid{display:grid;gap:18px}
.cc-visual-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.cc-visual-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.cc-shop-card{display:block;overflow:hidden;border:1px solid var(--cc-line);border-radius:18px;background:var(--cc-panel);color:var(--cc-text);text-decoration:none;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.cc-shop-card:hover{transform:translateY(-3px);border-color:rgba(213,174,98,.55);box-shadow:0 18px 44px rgba(0,0,0,.24)}
.cc-shop-card>img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:#fff}
.cc-shop-card>div{padding:20px}
.cc-shop-card small{display:block;color:var(--cc-accent);font-weight:900;letter-spacing:.1em;text-transform:uppercase;margin-bottom:9px}
.cc-shop-card strong{display:block;font-size:1.22rem;line-height:1.15;margin-bottom:8px}
.cc-shop-card span{display:block;color:var(--cc-muted);line-height:1.5}
.cc-shop-card--compact>img{aspect-ratio:16/10}
.cc-shop-card--compact>div{padding:17px}
.cc-shop-card--feature{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(0,1.2fr);align-items:center;min-height:300px}
.cc-shop-card--feature>img{height:100%;aspect-ratio:auto;object-fit:contain;padding:18px;background:#f7f8f8}
.cc-shop-card--feature>div{padding:30px}
.cc-shop-card--feature strong{font-size:clamp(1.45rem,3vw,2rem)}
.cc-brand-feature__media{overflow:hidden;background:#0d1920}
.cc-brand-feature__media img{display:block;width:100%;height:100%;min-height:360px;object-fit:cover}
.cc-commercial-showcase{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:stretch}
.cc-commercial-showcase__media{overflow:hidden;border:1px solid var(--cc-line);border-radius:20px;min-height:360px}
.cc-commercial-showcase__media img{display:block;width:100%;height:100%;object-fit:cover}

.cc-brand-links{padding-top:18px}
@media(max-width:900px){.cc-hero__grid,.cc-brand-feature,.cc-commercial-showcase{grid-template-columns:1fr}.cc-grid,.cc-grid--3,.cc-visual-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}.cc-product-grid{grid-template-columns:1fr}.cc-section__head{display:block}.cc-section__head p{margin-top:12px}.cc-hero-mosaic{min-height:440px}}
@media(max-width:600px){.cc-container{width:min(100% - 24px,var(--cc-max))}.cc-hero{padding:58px 0 48px}.cc-section{padding:52px 0}.cc-grid,.cc-grid--2,.cc-grid--3,.cc-visual-grid--2,.cc-visual-grid--4{grid-template-columns:1fr}.cc-hero-card,.cc-brand-feature__copy,.cc-commercial-band{padding:24px}.cc-actions{display:grid}.cc-button{width:100%}.cc-hero-mosaic{grid-template-columns:1fr;grid-template-rows:auto;min-height:0}.cc-hero-media--primary{grid-row:auto}.cc-hero-media{min-height:210px}.cc-hero-store-badge{grid-column:auto;grid-template-columns:1fr}.cc-shop-card--feature{grid-template-columns:1fr}.cc-shop-card--feature>img{height:260px}.cc-commercial-showcase__media{min-height:260px}}
