/* 3Grafik Design System 2026 — colors sampled from supplied palette.
   Ink #151515 | Hot pink #FE87BD | Blush #FDC1DD
   Aqua #71EDEB | Butter #FEEDA8 | Lilac #CCBFF7
   White #FFFFFF used as a neutral for legibility. */
:root {
  --tg-ink:#151515;
  --tg-pink:#FE87BD;
  --tg-blush:#FDC1DD;
  --tg-aqua:#71EDEB;
  --tg-butter:#FEEDA8;
  --tg-lilac:#CCBFF7;
  --tg-white:#FFFFFF;
  --tg-soft:#FFF9FC;
}
/* Home backdrop, editorial text and hero */
body.home { background:var(--tg-white); }
body.home .tg-hero { background:var(--tg-soft) !important; }
body.home .tg-hero h1,
body.home .tg-hero h2,
body.home .tg-hero__headline { color:var(--tg-ink) !important; }
body.home .tg-hero__eyebrow { color:#9A3968 !important; }
body.home .tg-hero__search,
body.home .tg-hero__search input { background:var(--tg-white) !important; }
body.home .tg-hero__search:focus-within { border-color:var(--tg-pink) !important; box-shadow:0 0 0 3px rgba(254,135,189,.20) !important; }
/* Header and megamenu — scoped, do not change Puca or account screens */
.tg-sh { background:var(--tg-soft) !important; color:var(--tg-ink) !important; }
.tg-sh__announcement { color:#794B96 !important; }
.tg-sh__main { color:var(--tg-ink); }
.tg-sh__search,
.tg-sh__search input,
.tg-sh__search input[type="search"] { background:var(--tg-white) !important; }
.tg-sh__search { border-color:var(--tg-blush) !important; }
.tg-sh__search:focus-within { border-color:var(--tg-pink) !important; box-shadow:0 0 0 3px rgba(254,135,189,.18) !important; }
.tg-sh__search button,
.tg-sh__search button[type="submit"] { background:var(--tg-pink) !important; color:var(--tg-ink) !important; border-color:var(--tg-pink) !important; }
.tg-sh__search button:hover,
.tg-sh__search button[type="submit"]:hover { background:var(--tg-blush) !important; }
.tg-sh__count { background:var(--tg-blush) !important; color:var(--tg-ink) !important; }
.tg-sh a:focus-visible, .tg-sh button:focus-visible { outline:2px solid #9A3968;outline-offset:3px; }
/* Preserve menu layout and hover behavior; change colors only. */
.tg-sh__nav { border-color:var(--tg-blush) !important; }
.tg-sh__nav a:hover,
.tg-sh__nav a:focus-visible,
.tg-sh__nav summary:hover { color:#9A3968 !important; }
.tg-sh__nav [aria-expanded="true"],
.tg-sh__nav .is-active { color:#9A3968 !important; }
/* Match common mega-menu panel conventions without touching other theme menus. */
.tg-sh__nav [class*="mega"] a:hover,
.tg-sh__nav [class*="mega"] a:focus-visible { background:rgba(253,193,221,.28); }
.tg-sh__nav [class*="mega"] h3,
.tg-sh__nav [class*="mega"] h4 { color:#794B96 !important; }
/* 3Grafik sections: restrained accents and clear product cards. */
body.home [class^="tg-"] a:focus-visible,
body.home [class*=" tg-"] a:focus-visible { outline:2px solid #9A3968; outline-offset:3px; }
body.home [class^="tg-"] .button:not(.alt):hover,
body.home [class*=" tg-"] .button:not(.alt):hover { border-color:var(--tg-pink); }
@media (prefers-reduced-motion:reduce) {
  .tg-sh *, body.home .tg-hero * { transition-duration:.01ms !important; }
}