/* Toolkit page — page-specific styles (shared base in shared.css) */

:root{--container-max:1100px}

.section-subtitle{font-size:1.1rem;color:var(--text-secondary);max-width:650px;line-height:1.7;font-weight:300}

/* Page-specific button variant */
.btn-dark{background:var(--purple-primary);color:var(--white)}
.btn-dark:hover{background:var(--purple-mid);transform:translateY(-2px)}

/* HERO */
.toolkit-hero{background-color:var(--purple-deep);padding:140px 0 100px;min-height:520px;text-align:center;position:relative;overflow:hidden}
.toolkit-hero::before{content:'';position:absolute;top:0;left:0;width:50%;height:100%;background:linear-gradient(160deg,rgba(26,5,48,.72) 0%,rgba(77,25,121,.55) 55%,rgba(26,5,48,.85) 100%),url('../images/tomi-with-bags.JPG') center 28%/cover no-repeat;z-index:1}
.toolkit-hero::after{content:'';position:absolute;top:0;right:0;width:50%;height:100%;background:linear-gradient(200deg,rgba(26,5,48,.72) 0%,rgba(77,25,121,.55) 55%,rgba(26,5,48,.85) 100%),url('../images/tomi-come-oon.JPG') center/cover no-repeat;z-index:1}
.toolkit-hero>*{position:relative;z-index:2}
.toolkit-hero *{position:relative;z-index:2}
@media(max-width:900px){.toolkit-hero{min-height:600px;padding:120px 0 80px}.toolkit-hero::before{width:100%;height:50%;top:0;left:0;background:linear-gradient(180deg,rgba(26,5,48,.72) 0%,rgba(77,25,121,.5) 50%,rgba(26,5,48,.9) 100%),url('../images/tomi-with-bags.JPG') center 25%/cover no-repeat}.toolkit-hero::after{width:100%;height:50%;top:50%;right:0;background:linear-gradient(0deg,rgba(26,5,48,.72) 0%,rgba(77,25,121,.5) 50%,rgba(26,5,48,.9) 100%),url('../images/tomi-come-oon.JPG') center/cover no-repeat}}
@media(max-width:640px){.toolkit-hero{min-height:540px;padding:100px 0 60px}}
.toolkit-hero h1{font-family:var(--font-display);font-size:clamp(3rem,8vw,6rem);color:var(--white);line-height:.95;margin-bottom:20px;opacity:0;transform:translateY(30px);animation:fadeUp .8s var(--ease-out) .3s forwards}
.toolkit-hero h1 .accent{display:block;font-family:var(--font-heading);font-style:italic;font-size:.4em;color:var(--gold);line-height:1.4}
.toolkit-hero>div>p{color:rgba(255,255,255,.75);font-size:1.15rem;max-width:600px;margin:0 auto;font-weight:300;opacity:0;animation:fadeUp .8s var(--ease-out) .5s forwards}

/* DISCLAIMER */
.disclaimer{background:var(--bg-alt);padding:16px 0;text-align:center;font-size:.8rem;color:var(--text-secondary);border-bottom:1px solid var(--gray-200)}
[data-theme="dark"] .disclaimer{border-color:rgba(255,255,255,.06)}

/* CATEGORY HEADER */
.cat-header{display:flex;align-items:center;gap:14px;margin-bottom:32px}
.cat-icon{width:52px;height:52px;border-radius:16px;background:var(--purple-wash);display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0}
[data-theme="dark"] .cat-icon{background:rgba(168,85,247,.15)}
.cat-header h2{font-family:var(--font-display);font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:.04em}
.cat-header p{font-size:.9rem;color:var(--text-secondary)}

/* PRODUCT GRID */
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin-bottom:28px}

