/*
Theme Name: YoungCraze v2
Theme URI: https://youngcraze.com
Author: YoungCraze Editors
Description: Occasion-led fashion aggregator theme. Dress for the occasion, not the invite.
Version: 2.0.0
Requires PHP: 8.1
Text Domain: youngcraze-v2
*/
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/Inter-400.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/Inter-500.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/Inter-600.woff2) format('woff2')}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/SpaceGrotesk-500.woff2) format('woff2')}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/SpaceGrotesk-700.woff2) format('woff2')}

:root{--ink:#17151c;--plum:#6b3fa0;--coral:#d6336c;--orange:#ff8a5c;--lav:#f5f0fa;--line:#e8e6ee;--text:#3d3a47;--muted:#4a4755;--soft:#f6f5f8;--max:1360px;--head:'Space Grotesk',sans-serif;--body:Inter,system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}
ul{list-style:none;margin:0;padding:0}
h1,h2,h3{font-family:var(--head);font-weight:700;line-height:1.15;margin:0 0 .5em;letter-spacing:-.02em}
h1{font-size:clamp(34px,5vw,56px)}h2{font-size:clamp(26px,3vw,34px)}h3{font-size:20px}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.wrap{max-width:var(--max);margin:0 auto;padding:0 32px}
@media(max-width:600px){.wrap{padding:0 18px}}
.disc-bar{background:var(--ink);color:#fff;font-size:13px;padding:10px 32px;text-align:center;line-height:1.5}.disc-bar a{text-decoration:underline}
.site-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:20px 0;border-bottom:1px solid var(--line)}
.logo{font-family:var(--head);font-weight:700;font-size:28px;letter-spacing:-.5px}.logo span{color:var(--coral)}
.nav-main{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:15px;font-weight:500}.nav-main a{display:inline-block;padding:8px 0}
.nav-main .current-menu-item a,.nav-main a[aria-current]{border-bottom:2px solid var(--coral)}
.search{display:flex;gap:8px}.search input{height:44px;border:1px solid #cfccd8;border-radius:22px;padding:0 18px;font:inherit;font-size:14px;width:240px;max-width:100%}
.hero{display:flex;flex-wrap:wrap;gap:40px;align-items:center;padding:64px 0 56px;background:var(--lav)}
.hero>div{flex:1 1 480px;min-width:0}.kicker{margin:0 0 14px;font-size:13px;font-weight:600;letter-spacing:1.2px;text-transform:uppercase;color:var(--plum)}
.lead{font-size:18px;line-height:1.55;max-width:560px;color:var(--text)}
.chips{display:flex;flex-wrap:wrap;gap:10px}.chip{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border:1.5px solid var(--ink);border-radius:24px;font-size:15px;font-weight:500;background:#fff}.chip:hover,.chip.on{background:var(--ink);color:#fff;text-decoration:none}
.hero-art{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.hero-art div{aspect-ratio:3/4;border-radius:16px;overflow:hidden}.hero-art img{width:100%;height:100%;object-fit:cover}.hero-art div:nth-child(2){margin-top:32px}
.sec{padding:48px 0 16px}.sec-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:24px}.sec-head a{font-weight:600;font-size:15px;text-decoration:underline}
.grid{display:grid;gap:20px}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1000px){.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.g4,.g3{grid-template-columns:1fr}}
.card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}.card:hover{box-shadow:0 8px 24px rgba(23,21,28,.12);text-decoration:none}
.card .img{aspect-ratio:4/5;background:#f1eef6;display:flex;align-items:center;justify-content:center;font-size:12px;color:#6a6677;text-align:center;padding:12px;overflow:hidden}.card .img img{width:100%;height:100%;object-fit:cover}
.hub-card .img{aspect-ratio:auto;height:160px}
.card .body{padding:16px;display:flex;flex-direction:column;gap:6px;flex:1}
.shop{font-size:12px;font-weight:600;letter-spacing:.6px;text-transform:uppercase;color:var(--plum)}
.pname{font-weight:600;font-size:16px;line-height:1.35}.note{font-size:14px;line-height:1.45;color:var(--muted);flex:1}.price{font-size:12px;color:#5d596a}
.btn{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 24px;border-radius:22px;background:var(--coral);color:#fff;font-weight:600;font-size:15px;border:0;font-family:inherit;cursor:pointer}.btn:hover{text-decoration:none;background:#b8285a}
.btn-orange{background:var(--orange);color:var(--ink)}.btn-orange:hover{background:#ff7a44}
.band{margin:48px 0;padding:40px;border-radius:20px;background:var(--ink);color:#fff;display:flex;flex-wrap:wrap;gap:32px;align-items:center}.band>div{flex:1 1 380px;min-width:0}.band p{color:#d9d6e2;max-width:520px;margin:0}
.band .fake{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.band .fake span{flex:1 1 140px;min-height:44px;border-radius:8px;background:#2a2733;display:flex;align-items:center;padding:0 14px;font-size:14px;color:#cfccd8}
.guide{display:flex;flex-direction:column;gap:12px}.guide .thumb{aspect-ratio:16/10;border-radius:14px;background:var(--lav);overflow:hidden}.guide .thumb img{width:100%;height:100%;object-fit:cover}.guide h3{font-size:22px;line-height:1.25;margin:0}.byline{font-size:14px;color:var(--muted)}
.site-foot{background:var(--soft);padding:40px 0;border-top:1px solid var(--line);margin-top:48px}.foot-row{display:flex;flex-wrap:wrap;gap:32px;justify-content:space-between}.foot-row>div{flex:1 1 320px;max-width:520px}.foot-row p{margin:0;font-size:14px;line-height:1.6;color:var(--muted)}
.nav-legal{display:flex;flex-wrap:wrap;gap:10px 24px;font-size:14px;align-content:flex-start;flex:1 1 320px;justify-content:flex-end}
.crumbs{padding:20px 0 0;font-size:13px;color:var(--muted)}
.filters{display:flex;flex-wrap:wrap;gap:20px;padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:#faf9fc;align-items:flex-end;margin:0 0 24px}.filters>div{display:flex;flex-direction:column;gap:6px;flex:1 1 180px;min-width:0}.filters label{font-size:12px;font-weight:600;letter-spacing:.6px;text-transform:uppercase;color:var(--muted)}.filters select{height:44px;border:1px solid #cfccd8;border-radius:8px;padding:0 12px;font:inherit;font-size:14px;background:#fff}.filters .count{font-size:13px;color:var(--muted);padding-bottom:12px}
.hub{display:flex;flex-wrap:wrap;gap:32px;padding:8px 0 32px}.hub-main{flex:999 1 640px;min-width:0}.hub-side{flex:1 1 280px;min-width:0;max-width:380px}
.panel{border:1px solid var(--line);border-radius:14px;padding:24px;background:var(--lav)}.panel ul{padding-left:20px;list-style:disc;font-size:14px;line-height:1.7;color:var(--text)}
.article{max-width:760px;margin:0 auto;padding:40px 0 56px}.article .content{font-size:17px;line-height:1.75}.article .content h2{margin-top:1.6em}.article .content img{border-radius:14px}.article .content table{border-collapse:collapse;width:100%;font-size:15px}.article .content th,.article .content td{padding:12px;border:1px solid var(--line);text-align:left}.article .content th{background:var(--lav)}
.notice{padding:14px 18px;border-left:4px solid var(--ink);background:var(--soft);font-size:14px;line-height:1.6;margin:0 0 12px}.notice.ai{border-color:#888}.notice p{margin:0}
.pick{display:flex;flex-wrap:wrap;gap:16px;border:1px solid var(--line);border-radius:14px;padding:14px;align-items:center;margin:0 0 16px}.pick .img{flex:0 0 120px;aspect-ratio:4/5;background:#f1eef6;border-radius:10px;overflow:hidden}.pick .img img{width:100%;height:100%;object-fit:cover}.pick .body{flex:1 1 240px;min-width:0;display:flex;flex-direction:column;gap:6px}
.cta{margin-top:40px;padding:24px;border-radius:14px;background:var(--ink);color:#fff}.cta a{font-weight:600;text-decoration:underline;color:var(--orange)}
.decoder{max-width:900px;margin:0 auto;padding:48px 0 24px}.dec-row{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:28px}.dec-row>div{flex:1 1 220px;min-width:0}.dec-row .lbl{font-size:12px;font-weight:600;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.dec-out{border:1px solid var(--line);border-radius:16px;padding:28px;background:var(--lav)}.dec-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}@media(max-width:560px){.dec-grid{grid-template-columns:1fr}}.dec-grid b{display:block;margin-bottom:4px}.dec-grid div div{font-size:15px;line-height:1.55;color:var(--text)}
.pagination{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}.pagination .page-numbers{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--line);border-radius:22px}.pagination .current{background:var(--ink);color:#fff}
.wp-block-image img,.aligncenter{margin:0 auto}
/* fixes 2026-11-07 */
.sec.wrap{padding-left:32px;padding-right:32px}@media(max-width:600px){.sec.wrap{padding-left:18px;padding-right:18px}}
.hero .wrap>div{flex:1 1 480px;min-width:0}.hero .wrap>.hero-art{flex:1 1 360px}
.guide .thumb{aspect-ratio:1.91/1}
.site-head{row-gap:10px}.search{flex:1 1 100%;max-width:320px}

/* mobile nav + perf 2026-11-07 */
.nav-toggle{display:none;min-height:44px;min-width:44px;padding:0 14px;border:1.5px solid var(--ink);border-radius:22px;background:#fff;font:inherit;font-weight:600;cursor:pointer}
@media(max-width:900px){.nav-toggle{display:inline-flex;align-items:center;gap:8px}.site-head{position:relative}.site-head nav{display:none;flex:1 1 100%}.site-head.open nav{display:block}.nav-main{flex-direction:column;gap:0}.nav-main a{display:block;padding:12px 0;border-bottom:1px solid var(--line)}.search{flex:1 1 100%;max-width:none}.search input{width:100%}.hero{padding:40px 0 36px}.band{padding:28px}.article{padding-top:24px}}
img{content-visibility:auto}
