:root { --ink:#29262d; --cream:#ffffff; --lav:#dff4ff; --peach:#ffc4d8; --sage:#d7f4ec; --butter:#fff1a6; --purple:#0879c9; --blue:#beeaff; --pink:#ffd8e8; --red:#ff6f89; --line:#d8edf7; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--cream); color:var(--ink); font:16px/1.6 'DM Sans',sans-serif; }
h1,h2 { margin:0; font-family:Fredoka,sans-serif; line-height:.98; letter-spacing:-.04em; } h1 { font-size:clamp(3.7rem,8vw,7.6rem); } h2 { font-size:clamp(2.8rem,5vw,5rem); } em { color:var(--purple); font-style:normal; }
.section-pad { max-width:1500px; margin:auto; padding:7.5rem max(6vw,2rem); }.site-header { height:84px; display:flex; align-items:center; justify-content:space-between; padding:0 max(6vw,2rem); position:relative; z-index:3; background:var(--cream); }.brand { display:flex; align-items:center; gap:.65rem; color:var(--ink); font:700 1.35rem Fredoka; text-decoration:none; }.brand-mark { display:grid; place-items:center; width:31px; height:31px; border-radius:50%; background:var(--peach); }.nav { display:flex; align-items:center; gap:2rem; font-size:.9rem; }.nav a,.text-link,.social-row a { color:inherit; text-decoration:none; }.nav-contact { padding:.7rem 1.1rem; border-radius:99px; background:var(--purple); color:#fff!important; }.menu-toggle { display:none; border:0; background:none; font-size:1.6rem; }
.hero { min-height:calc(100vh - 84px); display:grid; grid-template-columns:.9fr 1.1fr; gap:4rem; align-items:center; position:relative; background:radial-gradient(circle at 7% 8%,var(--butter) 0 8%,transparent 8.2%),radial-gradient(circle at 28% 88%,var(--sage) 0 13%,transparent 13.2%); }.hero-copy { padding:2rem 0; }.eyebrow { margin:0 0 1.3rem; color:var(--purple); font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }.lede { max-width:33rem; margin:2rem 0 2.2rem; font-size:1.08rem; }.button { display:inline-flex; align-items:center; gap:2rem; padding:1rem 1.35rem; border-radius:99px; background:var(--purple); color:#fff; box-shadow:5px 5px 0 var(--ink); font-weight:700; text-decoration:none; }.button span { font-size:1.25rem; }.hero-art { overflow:hidden; border-radius:2.5rem 2.5rem 7rem 2.5rem; transform:rotate(2deg); box-shadow:16px 16px 0 var(--pink); }.hero-art img { display:block; width:100%; aspect-ratio:1.25; object-fit:cover; }.hero-sticker { position:absolute; right:42%; bottom:11%; display:grid; place-items:center; width:105px; height:105px; border-radius:50%; background:var(--butter); box-shadow:4px 4px 0 var(--ink); font:600 1rem/1.05 Fredoka; text-align:center; transform:rotate(-12deg); }.hero-sticker span { position:absolute; top:8px; right:8px; }
.marquee { overflow:hidden; padding:1rem 0; background:var(--blue); color:var(--butter); font:600 1.2rem Fredoka; white-space:nowrap; }.marquee div { animation:slide 28s linear infinite; } @keyframes slide { to { transform:translateX(-30%); } }.world { display:grid; grid-template-columns:.7fr 1.3fr; gap:3rem; align-items:center; background:linear-gradient(135deg,var(--cream) 0 65%,var(--pink) 65%); }.section-heading>p:last-child,.collection-top>p,.about-card>p:not(.eyebrow),.find-copy>p { max-width:30rem; }.lineup { display:block; width:100%; border:7px solid var(--ink); border-radius:2rem; background:var(--lav); box-shadow:10px 10px 0 var(--peach); }.character-notes { grid-column:2; display:flex; gap:3rem; margin-top:-2rem; padding-left:2rem; }.character-notes div { display:flex; flex-direction:column; }.character-notes b { font:1.2rem Fredoka; }.character-notes span { color:#756c78; font-size:.8rem; }
.character-feature { grid-column:2; display:grid; grid-template-columns:130px 1fr; gap:1.25rem; align-items:center; margin-top:1.5rem; padding:1rem; border:1px solid var(--line); border-radius:1.25rem; background:#fff9; }.character-feature img { width:130px; height:165px; object-fit:cover; object-position:center top; border-radius:1rem; background:var(--blue); }.character-feature h3 { margin:.2rem 0 .45rem; font-size:1.45rem; }.character-feature p:last-child { margin:0; color:#756c78; font-size:.9rem; }
.collection { max-width:none; background:var(--butter); }.collection-top { display:flex; max-width:1380px; margin:auto; gap:4rem; align-items:end; justify-content:space-between; }.collection-top>p { margin:0; }.collection-board { display:block; width:min(1380px,100%); margin:4rem auto 2rem; border:7px solid var(--ink); border-radius:2rem; box-shadow:12px 12px 0 var(--blue); }.collection-tags { display:flex; flex-wrap:wrap; justify-content:center; gap:.7rem; }.collection-tags span { padding:.55rem 1rem; border:2px solid var(--ink); border-radius:99px; background:#fff; font-size:.8rem; font-weight:700; }
.about { display:grid; grid-template-columns:.9fr 1.1fr; gap:5rem; align-items:center; background:var(--pink); }.about-card { padding:3rem; border-radius:2rem; background:var(--cream); }.about-card>p:not(.eyebrow) { margin:2rem 0; font-size:1.05rem; }.about img { width:100%; border:6px solid var(--ink); border-radius:2rem 2rem 2rem 7rem; }.text-link { padding-bottom:.4rem; border-bottom:2px solid var(--peach); font-weight:700; }.find { display:grid; grid-template-columns:1fr 1fr; gap:5rem; max-width:none; background:var(--sage); }.find-copy { align-self:end; }.social-row { display:flex; flex-wrap:wrap; gap:1.3rem; margin-top:2rem; }.social-row a { border-bottom:2px solid var(--ink); font-weight:700; }.contact { display:flex; justify-content:space-between; max-width:none; position:relative; overflow:hidden; background:var(--purple); color:#fff; }.contact .eyebrow,.contact h2 em { color:var(--butter); }.contact-inner>p:not(.eyebrow) { max-width:32rem; margin:2rem 0; }.button-light { background:var(--butter); color:var(--ink); }.contact-doodle { margin:2rem 10% 0 0; color:var(--peach); font:6rem/1.2 Fredoka; opacity:.8; transform:rotate(10deg); }.footer { display:flex; justify-content:space-between; gap:1rem; padding:2rem max(6vw,2rem); color:#776d75; font-size:.76rem; }.footer a { color:inherit; }.footer span:nth-child(2) { text-align:center; }
@media(max-width:800px) { .site-header{height:72px}.menu-toggle{display:block}.nav{display:none;position:absolute;top:65px;left:1rem;right:1rem;flex-direction:column;align-items:stretch;padding:1.5rem;border:1px solid var(--line);border-radius:1rem;background:var(--cream);box-shadow:0 10px 30px #0001}.nav.open{display:flex}.hero,.world,.about,.find{grid-template-columns:1fr;gap:2.5rem}.hero{min-height:auto;padding-top:3.5rem}.hero-art{transform:none}.hero-sticker{right:7%;bottom:35%}.section-pad{padding:5rem 1.3rem}.world .lineup,.about img{order:2}.character-notes{grid-column:auto;margin:-1rem 0 0;padding:0}.character-feature{grid-column:auto;grid-template-columns:100px 1fr}.character-feature img{width:100px;height:135px}.collection-top{display:block}.collection-top>p{margin-top:2rem}.contact{display:block}.contact-doodle{position:absolute;top:2rem;right:1rem;margin:0;font-size:4rem}.footer{flex-direction:column;align-items:center}.footer span:nth-child(2){order:3}.lede{font-size:1rem} }

/* HelloLlamas candy palette: clean white, cherry red, and soft rainbow pastels. */
em,.eyebrow { color:var(--purple); }
.site-header { border-top:9px solid #e4f6ff; border-bottom:0; }
.brand-mark { background:var(--purple); color:#fff; }
.nav-contact,.button { background:var(--purple); color:#fff; }
.hero { background:linear-gradient(135deg,#e8f8ff 0%,var(--blue) 100%); }
.hero-art { box-shadow:16px 16px 0 #58bde5; }
.hero-sticker { background:#fff; color:var(--purple); box-shadow:4px 4px 0 var(--purple); }
.marquee { background:#43b2dc; color:#fff; }
.world { background:linear-gradient(135deg,#fff 0 62%,#e0f5ff 62%); }
.lineup { background:#e5f7ff; box-shadow:10px 10px 0 #61bfe4; }
.collection { background:#e9f8ff; }
.collection-board { box-shadow:12px 12px 0 #55b9df; }
.about { background:#f7fcff; }
.find { background:var(--blue); }
.contact { background:#48b3dc; color:#fff; }
.contact .eyebrow,.contact h2 em { color:#fff; }
.product-gallery { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.4rem; width:min(1380px,100%); margin:4rem auto 1.5rem; }
.product-gallery article { overflow:hidden; border:4px solid var(--ink); border-radius:1.5rem; background:#fff; box-shadow:7px 7px 0 #74c8e8; }
.product-gallery>a { color:inherit; text-decoration:none; }
.product-gallery>a:hover article { transform:translateY(-5px); }
.product-gallery article { height:100%; transition:transform .2s ease; }
.product-gallery article:nth-child(2n) { box-shadow-color:var(--butter); }
.product-gallery article:nth-child(3n) { box-shadow-color:#a4dff4; }
.product-gallery img { display:block; width:100%; aspect-ratio:1/1; object-fit:cover; }
.product-gallery h3 { margin:1rem 1rem .2rem; font:700 1.2rem Fredoka,sans-serif; }
.product-gallery p { margin:0 1rem 1.2rem; color:#746879; font-size:.86rem; line-height:1.4; }
.concept-note { margin:2rem auto 0; text-align:center; font-size:.78rem; font-weight:700; }
.product-list { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; width:min(1380px,100%); margin:3rem auto 0; }
.product-list>div { padding:1.5rem; border:3px solid var(--ink); border-radius:1.25rem; background:#fff; }
.product-list h3 { margin:0 0 .8rem; font:700 1.25rem Fredoka,sans-serif; color:var(--purple); }
.product-list ul { margin:0; padding-left:1.1rem; }
.product-list li { margin:.3rem 0; }
.catalog-cta { display:flex; justify-content:center; margin:2.5rem auto 0; }
@media(max-width:1050px) { .product-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:1050px) { .product-list { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:560px) { .product-gallery,.product-list { grid-template-columns:1fr; } }

/* Gentle brand motion */
.hero-art { animation:hero-arrive .8s cubic-bezier(.2,.8,.2,1) both; }
.hero-art img { animation:hero-breathe 7s ease-in-out infinite alternate; transform-origin:center; }
.hero-sticker { animation:sticker-float 3.6s ease-in-out infinite; }
.product-gallery article,.product-list>div { will-change:transform; }
.product-list>div:hover { transform:translateY(-4px); }
.reveal-ready { opacity:0; transform:translateY(24px); transition:opacity .7s ease,transform .7s ease; }
.reveal-ready.is-visible { opacity:1; transform:none; }
@keyframes hero-arrive { from { opacity:0; transform:translateY(24px) rotate(1deg); } to { opacity:1; transform:rotate(2deg); } }
@keyframes hero-breathe { from { transform:scale(1); } to { transform:scale(1.035); } }
@keyframes sticker-float { 0%,100% { transform:translateY(0) rotate(-12deg); } 50% { transform:translateY(-9px) rotate(-8deg); } }
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-art,.hero-art img,.hero-sticker{animation:none}.reveal-ready{opacity:1;transform:none;transition:none}}

/* Higgsfield motion hero with a still-image fallback. */
.hero-art video,.hero-art noscript img { display:block; width:100%; aspect-ratio:1.5; object-fit:cover; }
.hero-art video { animation:hero-breathe 7s ease-in-out infinite alternate; transform-origin:center; }
@media(prefers-reduced-motion:reduce){.hero-art video{animation:none}}

/* Collectible character-world direction: layered color, tactile cards, and a premium editorial finish. */
:root { --ink:#1e3150; --cream:#fffdfb; --purple:#176ec5; --blue:#a9ddf6; --lav:#dfe9ff; --peach:#ffc6d8; --sage:#ccefe2; --butter:#ffe889; --line:#cfe1f0; }
.site-header { border-bottom:1px solid #d9e8f1; box-shadow:0 4px 18px #176ec50d; }
.nav { gap:.35rem; }
.nav a { padding:.55rem .85rem; border-radius:99px; }
.nav a:hover { background:var(--lav); }
.hero { background:radial-gradient(circle at 7% 8%,var(--butter) 0 8%,transparent 8.2%),radial-gradient(circle at 28% 88%,var(--sage) 0 13%,transparent 13.2%),linear-gradient(135deg,#fff 0%,#e9f8ff 100%); }
.hero-art { border:8px solid #fff; box-shadow:16px 16px 0 #69c6e8,0 18px 45px #176ec529; }
.world { background:linear-gradient(135deg,#fff 0 62%,#e0f5ff 62%); }
.lineup { border-color:#fff; box-shadow:10px 10px 0 #61bfe4,0 16px 35px #176ec51a; }
.collection { background:linear-gradient(145deg,#fff7c9 0%,#e5f7ff 52%,#f5dded 100%); }
.collection-board { border-color:#fff; box-shadow:12px 12px 0 var(--purple),0 20px 40px #176ec52b; }
.collection-tags span:nth-child(3n){background:var(--peach)}
.collection-tags span:nth-child(3n+2){background:#a9e2d3}
.product-gallery article { border:3px solid var(--ink); box-shadow:7px 7px 0 #74c8e8,0 12px 28px #176ec514; }
.product-gallery article:nth-child(2n) { box-shadow:7px 7px 0 var(--peach),0 12px 28px #176ec514; }
.product-gallery article:nth-child(3n) { box-shadow:7px 7px 0 #a9e2d3,0 12px 28px #176ec514; }