/* PRODUCT CARD */
.product-card{background:var(--bg);border:1px solid var(--gray-200);border-radius:20px;padding:28px;transition:all .4s var(--ease-spring);position:relative;overflow:hidden}
[data-theme="dark"] .product-card{border-color:rgba(255,255,255,.08)}
.product-card:hover{transform:translateY(-4px);box-shadow:0 16px 48px rgba(77,25,121,.08)}
.product-image{margin:-28px -28px 18px;aspect-ratio:4/3;overflow:hidden;background:var(--bg-alt)}
[data-theme="dark"] .product-image{background:rgba(255,255,255,.04)}
.product-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease-spring)}
.product-card:hover .product-image img{transform:scale(1.04)}
.product-card:has(.product-image) .product-emoji{display:none}
.product-card.tomi-pick{border-color:var(--gold)}
.product-card.tomi-pick::after{content:"TOMI'S PICK";position:absolute;top:14px;right:14px;background:var(--gold);color:var(--purple-deep);font-size:.6rem;font-weight:700;letter-spacing:.1em;padding:3px 10px;border-radius:50px}
.product-emoji{font-size:2.2rem;margin-bottom:14px}
.product-card h3{font-family:var(--font-body);font-size:1.05rem;font-weight:700;margin-bottom:4px}
.product-brand{font-size:.8rem;color:var(--gold);font-weight:600;text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px}
.product-card>p{font-size:.9rem;color:var(--text-secondary);line-height:1.5;margin-bottom:16px}
.product-why{display:flex;align-items:flex-start;gap:8px;padding:12px;background:var(--bg-alt);border-radius:12px;font-size:.85rem;color:var(--text-secondary);line-height:1.5}
[data-theme="dark"] .product-why{background:rgba(255,255,255,.04)}
.product-why .quote-icon{color:var(--gold);font-size:1rem;flex-shrink:0;margin-top:2px}

/* SECTION DIVIDER */
.section-divider{border:none;border-top:1px solid var(--gray-200);margin:0}
[data-theme="dark"] .section-divider{border-color:rgba(255,255,255,.06)}

/* APP CARD variant */
.app-badge{display:inline-block;padding:3px 10px;border-radius:50px;font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px}
.badge-free{background:rgba(0,128,0,.08);color:#006400}
.badge-paid{background:rgba(200,169,81,.1);color:var(--gold-dark)}
.badge-freemium{background:rgba(77,25,121,.08);color:var(--purple-primary)}
[data-theme="dark"] .badge-free{background:rgba(0,128,0,.15);color:#44BB44}
[data-theme="dark"] .badge-paid{background:rgba(200,169,81,.15);color:var(--gold)}
[data-theme="dark"] .badge-freemium{background:rgba(168,85,247,.15);color:var(--purple-light)}

/* CTA */
.toolkit-cta{background:var(--purple-deep);color:var(--white);text-align:center}
.toolkit-cta-buttons{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:28px}

/* FOOTER */
.footer{background:var(--black);color:rgba(255,255,255,.7);padding:60px 0 30px}
.footer .container{max-width:1280px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px}
.footer-brand img{height:60px;margin-bottom:16px}.footer-brand p{font-size:.9rem;line-height:1.6;max-width:300px}
.footer-col h4{color:var(--white);font-weight:700;font-size:.85rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:16px}
.footer-col a{display:block;font-size:.9rem;padding:4px 0;transition:color .3s}.footer-col a:hover{color:var(--gold)}
.footer-social{display:flex;gap:12px;margin-top:16px}.footer-social a{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;transition:all .3s}.footer-social a:hover{background:var(--gold);color:var(--purple-deep)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding-top:24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;font-size:.8rem}.footer-legal{display:flex;gap:20px}.footer-legal a:hover{color:var(--gold)}

@media(max-width:1024px){.nav-links{display:none}.hamburger{display:flex}.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.product-grid{grid-template-columns:1fr}.toolkit-cta-buttons{flex-direction:column}.toolkit-cta-buttons .btn{width:100%;justify-content:center}.footer-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column;text-align:center}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
