@charset "UTF-8";
/* Sculpted category objects share the painter mascot's blue/pink palette. */
.hero-split .category-cards { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:230px 218px; gap:18px; height:auto; padding:12px; }
.hero-split .category-card { --base-angle:0deg; position:relative; inset:auto; width:auto; height:auto; min-width:0; padding:22px; border:1px solid #fff; border-radius:30px; overflow:hidden; color:#29496d; box-shadow:inset 0 3px 7px #fff,0 12px 22px #538acb24; }
.category-card::after { content:""; position:absolute; width:96px; height:96px; right:-29px; top:-28px; border:1px solid #ffffffb3; border-radius:50%; box-shadow:0 0 0 13px #ffffff24; pointer-events:none; }
.hero-split .category-packaging { grid-column:1 / -1; background:linear-gradient(125deg,#f3fbff,#b7deff 75%,#97caff); }
.hero-split .category-branding { background:linear-gradient(135deg,#fff6fc,#ffcde5); }
.hero-split .category-event-materials { background:linear-gradient(135deg,#f5f2ff,#d8d5ff 74%,#c8dfff); }
.category-meta { color:#54789e; font-size:9px; font-weight:500; letter-spacing:.09em; position:relative; z-index:2; }
.category-copy { position:relative; z-index:2; margin-top:auto; }
.category-copy strong { font-size:27px; font-weight:650; letter-spacing:.02em; }
.category-copy p { margin:7px 0 0; font-size:13px; font-weight:400; color:#496581; white-space:nowrap; }
.category-arrow { position:absolute; right:18px; bottom:20px; width:29px; height:29px; display:grid; place-items:center; border:1px solid #fff; border-radius:50%; background:#ffffff85; font-size:20px; }
.category-object { display:block; position:relative; width:86px; height:86px; margin:9px 0 6px; pointer-events:none; filter:drop-shadow(0 10px 6px #637ca728); }
.category-packaging .category-object { position:absolute; right:42px; top:49px; transform:rotate(-10deg) scale(1.28); width:100px; height:100px; }
.object-box i { position:absolute; inset:31px 10px 4px; background:linear-gradient(120deg,#ffeaf6,#f6a7cc); border-radius:10px 10px 17px 17px; box-shadow:inset 3px 3px 5px #fff9,inset -6px -5px 8px #d76c9f40; }
.object-box b { position:absolute; top:23px; left:4px; width:92px; height:23px; border-radius:7px; background:linear-gradient(#fff2f9,#f4a6cd); box-shadow:inset 0 2px 3px #fff,0 4px 4px #b45c8e22; }
.object-box em { position:absolute; width:16px; height:72px; top:24px; left:42px; border-radius:3px; background:linear-gradient(90deg,#89b6ed,#d5eaff 50%,#8bb4ed); }
.object-box em::before,.object-box em::after { content:""; position:absolute; width:28px; height:22px; top:-19px; border:7px solid #b1d2fb; box-shadow:inset 1px 1px 2px #fff,1px 1px 2px #7d97be55; border-radius:55% 55% 8px 55%; transform:rotate(20deg); right:5px; }
.object-box em::after { transform:scaleX(-1) rotate(20deg); right:auto; left:5px; }
.object-brand i { position:absolute; width:61px; height:61px; left:1px; top:9px; border:17px solid #8fc3f6; border-radius:50%; box-shadow:inset 2px 3px 5px #497fbd55,3px 5px 7px #638ec740; background:#ffeff8; }
.object-brand b { position:absolute; width:35px; height:35px; right:0; top:2px; border-radius:11px; transform:rotate(22deg); background:linear-gradient(135deg,#fff,#d9a7ed); box-shadow:inset 1px 2px 4px #fff,3px 5px 7px #89729d40; }
.object-brand em { position:absolute; width:18px; height:18px; right:6px; bottom:3px; border-radius:50%; background:radial-gradient(at 30% 25%,#fff,#f6b4d6 65%,#df89b5); }
.object-star i { position:absolute; width:76px; height:76px; top:0; left:0; background:linear-gradient(135deg,#fff6c4,#ffd177 65%,#f3ad61); clip-path:polygon(50% 0,65% 31%,100% 37%,75% 63%,80% 100%,50% 83%,18% 100%,24% 63%,0 37%,35% 31%); transform:rotate(-12deg); }
.object-star b,.object-star em { position:absolute; width:12px; height:12px; right:1px; bottom:4px; border-radius:50%; background:radial-gradient(at 30% 25%,#fff,#f4aad1); }
.object-star em { width:8px; height:8px; top:5px; right:0; background:#fff; }
.category-card:focus-visible { outline:3px solid #3676b7; outline-offset:5px; }
.category-projects { text-align:center; margin-top:35px; padding:55px 20px; border:1px solid #fff; border-radius:32px; background:linear-gradient(120deg,#e4f4ff,#ffe4f2); box-shadow:inset 0 3px 8px #fff,0 18px 35px #649acb20; }
.category-projects-label { font-size:11px; letter-spacing:.14em; color:#54789e; }
.category-projects h2 { margin:18px 0 12px; font-size:clamp(24px,4vw,38px); }
.category-projects p { margin:0 0 18px; color:#496581; font-size:15px; }
.category-pending { display:inline-block; background:#fff9; border-radius:24px; padding:9px 17px; font-size:12px; color:#54789e; }
.category-detail-preview { margin-bottom:70px; }
.category-detail-preview > summary { cursor:pointer; width:min(1100px,calc(100% - 48px)); margin:0 auto 30px; padding:22px 0; border-block:1px solid #9abbdf66; color:#496581; list-style:none; font-size:14px; }
.category-detail-preview > summary span { float:right; }
@media(min-width:761px) and (max-width:1100px) {
 .hero-split .category-cards { grid-template-rows:200px 200px; gap:12px; padding:5px; }
 .hero-split .category-card { padding:17px; border-radius:24px; }
 .category-copy strong { font-size:22px; }
 .category-copy p { font-size:11px; }
 .category-packaging .category-object { right:22px; top:38px; transform:rotate(-10deg) scale(.95); }
 .category-arrow { right:12px; bottom:16px; width:24px; height:24px; font-size:17px; }
}
@media(max-width:760px) {
 .hero-split .category-cards { grid-template-rows:174px 190px; gap:12px; height:auto; padding:4px; }
 .hero-split .category-card { padding:17px 14px; border-radius:24px; }
 .category-meta { font-size:7px; letter-spacing:.04em; }
 .category-copy strong { font-size:22px; }
 .category-copy p { font-size:10px; margin-top:6px; }
 .category-object { transform:scale(.82); transform-origin:left top; height:78px; margin-top:10px; }
 .category-packaging .category-object { right:12px; top:31px; transform:rotate(-10deg) scale(.88); }
 .category-packaging .category-copy { max-width:65%; }
 .category-arrow { right:10px; bottom:15px; width:23px; height:23px; font-size:16px; }
 .category-projects { padding:40px 16px; }
}
@media(prefers-reduced-motion:reduce) { .hero-split .category-card { transition:none; } }
