/* [next]/internal/font/google/outfit_1369170f.module.css [app-client] (css) */
@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/b2ea385cb5ae8625-s.p.1spbknb88wd48.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/1b99372b3eaef0c8-s.p.1gsd1jahc5dg_.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../media/b2ea385cb5ae8625-s.p.1spbknb88wd48.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../media/1b99372b3eaef0c8-s.p.1gsd1jahc5dg_.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/b2ea385cb5ae8625-s.p.1spbknb88wd48.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/1b99372b3eaef0c8-s.p.1gsd1jahc5dg_.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../media/b2ea385cb5ae8625-s.p.1spbknb88wd48.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../media/1b99372b3eaef0c8-s.p.1gsd1jahc5dg_.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../media/b2ea385cb5ae8625-s.p.1spbknb88wd48.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../media/1b99372b3eaef0c8-s.p.1gsd1jahc5dg_.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Outfit Fallback;
  src: local(Arial);
  ascent-override: 100.18%;
  descent-override: 26.05%;
  line-gap-override: 0.0%;
  size-adjust: 99.82%;
}

.outfit_1369170f-module__zutyQG__className {
  font-family: Outfit, Outfit Fallback;
  font-style: normal;
}

.outfit_1369170f-module__zutyQG__variable {
  --font-sans: "Outfit", "Outfit Fallback";
}

/* [next]/internal/font/google/fraunces_ae37886b.module.css [app-client] (css) */
@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../media/50a3f1070da3c6cc-s.2xm1k7t3a0pcd.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../media/b887d91685b8c137-s.p.330vchwb4izzb.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../media/3c7c6164b2587822-s.p.16u3vygyjnhr0.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("../media/50a3f1070da3c6cc-s.2xm1k7t3a0pcd.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("../media/b887d91685b8c137-s.p.330vchwb4izzb.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("../media/3c7c6164b2587822-s.p.16u3vygyjnhr0.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("../media/50a3f1070da3c6cc-s.2xm1k7t3a0pcd.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("../media/b887d91685b8c137-s.p.330vchwb4izzb.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("../media/3c7c6164b2587822-s.p.16u3vygyjnhr0.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("../media/50a3f1070da3c6cc-s.2xm1k7t3a0pcd.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("../media/b887d91685b8c137-s.p.330vchwb4izzb.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("../media/3c7c6164b2587822-s.p.16u3vygyjnhr0.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url("../media/50a3f1070da3c6cc-s.2xm1k7t3a0pcd.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url("../media/b887d91685b8c137-s.p.330vchwb4izzb.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Fraunces;
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url("../media/3c7c6164b2587822-s.p.16u3vygyjnhr0.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/1e219c03c996efbd-s.2qo5md4hn_gum.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/b35b0dbffda7f2c4-s.p.1d9rlgtqyj_-l.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/03bda585a99c6450-s.p.32sris142tqlb.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../media/1e219c03c996efbd-s.2qo5md4hn_gum.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../media/b35b0dbffda7f2c4-s.p.1d9rlgtqyj_-l.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../media/03bda585a99c6450-s.p.32sris142tqlb.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/1e219c03c996efbd-s.2qo5md4hn_gum.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/b35b0dbffda7f2c4-s.p.1d9rlgtqyj_-l.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../media/03bda585a99c6450-s.p.32sris142tqlb.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../media/1e219c03c996efbd-s.2qo5md4hn_gum.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../media/b35b0dbffda7f2c4-s.p.1d9rlgtqyj_-l.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../media/03bda585a99c6450-s.p.32sris142tqlb.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../media/1e219c03c996efbd-s.2qo5md4hn_gum.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../media/b35b0dbffda7f2c4-s.p.1d9rlgtqyj_-l.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Fraunces;
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../media/03bda585a99c6450-s.p.32sris142tqlb.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Fraunces Fallback;
  src: local(Times New Roman);
  ascent-override: 84.71%;
  descent-override: 22.09%;
  line-gap-override: 0.0%;
  size-adjust: 115.45%;
}

.fraunces_ae37886b-module__0-zcpq__className {
  font-family: Fraunces, Fraunces Fallback;
}

.fraunces_ae37886b-module__0-zcpq__variable {
  --font-serif: "Fraunces", "Fraunces Fallback";
}

/* [project]/apps/web/src/app/globals.css [app-client] (css) */
:root {
  --bg: #fff;
  --card: #f4f4f3;
  --card-2: #ececeb;
  --dark: #191919;
  --ink: #1b1b1b;
  --ink-2: #4c4c4c;
  --muted: #8c8c8c;
  --line: #e9e9e7;
  --line-2: #dcdcda;
  --red: #c22f2f;
  --red-2: #9e2222;
  --red-tint: #fbeaea;
  --r: 8px;
  --r-sm: 6px;
  --pill: 999px;
  --shadow-sm: 0 2px 10px #0000000d;
  --shadow-md: 0 10px 30px -12px #0000002e;
  --maxw: 1240px;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizelegibility;
  font-size: 15px;
  line-height: 1.6;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  cursor: pointer;
  color: inherit;
  background: none;
  border: none;
  font-family: inherit;
}

img {
  max-width: 100%;
  display: block;
}

ul {
  list-style: none;
}

::selection {
  background: var(--red);
  color: #fff;
}

.container {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 24px;
}

.serif {
  font-family: var(--font-serif);
}

.btn {
  border-radius: var(--pill);
  align-items: center;
  gap: 9px;
  padding: 13px 26px;
  font-size: .9rem;
  font-weight: 600;
  transition: transform .12s, background .15s, border-color .15s, color .15s;
  display: inline-flex;
}

.btn--primary, .btn--star {
  background: var(--red);
  color: #fff;
}

.btn--primary:hover, .btn--star:hover {
  background: var(--red-2);
}

.btn--dark {
  background: var(--dark);
  color: #fff;
}

.btn--dark:hover {
  background: #000;
}

.btn--outline, .btn--ghost {
  border: 1.5px solid var(--line-2);
  color: var(--ink);
}

.btn--outline:hover, .btn--ghost:hover {
  border-color: var(--ink);
}

.btn--light {
  color: var(--ink);
  background: #fff;
}

.topbar {
  background: var(--red);
  color: #fff;
  text-align: center;
  font-size: .8rem;
  font-weight: 500;
}

.topbar .container {
  justify-content: center;
  align-items: center;
  gap: 8px;
  height: 34px;
  display: flex;
}

.topbar__links {
  display: none;
}

.site-header {
  z-index: 50;
  -webkit-backdrop-filter: saturate(140%) blur(10px);
  backdrop-filter: saturate(140%) blur(10px);
  border-bottom: 1px solid var(--line);
  background: #fffffff0;
  position: sticky;
  top: 0;
}

.site-header__main {
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 28px;
  height: 76px;
  display: grid;
}

.brand {
  align-items: center;
  gap: 9px;
  display: inline-flex;
}

.brand__heart {
  color: var(--red);
  display: inline-flex;
}

.brand__name {
  font-family: var(--font-sans);
  letter-spacing: -.02em;
  color: var(--ink);
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1;
}

.brand__dot {
  color: var(--red);
}

.brand__tag {
  display: none;
}

.searchbar {
  background: var(--card);
  border-radius: var(--pill);
  border: 1px solid #0000;
  justify-self: center;
  align-items: center;
  gap: 10px;
  width: 100%;
  max-width: 460px;
  height: 44px;
  padding: 0 18px;
  transition: border-color .2s, background .2s;
  display: flex;
}

.searchbar:focus-within {
  border-color: var(--line-2);
  background: #fff;
}

.searchbar input {
  width: 100%;
  color: var(--ink);
  background: none;
  border: none;
  outline: none;
  font-size: .9rem;
}

.searchbar input::placeholder {
  color: var(--muted);
}

.searchbar svg {
  color: var(--muted);
  flex-shrink: 0;
}

.header-actions {
  align-items: center;
  gap: 4px;
  display: flex;
}

.iconbtn {
  border-radius: var(--pill);
  color: var(--ink);
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  font-size: .84rem;
  font-weight: 500;
  transition: background .15s, color .15s;
  display: inline-flex;
  position: relative;
}

.iconbtn:hover {
  background: var(--card);
  color: var(--red);
}

.iconbtn .badge {
  background: var(--red);
  color: #fff;
  border-radius: 999px;
  place-items: center;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  font-size: .6rem;
  font-weight: 700;
  display: grid;
  position: absolute;
  top: 3px;
  right: 3px;
}

@media (max-width: 900px) {
  .searchbar, .iconbtn__label {
    display: none;
  }
}

.mainnav {
  border-top: 1px solid var(--line);
}

.mainnav .container {
  scrollbar-width: none;
  align-items: center;
  gap: 4px;
  height: 48px;
  display: flex;
  overflow-x: auto;
}

.mainnav .container::-webkit-scrollbar {
  display: none;
}

.mainnav a {
  border-radius: var(--pill);
  color: var(--ink-2);
  white-space: nowrap;
  padding: 8px 14px;
  font-size: .87rem;
  font-weight: 500;
  transition: color .15s, background .15s;
}

.mainnav a:hover {
  color: var(--red);
  background: var(--red-tint);
}

.mainnav a.is-active {
  color: var(--red);
  background: var(--red-tint);
  font-weight: 700;
}

.hslider {
  background: var(--bg);
  padding: 24px 0 8px;
  position: relative;
}

.hslider__stars {
  display: none;
}

.hslider__viewport {
  border-radius: 22px;
  min-height: 420px;
  display: grid;
  position: relative;
  overflow: hidden;
}

.hslide {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  grid-area: 1 / 1;
  grid-template-columns: 1.15fr .85fr;
  align-items: center;
  gap: 30px;
  padding: 48px 80px;
  transition: opacity .5s, visibility .5s;
  display: grid;
}

.hslide.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.hslide--brand {
  background: radial-gradient(120% 140% at 85% 10%, #ffe3df 0%, #fbeee9 45%, #f6efe8 100%);
}

.hslide--spotlight {
  background: radial-gradient(120% 140% at 85% 10%, #e5eefc 0%, #eef2fb 50%, #eef1f6 100%);
}

.hslide--campaign {
  background: radial-gradient(120% 140% at 85% 10%, #efe6fb 0%, #f2ecfb 50%, #efeaf7 100%);
}

.hslide__text {
  max-width: 30ch;
}

.hslide__title {
  font-family: var(--font-serif);
  letter-spacing: -.02em;
  color: var(--ink);
  margin: 14px 0 16px;
  font-size: clamp(2rem, 4vw, 3.1rem);
  font-weight: 500;
  line-height: 1.08;
}

.hslide__title em {
  color: var(--red);
  font-style: italic;
}

.hslide__title-serif {
  font-style: italic;
}

.hslide__lead {
  color: var(--ink-2);
  margin-bottom: 24px;
  font-size: 1rem;
}

.hslide__cta {
  flex-wrap: wrap;
  align-items: center;
  gap: 18px;
  display: flex;
}

.hslide__price {
  align-items: baseline;
  gap: 8px;
  display: inline-flex;
}

.hslide__price .now {
  color: var(--red);
  font-size: 1.3rem;
  font-weight: 700;
}

.hslide__price .was {
  color: var(--muted);
  font-size: .88rem;
  text-decoration: line-through;
}

.hslide__media {
  justify-self: center;
  position: relative;
}

.hslide__frame {
  position: relative;
}

.hslide__cover {
  aspect-ratio: 2 / 3;
  background: #fff;
  border-radius: 6px;
  width: 210px;
  overflow: hidden;
  transform: rotate(-3deg);
  box-shadow: 0 24px 44px -18px #0006;
}

.hslide__cover img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.hslide__tag {
  background: var(--red);
  color: #fff;
  border-radius: var(--pill);
  text-align: center;
  box-shadow: var(--shadow-md);
  padding: 10px 14px;
  font-weight: 700;
  position: absolute;
  top: -14px;
  right: -16px;
}

.hslide__tag b {
  font-size: 1.05rem;
  line-height: 1;
  display: block;
}

.hslide__tag span {
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: .55rem;
}

.hslide__caption {
  display: none;
}

.hslider__nav {
  pointer-events: none;
  z-index: 5;
  justify-content: space-between;
  align-items: center;
  padding: 0 14px;
  display: flex;
  position: absolute;
  inset: 24px 0 0;
}

.hslider__arrow {
  border: 1px solid var(--line-2);
  width: 46px;
  height: 46px;
  color: var(--ink);
  pointer-events: auto;
  box-shadow: var(--shadow-sm);
  background: #ffffffd9;
  border-radius: 999px;
  place-items: center;
  transition: all .15s;
  display: grid;
}

.hslider__arrow:hover {
  color: var(--red);
  background: #fff;
}

.hslider__count {
  display: none;
}

.hslider__bar {
  justify-content: center;
  align-items: center;
  padding-top: 16px;
  display: flex;
}

.hslider__dots {
  align-items: center;
  gap: 9px;
  display: flex;
}

.hslider__dot {
  background: var(--line-2);
  border-radius: 999px;
  width: 9px;
  height: 9px;
  transition: width .2s, background .2s;
  position: relative;
  overflow: hidden;
}

.hslider__dot.is-active {
  background: #c22f2f38;
  width: 30px;
}

.hslider__dot-fill {
  background: var(--red);
  border-radius: inherit;
  width: 0;
  position: absolute;
  inset: 0;
}

.hslider__dot.is-active .hslider__dot-fill {
  animation-name: dotgrow;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
}

@keyframes dotgrow {
  from {
    width: 0;
  }

  to {
    width: 100%;
  }
}

.hslider__aside {
  display: none;
}

.hslide__media {
  position: relative;
}

.hslide__glow {
  z-index: 0;
  pointer-events: none;
  filter: blur(6px);
  border-radius: 50%;
  width: 320px;
  height: 320px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.hslide--brand .hslide__glow {
  background: radial-gradient(circle, #c22f2f29, #0000 68%);
}

.hslide--spotlight .hslide__glow {
  background: radial-gradient(circle, #1f3a5f2e, #0000 68%);
}

.hslide--campaign .hslide__glow {
  background: radial-gradient(circle, #5b4b8a2e, #0000 68%);
}

.hslide__frame {
  z-index: 1;
  cursor: pointer;
  display: block;
  position: relative;
}

.hslide__frame .hslide__cover {
  transition: transform .25s, box-shadow .25s;
}

.hslide__frame:hover .hslide__cover {
  transform: rotate(-3deg)translateY(-6px)scale(1.02);
  box-shadow: 0 34px 60px -22px #00000080;
}

.hslide__caption {
  z-index: 1;
  position: relative;
}

@keyframes heroIn {
  from {
    opacity: 0;
    transform: translateY(16px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.hslide.is-active .kicker {
  animation: .5s 40ms both heroIn;
}

.hslide.is-active .hslide__title {
  animation: .55s .12s both heroIn;
}

.hslide.is-active .hslide__lead {
  animation: .55s .2s both heroIn;
}

.hslide.is-active .hslide__cta {
  animation: .55s .28s both heroIn;
}

.hslide.is-active .hslide__media {
  animation: .6s .1s both heroIn;
}

@media (prefers-reduced-motion: reduce) {
  .hslide.is-active .kicker, .hslide.is-active .hslide__title, .hslide.is-active .hslide__lead, .hslide.is-active .hslide__cta, .hslide.is-active .hslide__media {
    animation: none;
  }
}

@media (max-width: 860px) {
  .hslide {
    text-align: center;
    grid-template-columns: 1fr;
    padding: 40px 28px;
  }

  .hslide__text {
    max-width: none;
  }

  .hslide__media {
    display: none;
  }

  .hslide__cta {
    justify-content: center;
  }
}

.catindex {
  padding: 30px 0 6px;
}

.catindex .container {
  flex-wrap: wrap;
  gap: 12px;
  display: flex;
}

.catindex a {
  border: 1.5px solid var(--line-2);
  color: var(--ink);
  background: #fff;
  border-radius: 12px 20px 20px 12px;
  align-items: center;
  gap: 8px;
  padding: 12px 26px 12px 22px;
  font-size: .92rem;
  font-weight: 600;
  transition: all .15s;
  display: inline-flex;
}

.catindex a:hover {
  border-color: var(--red);
  color: var(--red);
  background: var(--red-tint);
}

.catindex a .n {
  display: none;
}

.section {
  padding: 46px 0;
}

.section--void {
  background: var(--dark);
  color: #efefef;
  max-width: calc(var(--maxw) + 48px);
  border-radius: 26px;
  margin: 20px auto;
  padding: 56px 0;
}

.section__head {
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  margin-bottom: 26px;
  display: flex;
}

.section__title {
  font-family: var(--font-sans);
  letter-spacing: -.02em;
  font-size: 1.6rem;
  font-weight: 700;
}

.section--void .section__title {
  color: #fff;
}

.kicker {
  display: none;
}

.section__link {
  color: var(--ink-2);
  white-space: nowrap;
  align-items: center;
  gap: 6px;
  font-size: .9rem;
  font-weight: 600;
  display: inline-flex;
}

.section__link:hover {
  color: var(--red);
}

.section--void .section__link {
  color: #cfcfcf;
}

.book-grid {
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  display: grid;
}

@media (max-width: 980px) {
  .book-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 680px) {
  .book-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }
}

.book {
  background: var(--card);
  border-radius: var(--r);
  flex-direction: column;
  padding: 18px;
  transition: box-shadow .2s, transform .2s;
  display: flex;
}

.book:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}

.section--void .book {
  background: #232323;
}

.book__cover {
  aspect-ratio: 2 / 3;
  place-items: center;
  margin-bottom: 14px;
  display: grid;
  position: relative;
}

.book__cover img {
  object-fit: contain;
  border-radius: 4px;
  width: auto;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  box-shadow: 0 10px 24px -12px #00000073;
}

.book__badge {
  background: var(--ink);
  color: #fff;
  border-radius: var(--pill);
  letter-spacing: .02em;
  padding: 4px 9px;
  font-size: .62rem;
  font-weight: 700;
  position: absolute;
  top: 0;
  right: 0;
}

.book__badge--new {
  background: var(--red);
}

.book__fav {
  width: 34px;
  height: 34px;
  color: var(--muted);
  box-shadow: var(--shadow-sm);
  background: #fff;
  border-radius: 999px;
  place-items: center;
  transition: color .15s;
  display: grid;
  position: absolute;
  bottom: 0;
  right: 0;
}

.book__fav:hover {
  color: var(--red);
}

.book__stars {
  color: #d7d7d5;
  gap: 2px;
  margin-bottom: 7px;
  display: flex;
}

.book__body {
  flex-direction: column;
  flex: 1;
  display: flex;
}

.book__cat {
  display: none;
}

.book__title {
  font-family: var(--font-sans);
  color: var(--ink);
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin-bottom: 3px;
  font-size: .95rem;
  font-weight: 700;
  line-height: 1.28;
  display: -webkit-box;
  overflow: hidden;
}

.section--void .book__title {
  color: #fff;
}

.book:hover .book__title {
  color: var(--red);
}

.book__author {
  color: var(--muted);
  margin-bottom: 4px;
  font-size: .84rem;
}

.book__meta {
  color: var(--muted);
  margin-bottom: 12px;
  font-size: .78rem;
}

.book__price {
  margin-top: auto;
}

.book__price .list {
  color: var(--muted);
  font-size: .82rem;
  text-decoration: line-through;
}

.book__price .promo {
  color: var(--ink-2);
  margin: 2px 0 1px;
  font-size: .72rem;
}

.book__price .now {
  color: var(--red);
  font-size: 1.15rem;
  font-weight: 700;
}

.book__soldout {
  color: var(--muted);
  margin-top: auto;
  font-size: .84rem;
  font-weight: 600;
}

.authors {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 40px 0;
}

.authors__names {
  font-family: var(--font-serif);
  color: var(--ink);
  margin-bottom: 18px;
  font-size: clamp(1.5rem, 2.8vw, 2.2rem);
  font-style: italic;
  font-weight: 400;
  line-height: 1.5;
}

.authors__names a {
  transition: color .15s;
}

.authors__names a:hover {
  color: var(--red);
}

.authors__names .sep {
  color: var(--red);
  margin: 0 8px;
  font-style: normal;
}

.authorgrid {
  grid-template-columns: repeat(6, 1fr);
  gap: 14px;
  display: grid;
}

@media (max-width: 980px) {
  .authorgrid {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (max-width: 640px) {
  .authorgrid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.authorcard {
  text-align: center;
  background: var(--card);
  border-radius: var(--r);
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 22px 14px;
  transition: box-shadow .2s, transform .2s;
  display: flex;
}

.authorcard:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}

.authorcard__avatar {
  color: #fff;
  width: 60px;
  height: 60px;
  font-family: var(--font-serif);
  border-radius: 999px;
  place-items: center;
  font-size: 1.35rem;
  font-style: italic;
  font-weight: 500;
  display: grid;
}

.authorcard__name {
  color: var(--ink);
  font-size: .9rem;
  font-weight: 600;
  line-height: 1.25;
}

.authorcard:hover .authorcard__name {
  color: var(--red);
}

.authorcard__role {
  color: var(--muted);
  font-size: .74rem;
}

.feature-row {
  display: block;
}

.feature-card {
  background: var(--card);
  border-radius: 22px;
  grid-template-columns: 260px 1fr;
  align-items: center;
  gap: 40px;
  padding: 40px;
  display: grid;
}

.feature-card__cover {
  aspect-ratio: 2 / 3;
  place-items: center;
  display: grid;
}

.feature-card__cover img {
  border-radius: 6px;
  width: auto;
  max-height: 100%;
  box-shadow: 0 20px 40px -16px #00000073;
}

.feature-card .cat {
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--red);
  font-size: .72rem;
  font-weight: 700;
}

.feature-card h3 {
  font-family: var(--font-serif);
  margin: 8px 0 6px;
  font-size: 1.9rem;
  font-weight: 500;
  line-height: 1.15;
}

.feature-card .by {
  color: var(--muted);
  margin-bottom: 16px;
  font-size: .95rem;
}

.feature-card .desc {
  color: var(--ink-2);
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  max-width: 60ch;
  margin-bottom: 20px;
  font-size: .95rem;
  line-height: 1.7;
  display: -webkit-box;
  overflow: hidden;
}

.feature-card .price {
  align-items: baseline;
  gap: 10px;
  margin-bottom: 20px;
  display: flex;
}

.feature-card .price .now {
  color: var(--red);
  font-size: 1.5rem;
  font-weight: 700;
}

.feature-card .price .was {
  color: var(--muted);
  font-size: .9rem;
  text-decoration: line-through;
}

@media (max-width: 760px) {
  .feature-card {
    text-align: center;
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 28px;
  }

  .feature-card__cover {
    max-width: 200px;
    margin: 0 auto;
  }
}

.ranklist, .statstrip, .marquee {
  display: none;
}

.comingsoon {
  background: var(--card);
  border-radius: 22px;
  grid-template-columns: 1fr auto;
  align-items: stretch;
  gap: 36px;
  padding: 36px;
  display: grid;
}

.comingsoon__feature {
  grid-template-columns: 200px 1fr;
  align-items: center;
  gap: 34px;
  display: grid;
}

.comingsoon__cover {
  aspect-ratio: 2 / 3;
  place-items: center;
  display: grid;
}

.comingsoon__cover img {
  border-radius: 6px;
  width: auto;
  max-height: 100%;
  box-shadow: 0 20px 40px -16px #00000073;
}

.comingsoon .cat {
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--red);
  font-size: .72rem;
  font-weight: 700;
}

.comingsoon h3 {
  font-family: var(--font-serif);
  margin: 8px 0 6px;
  font-size: 1.7rem;
  font-weight: 500;
  line-height: 1.15;
}

.comingsoon .by {
  color: var(--muted);
  margin-bottom: 14px;
  font-size: .92rem;
}

.comingsoon .desc {
  color: var(--ink-2);
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  margin-bottom: 18px;
  font-size: .92rem;
  line-height: 1.65;
  display: -webkit-box;
  overflow: hidden;
}

.spineshelf {
  border-left: 1px solid var(--line-2);
  align-items: flex-end;
  gap: 9px;
  padding-left: 36px;
  display: flex;
  position: relative;
}

.spineshelf:after {
  content: "";
  background: var(--line-2);
  border-radius: 2px;
  height: 4px;
  position: absolute;
  bottom: -1px;
  left: 36px;
  right: 0;
}

.spine {
  border-radius: 3px 3px 2px 2px;
  justify-content: center;
  align-items: center;
  width: 66px;
  height: 320px;
  padding: 22px 0 20px;
  transition: transform .2s;
  display: flex;
  position: relative;
  overflow: hidden;
  box-shadow: inset 0 0 0 1px #ffffff2e, 0 8px 18px -7px #00000073;
}

.spine:before {
  content: "";
  background: #ffffff8c;
  border-radius: 2px;
  height: 3px;
  position: absolute;
  top: 12px;
  left: 6px;
  right: 6px;
}

.spine:after {
  content: "";
  background: #fff6;
  border-radius: 2px;
  height: 3px;
  position: absolute;
  bottom: 10px;
  left: 6px;
  right: 6px;
}

.spine:hover {
  transform: translateY(-8px);
}

.spine span {
  writing-mode: vertical-rl;
  color: #fff;
  letter-spacing: .01em;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-shadow: 0 1px 3px #00000073;
  max-height: 268px;
  font-size: 1.08rem;
  font-weight: 700;
  line-height: 1.1;
  overflow: hidden;
  transform: rotate(180deg);
}

.spine:nth-child(6n+1) {
  background: #b23530;
  height: 330px;
}

.spine:nth-child(6n+2) {
  background: #2f4a63;
  height: 312px;
}

.spine:nth-child(6n+3) {
  background: #3c6e47;
  height: 338px;
}

.spine:nth-child(6n+4) {
  background: #8a5a2b;
  height: 304px;
}

.spine:nth-child(6n+5) {
  background: #5b4b8a;
  height: 326px;
}

.spine:nth-child(6n+6) {
  background: #a8842c;
  height: 316px;
}

@media (max-width: 860px) {
  .comingsoon {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .spineshelf {
    border-left: none;
    flex-wrap: wrap;
    justify-content: center;
    padding-left: 0;
  }
}

@media (max-width: 640px) {
  .comingsoon__feature {
    text-align: center;
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .comingsoon__cover {
    max-width: 170px;
    margin: 0 auto;
  }
}

.seriesrow {
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  display: grid;
}

.series {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  display: flex;
}

.series__stack {
  width: 100%;
  height: 190px;
  margin-bottom: 10px;
  position: relative;
}

.series__cover {
  aspect-ratio: 2 / 3;
  transform-origin: bottom;
  background: #333;
  border-radius: 4px;
  width: 96px;
  transition: transform .28s;
  position: absolute;
  bottom: 0;
  left: 50%;
  overflow: hidden;
  box-shadow: 0 12px 26px -12px #000000b3;
}

.series__cover img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.series__cover:first-child {
  z-index: 1;
  transform: translateX(-50%)rotate(-9deg)translateX(-26px);
}

.series__cover:nth-child(2) {
  z-index: 3;
  transform: translateX(-50%)rotate(0);
}

.series__cover:nth-child(3) {
  z-index: 2;
  transform: translateX(-50%)rotate(9deg)translateX(26px);
}

.series:hover .series__cover:first-child {
  transform: translateX(-50%)rotate(-14deg)translateX(-40px)translateY(-6px);
}

.series:hover .series__cover:nth-child(3) {
  transform: translateX(-50%)rotate(14deg)translateX(40px)translateY(-6px);
}

.series:hover .series__cover:nth-child(2) {
  transform: translateX(-50%)translateY(-10px);
}

.series b {
  font-family: var(--font-serif);
  color: #fff;
  font-size: 1.25rem;
  font-style: italic;
}

.series span {
  color: #a9a9a9;
  font-size: .82rem;
}

@media (max-width: 760px) {
  .seriesrow {
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
  }
}

.topics {
  font-family: var(--font-serif);
  color: var(--ink);
  font-size: clamp(1.3rem, 2.4vw, 1.9rem);
  font-style: italic;
  line-height: 1.7;
}

.topics a {
  transition: color .15s;
}

.topics a:hover {
  color: var(--red);
}

.topics .sep {
  color: var(--red);
  margin: 0 8px;
  font-style: normal;
}

.promobanner {
  background: var(--dark);
  text-align: center;
  color: #fff;
  border-radius: 22px;
  padding: 72px 32px;
  position: relative;
  overflow: hidden;
}

.promobanner:before {
  content: "";
  background: radial-gradient(circle at 12% 20%, #c22f2f40, #0000 30%), radial-gradient(circle at 88% 80%, #c22f2f33, #0000 32%);
  position: absolute;
  inset: 0;
}

.promobanner__inner {
  max-width: 620px;
  margin: 0 auto;
  position: relative;
}

.promobanner h2 {
  font-family: var(--font-serif);
  margin-bottom: 14px;
  font-size: clamp(1.8rem, 3.4vw, 2.6rem);
  font-weight: 500;
}

.promobanner p {
  color: #b9b9b9;
  margin-bottom: 26px;
  line-height: 1.7;
}

.weekbook {
  grid-template-columns: 300px 1fr;
  align-items: center;
  gap: 48px;
  display: grid;
}

.weekbook__cover {
  aspect-ratio: 2 / 3;
  place-items: center;
  display: grid;
}

.weekbook__cover img {
  border-radius: 6px;
  width: auto;
  max-height: 100%;
  box-shadow: 0 30px 50px -18px #000c;
}

.weekbook .cat {
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--red);
  font-size: .72rem;
  font-weight: 700;
}

.weekbook h3 {
  font-family: var(--font-sans);
  letter-spacing: -.02em;
  color: #fff;
  margin: 10px 0 6px;
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  font-weight: 800;
  line-height: 1.12;
}

.weekbook .by {
  color: #a9a9a9;
  margin-bottom: 16px;
}

.weekbook .desc {
  color: #cfcfcf;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  max-width: 62ch;
  margin-bottom: 24px;
  line-height: 1.8;
  display: -webkit-box;
  overflow: hidden;
}

.weekbook__related {
  border-top: 1px solid #ffffff24;
  gap: 14px;
  margin-top: 26px;
  padding-top: 22px;
  display: flex;
}

.weekbook__related a {
  aspect-ratio: 2 / 3;
  border-radius: 4px;
  width: 64px;
  transition: transform .2s;
  overflow: hidden;
  box-shadow: 0 10px 20px -10px #000000b3;
}

.weekbook__related a:hover {
  transform: translateY(-4px);
}

.weekbook__related img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

@media (max-width: 760px) {
  .weekbook {
    text-align: center;
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .weekbook__cover {
    max-width: 200px;
    margin: 0 auto;
  }

  .weekbook__related {
    justify-content: center;
  }
}

.blogevents {
  grid-template-columns: 1.6fr 1fr;
  gap: 48px;
  display: grid;
}

.blogevents__col h3 {
  font-family: var(--font-sans);
  color: #fff;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 22px;
  font-size: 1.3rem;
  font-weight: 700;
  display: flex;
}

.blogevents__col h3 a {
  color: #bdbdbd;
  font-size: .82rem;
  font-weight: 600;
}

.blogevents__col h3 a:hover {
  color: var(--red);
}

.blog {
  flex-direction: column;
  gap: 18px;
  display: flex;
}

.blogpost__img img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  transition: transform .4s;
}

.blogpost__tag {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #fff;
  background: var(--red);
  border-radius: 999px;
  align-self: flex-start;
  padding: 4px 9px;
  font-size: .66rem;
  font-weight: 700;
  display: inline-block;
}

.blogpost__date {
  color: #9a9a9a;
  font-size: .78rem;
}

.blogpost--feature {
  aspect-ratio: 16 / 9;
  border-radius: 16px;
  display: block;
  position: relative;
  overflow: hidden;
}

.blogpost--feature .blogpost__img {
  position: absolute;
  inset: 0;
}

.blogpost--feature:hover .blogpost__img img {
  transform: scale(1.05);
}

.blogpost--feature .blogpost__body {
  background: linear-gradient(to top, #000000d1 0%, #00000040 55%, #0000 80%);
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 8px;
  padding: 22px;
  display: flex;
  position: absolute;
  inset: 0;
}

.blogpost--feature b {
  color: #fff;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.28;
}

.blog__list {
  gap: 4px;
  display: grid;
}

.blogpost--row {
  border-top: 1px solid #ffffff1a;
  grid-template-columns: 104px 1fr;
  align-items: center;
  gap: 16px;
  padding: 14px 0;
  display: grid;
}

.blogpost--row .blogpost__img {
  aspect-ratio: 16 / 11;
  background: #2a2a2a;
  border-radius: 10px;
  overflow: hidden;
}

.blogpost--row:hover .blogpost__img img {
  transform: scale(1.06);
}

.blogpost--row .blogpost__body {
  flex-direction: column;
  gap: 5px;
  min-width: 0;
  display: flex;
}

.blogpost--row b {
  color: #fff;
  font-size: .98rem;
  font-weight: 700;
  line-height: 1.3;
}

.blogpost--row:hover b {
  color: #fff;
  text-decoration: underline;
  -webkit-text-decoration-color: var(--red);
  text-decoration-color: var(--red);
  text-underline-offset: 3px;
}

.events {
  gap: 18px;
  display: grid;
}

.event {
  align-items: center;
  gap: 16px;
  display: flex;
}

.event__avatar {
  width: 68px;
  height: 68px;
  font-family: var(--font-serif);
  color: #fff;
  text-align: center;
  border-radius: 999px;
  flex-shrink: 0;
  place-items: center;
  padding: 6px;
  font-size: 1.1rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.05;
  display: grid;
}

.event b {
  color: #fff;
  font-size: .94rem;
  display: block;
}

.event span {
  color: #9a9a9a;
  font-size: .82rem;
}

@media (max-width: 860px) {
  .blogevents {
    grid-template-columns: 1fr;
    gap: 36px;
  }
}

@media (max-width: 520px) {
  .blog {
    grid-template-columns: 1fr;
  }
}

.promos {
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  display: grid;
}

.promocard {
  color: #fff;
  border-radius: 18px;
  flex-direction: column;
  justify-content: center;
  min-height: 180px;
  padding: 40px 36px;
  transition: transform .2s;
  display: flex;
}

.promocard:hover {
  transform: translateY(-3px);
}

.promocard small {
  letter-spacing: .06em;
  text-transform: uppercase;
  opacity: .85;
  margin-bottom: 8px;
  font-size: .78rem;
}

.promocard b {
  font-family: var(--font-serif);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.1;
}

.promocard--red {
  background: linear-gradient(135deg, var(--red), #4e2464);
}

.promocard--dark {
  background: linear-gradient(135deg, #2b2b6b, #16163a);
}

@media (max-width: 640px) {
  .promos {
    grid-template-columns: 1fr;
  }
}

.trustbar {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.trustbar .container {
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  padding-top: 26px;
  padding-bottom: 26px;
  display: grid;
}

.trust {
  align-items: center;
  gap: 14px;
  display: flex;
}

.trust__icon {
  background: var(--red-tint);
  width: 46px;
  height: 46px;
  color: var(--red);
  border-radius: 999px;
  flex-shrink: 0;
  place-items: center;
  display: grid;
}

.trust b {
  font-size: .92rem;
  font-weight: 700;
  display: block;
}

.trust span {
  color: var(--muted);
  font-size: .8rem;
}

@media (max-width: 760px) {
  .trustbar .container {
    grid-template-columns: 1fr 1fr;
  }
}

.site-footer {
  background: var(--card);
  border-top: 1px solid var(--line);
  margin-top: 20px;
  padding: 56px 0 26px;
  font-size: .88rem;
}

.footer-grid {
  border-bottom: 1px solid var(--line-2);
  grid-template-columns: 1.6fr 1fr 1fr 1.3fr;
  gap: 40px;
  padding-bottom: 40px;
  display: grid;
}

.footer-brand .brand__name {
  font-size: 1.5rem;
}

.footer-brand p {
  color: var(--ink-2);
  max-width: 34ch;
  margin: 14px 0 18px;
  line-height: 1.6;
}

.footer-col h4 {
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 16px;
  font-size: .76rem;
  font-weight: 700;
}

.footer-col ul {
  gap: 10px;
  display: grid;
}

.footer-col a {
  color: var(--ink-2);
}

.footer-col a:hover {
  color: var(--red);
}

.footer-contact li {
  color: var(--ink-2);
  align-items: flex-start;
  gap: 10px;
  display: flex;
}

.footer-contact svg {
  color: var(--red);
  flex-shrink: 0;
  margin-top: 2px;
}

.footer-social {
  gap: 10px;
  display: flex;
}

.footer-social a {
  border: 1px solid var(--line-2);
  width: 38px;
  height: 38px;
  color: var(--ink-2);
  background: #fff;
  border-radius: 999px;
  place-items: center;
  transition: all .15s;
  display: grid;
}

.footer-social a:hover {
  background: var(--red);
  border-color: var(--red);
  color: #fff;
}

.footer-bottom {
  color: var(--muted);
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding-top: 22px;
  font-size: .8rem;
  display: flex;
}

@media (max-width: 860px) {
  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }
}

@media (max-width: 520px) {
  .footer-grid {
    grid-template-columns: 1fr;
  }
}

.newsletter {
  background: linear-gradient(120deg, var(--red) 0%, color-mix(in srgb, var(--red) 78%, #000) 100%);
  color: #fff;
  border-radius: 16px;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 28px;
  margin-bottom: 40px;
  padding: 22px 26px;
  display: flex;
}

.newsletter__text {
  align-items: center;
  gap: 14px;
  display: flex;
}

.newsletter__icon {
  background: #ffffff29;
  border-radius: 12px;
  flex-shrink: 0;
  place-items: center;
  width: 44px;
  height: 44px;
  display: grid;
}

.newsletter__text h4 {
  color: #fff;
  margin: 0 0 2px;
  font-size: 1.15rem;
  font-weight: 700;
}

.newsletter__text p {
  color: #ffffffd9;
  max-width: 42ch;
  margin: 0;
  font-size: .86rem;
}

.newsletter__form {
  flex: 1;
  gap: 10px;
  min-width: 280px;
  max-width: 440px;
  display: flex;
  position: relative;
}

.newsletter__form input[type="email"] {
  min-width: 0;
  height: 44px;
  color: var(--ink);
  background: #fff;
  border: 1px solid #0000;
  border-radius: 999px;
  flex: 1;
  padding: 0 16px;
  font-size: .9rem;
}

.newsletter__form input[type="email"]:focus {
  outline: none;
  box-shadow: 0 0 0 3px #ffffff59;
}

.newsletter__form .btn {
  white-space: nowrap;
  height: 44px;
  color: var(--red);
  background: #fff;
  border-color: #fff;
  border-radius: 999px;
}

.newsletter__form .btn:hover {
  background: #ffffffe6;
}

.newsletter__ok, .newsletter__err {
  align-items: center;
  gap: 8px;
  font-size: .9rem;
  font-weight: 500;
  display: flex;
}

.newsletter__ok {
  color: #fff;
  background: #ffffff29;
  border-radius: 999px;
  padding: 12px 18px;
}

.newsletter__err {
  color: #fff;
  justify-content: flex-end;
  width: 100%;
  margin-top: 2px;
}

@media (max-width: 720px) {
  .newsletter {
    flex-direction: column;
    align-items: flex-start;
  }

  .newsletter__form {
    width: 100%;
    max-width: none;
  }

  .newsletter__err {
    justify-content: flex-start;
  }
}

.unsub {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  max-width: 520px;
  margin: 60px auto 80px;
  display: flex;
}

.unsub__icon {
  border-radius: 999px;
  place-items: center;
  width: 76px;
  height: 76px;
  display: grid;
}

.unsub__icon--ok {
  background: color-mix(in srgb, var(--red) 12%, transparent);
  color: var(--red);
}

.unsub__icon--err {
  color: var(--muted);
  background: #7878781f;
}

.unsub h1 {
  margin: 4px 0 0;
  font-size: 1.6rem;
}

.unsub p {
  color: var(--ink-2);
  margin: 0 0 8px;
  line-height: 1.6;
}

.crumbs {
  color: var(--muted);
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  padding: 22px 0 6px;
  font-size: .82rem;
  display: flex;
}

.crumbs a:hover {
  color: var(--red);
}

.crumbs span {
  color: var(--ink);
}

.crumbs svg {
  color: var(--line-2);
}

.catalog__head {
  border-bottom: 1px solid var(--line);
  margin-bottom: 30px;
  padding: 18px 0 26px;
}

.catalog__title {
  font-family: var(--font-sans);
  letter-spacing: -.02em;
  font-size: clamp(1.7rem, 3vw, 2.4rem);
  font-weight: 700;
}

.catalog__count {
  color: var(--muted);
  margin-top: 6px;
}

.catalog__empty {
  color: var(--muted);
  padding: 40px 0 80px;
}

.book-grid--catalog {
  margin-bottom: 70px;
}

.pdp {
  grid-template-columns: .9fr 1.1fr;
  gap: 48px;
  padding: 22px 0 40px;
  display: grid;
}

.pdp__media {
  background: var(--card);
  border-radius: var(--r);
  align-self: start;
  place-items: center;
  padding: 40px;
  display: grid;
  position: sticky;
  top: 96px;
}

.pdp__media img {
  border-radius: 6px;
  width: auto;
  max-height: 460px;
  box-shadow: 0 26px 50px -18px #00000080;
}

.pdp__cat {
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--red);
  font-size: .72rem;
  font-weight: 700;
}

.pdp__title {
  font-family: var(--font-sans);
  letter-spacing: -.02em;
  margin: 8px 0 6px;
  font-size: clamp(1.7rem, 3.2vw, 2.5rem);
  font-weight: 800;
  line-height: 1.15;
}

.pdp__author {
  color: var(--ink-2);
  font-size: 1rem;
}

.pdp__author:hover {
  color: var(--red);
}

.pdp__stars {
  color: #e0a83a;
  gap: 2px;
  margin: 12px 0;
  display: flex;
}

.pdp__pricebox {
  background: var(--card);
  border-radius: var(--r);
  flex-direction: column;
  gap: 2px;
  margin: 8px 0 18px;
  padding: 18px 22px;
  display: flex;
}

.pdp__list {
  color: var(--muted);
  font-size: .9rem;
  text-decoration: line-through;
}

.pdp__promo {
  color: var(--ink-2);
  font-size: .82rem;
}

.pdp__now {
  font-family: var(--font-sans);
  color: var(--red);
  font-size: 1.9rem;
  font-weight: 700;
}

.pdp__soldout {
  color: var(--muted);
  font-weight: 700;
}

.pdp__actions {
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 22px;
  display: flex;
}

.pdp__actions .btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.pdp__meta {
  border-top: 1px solid var(--line);
  gap: 0;
  display: grid;
}

.pdp__meta li {
  border-bottom: 1px solid var(--line);
  grid-template-columns: 160px 1fr;
  gap: 12px;
  padding: 12px 0;
  font-size: .9rem;
  display: grid;
}

.pdp__meta b {
  color: var(--muted);
  font-weight: 600;
}

.pdp__assure {
  color: var(--ink-2);
  gap: 20px;
  margin-top: 18px;
  font-size: .85rem;
  display: flex;
}

.pdp__assure span {
  align-items: center;
  gap: 7px;
  display: inline-flex;
}

.pdp__assure svg {
  color: var(--red);
}

.pdp__desc {
  max-width: 820px;
  padding: 10px 0 30px;
}

.pdp__desc h2 {
  margin-bottom: 12px;
  font-size: 1.3rem;
  font-weight: 700;
}

.pdp__desc p {
  color: var(--ink-2);
  line-height: 1.8;
}

@media (max-width: 820px) {
  .pdp {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .pdp__media {
    position: static;
  }
}

.catgrid {
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 70px;
  display: grid;
}

.catcard {
  background: var(--card);
  border-radius: var(--r);
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 24px 26px;
  transition: box-shadow .2s, transform .2s;
  display: flex;
}

.catcard:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}

.catcard__name {
  font-size: 1.05rem;
  font-weight: 700;
}

.catcard__meta {
  color: var(--red);
  align-items: center;
  gap: 6px;
  font-size: .85rem;
  font-weight: 600;
  display: inline-flex;
}

.authorgrid--page {
  margin-bottom: 70px;
}

@media (max-width: 760px) {
  .catgrid {
    grid-template-columns: 1fr;
  }
}

.prose {
  max-width: 760px;
  padding: 20px 0 70px;
}

.prose h1 {
  font-family: var(--font-serif);
  margin-bottom: 16px;
  font-size: 2.4rem;
  font-weight: 500;
}

.prose h2 {
  margin: 30px 0 12px;
  font-size: 1.4rem;
  font-weight: 700;
}

.prose__lead {
  color: var(--ink);
  margin-bottom: 16px;
  font-size: 1.15rem;
  line-height: 1.7;
}

.prose p {
  color: var(--ink-2);
  margin-bottom: 14px;
  line-height: 1.8;
}

.prose a {
  color: var(--red);
  font-weight: 600;
}

.prose__pillars {
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin: 28px 0;
  display: grid;
}

.prose__pillar {
  background: var(--card);
  border-radius: var(--r);
  padding: 24px;
}

.prose__pillar svg {
  color: var(--red);
  margin-bottom: 10px;
}

.prose__pillar b {
  margin-bottom: 4px;
  display: block;
}

.prose__pillar span {
  color: var(--muted);
  font-size: .88rem;
}

@media (max-width: 700px) {
  .prose__pillars {
    grid-template-columns: 1fr;
  }
}

.contact {
  grid-template-columns: 1fr 1.2fr;
  align-items: start;
  gap: 40px;
  padding-bottom: 70px;
  display: grid;
}

.contact__cards {
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  display: grid;
}

.contact__card {
  background: var(--card);
  border-radius: var(--r);
  padding: 24px;
}

.contact__icon {
  background: var(--red-tint);
  width: 44px;
  height: 44px;
  color: var(--red);
  border-radius: 999px;
  place-items: center;
  margin-bottom: 12px;
  display: grid;
}

.contact__card b {
  margin-bottom: 4px;
  display: block;
}

.contact__card span {
  color: var(--muted);
  font-size: .9rem;
}

.contact__form {
  background: var(--card);
  border-radius: 18px;
  padding: 32px;
}

.contact__form h2 {
  margin-bottom: 18px;
  font-size: 1.3rem;
  font-weight: 700;
}

.contact__row {
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  display: grid;
}

.contact__form input, .contact__form textarea {
  border: 1px solid var(--line-2);
  width: 100%;
  font: inherit;
  background: #fff;
  border-radius: 10px;
  outline: none;
  margin-bottom: 12px;
  padding: 13px 16px;
}

.contact__form input:focus, .contact__form textarea:focus {
  border-color: var(--red);
}

.form-ok, .form-error {
  border-radius: 10px;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  padding: 11px 14px;
  font-size: .9rem;
  font-weight: 500;
  display: flex;
}

.form-ok {
  color: #15803d;
  background: #16a34a1f;
}

.form-error {
  background: color-mix(in srgb, var(--red) 12%, transparent);
  color: var(--red);
}

@media (max-width: 820px) {
  .contact {
    grid-template-columns: 1fr;
  }

  .contact__cards {
    grid-template-columns: 1fr 1fr;
  }
}

.authorsearch {
  background: var(--card);
  border: 1px solid var(--line-2);
  border-radius: var(--pill);
  align-items: center;
  gap: 10px;
  max-width: 480px;
  height: 50px;
  margin-bottom: 14px;
  padding: 0 18px;
  transition: border-color .2s, background .2s;
  display: flex;
}

.authorsearch:focus-within {
  border-color: var(--red);
  background: #fff;
}

.authorsearch svg {
  color: var(--muted);
  flex-shrink: 0;
}

.authorsearch input {
  width: 100%;
  font: inherit;
  color: var(--ink);
  background: none;
  border: none;
  outline: none;
  font-size: .95rem;
}

.authorsearch input::placeholder {
  color: var(--muted);
}

.authorsearch button {
  color: var(--muted);
  border-radius: 999px;
  flex-shrink: 0;
  place-items: center;
  width: 26px;
  height: 26px;
  display: grid;
}

.authorsearch button:hover {
  background: var(--red-tint);
  color: var(--red);
}

.weekslider, .weekslider__viewport {
  position: relative;
}

.weekslide {
  opacity: 0;
  pointer-events: none;
  transition: opacity .5s, transform .6s cubic-bezier(.16, 1, .3, 1);
  position: absolute;
  inset: 0;
  transform: translateY(10px);
}

.weekslide.is-active {
  opacity: 1;
  pointer-events: auto;
  position: relative;
  transform: none;
}

.weekslider__ctrl {
  border-top: 1px solid #ffffff24;
  justify-content: center;
  align-items: center;
  gap: 18px;
  margin-top: 30px;
  padding-top: 22px;
  display: flex;
}

.weekslider__arrow {
  color: #fff;
  border: 1px solid #ffffff47;
  border-radius: 999px;
  place-items: center;
  width: 44px;
  height: 44px;
  transition: all .15s;
  display: grid;
}

.weekslider__arrow:hover {
  background: var(--red);
  border-color: var(--red);
}

.weekslider__dots {
  align-items: center;
  gap: 8px;
  display: flex;
}

.weekslider__dot {
  background: #ffffff47;
  border-radius: 999px;
  width: 9px;
  height: 9px;
  transition: width .2s, background .2s;
}

.weekslider__dot.is-active {
  background: var(--red);
  width: 28px;
}

.ptabs {
  padding: 6px 0 40px;
}

.ptabs__nav {
  border-bottom: 2px solid var(--line);
  scrollbar-width: none;
  gap: 6px;
  margin-bottom: 24px;
  display: flex;
  overflow-x: auto;
}

.ptabs__nav::-webkit-scrollbar {
  display: none;
}

.ptabs__tab {
  color: var(--muted);
  white-space: nowrap;
  padding: 14px 20px;
  font-size: .95rem;
  font-weight: 600;
  transition: color .15s;
  position: relative;
}

.ptabs__tab:hover {
  color: var(--ink);
}

.ptabs__tab.is-active {
  color: var(--red);
}

.ptabs__tab.is-active:after {
  content: "";
  background: var(--red);
  height: 2px;
  position: absolute;
  bottom: -2px;
  left: 0;
  right: 0;
}

.ptabs__panel {
  max-width: 820px;
}

.ptabs__prose p {
  color: var(--ink-2);
  margin-bottom: 16px;
  font-size: 1rem;
  line-height: 1.85;
}

.ptabs__empty {
  color: var(--muted);
  padding: 10px 0;
}

.ptabs__specs {
  border-collapse: collapse;
  width: 100%;
}

.ptabs__specs tr {
  border-bottom: 1px solid var(--line);
}

.ptabs__specs th {
  text-align: left;
  width: 200px;
  color: var(--muted);
  vertical-align: top;
  padding: 14px 16px 14px 0;
  font-weight: 600;
}

.ptabs__specs td {
  color: var(--ink);
  padding: 14px 0;
}

.catgrid2 {
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-bottom: 70px;
  display: grid;
}

.catcard2 {
  background: var(--card);
  border-radius: var(--r);
  align-items: center;
  gap: 20px;
  padding: 18px 22px 18px 24px;
  transition: box-shadow .2s, transform .2s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.catcard2:before {
  content: "";
  background: var(--accent, var(--red));
  width: 4px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}

.catcard2:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}

.catcard2__covers {
  flex-shrink: 0;
  width: 104px;
  height: 92px;
  position: relative;
}

.catcard2__cover, .catcard2__ph {
  aspect-ratio: 2 / 3;
  background: #fff;
  border-radius: 3px;
  width: 54px;
  transition: transform .25s;
  position: absolute;
  bottom: 0;
  overflow: hidden;
  box-shadow: 0 6px 14px -6px #0000008c;
}

.catcard2__cover img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.catcard2__ph {
  background: var(--card-2);
  left: 0;
}

.catcard2__cover:first-child {
  z-index: 1;
  left: 0;
  transform: rotate(-9deg);
}

.catcard2__cover:nth-child(2) {
  z-index: 3;
  left: 24px;
}

.catcard2__cover:nth-child(3) {
  z-index: 2;
  left: 48px;
  transform: rotate(9deg);
}

.catcard2:hover .catcard2__cover:first-child {
  transform: rotate(-13deg)translateX(-4px)translateY(-2px);
}

.catcard2:hover .catcard2__cover:nth-child(3) {
  transform: rotate(13deg)translateX(4px)translateY(-2px);
}

.catcard2__body {
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  display: flex;
}

.catcard2__name {
  color: var(--ink);
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.2;
  transition: color .15s;
}

.catcard2:hover .catcard2__name {
  color: var(--accent, var(--red));
}

.catcard2__count {
  color: var(--muted);
  align-items: center;
  gap: 5px;
  font-size: .85rem;
  font-weight: 600;
  display: inline-flex;
}

@media (max-width: 900px) {
  .catgrid2 {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 560px) {
  .catgrid2 {
    grid-template-columns: 1fr;
  }
}

.authorgrid2 {
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 70px;
  display: grid;
}

.acard {
  background: var(--card);
  border-radius: var(--r);
  align-items: center;
  gap: 16px;
  padding: 16px 18px;
  transition: box-shadow .2s, transform .2s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.acard:before {
  content: "";
  background: var(--accent, var(--red));
  width: 3px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}

.acard__media {
  flex-shrink: 0;
  place-items: center;
  width: 74px;
  height: 76px;
  display: grid;
  position: relative;
}

.acard__cover {
  aspect-ratio: 2 / 3;
  background: #fff;
  border-radius: 2px;
  width: 42px;
  transition: transform .25s;
  position: absolute;
  bottom: 4px;
  overflow: hidden;
  box-shadow: 0 5px 12px -5px #0000008c;
}

.acard__cover img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.acard__cover:first-child {
  z-index: 1;
  left: 1px;
  transform: rotate(-8deg);
}

.acard__cover:nth-child(2) {
  z-index: 3;
  left: 16px;
}

.acard__cover:nth-child(3) {
  z-index: 2;
  left: 31px;
  transform: rotate(8deg);
}

.acard:hover .acard__cover:first-child {
  transform: rotate(-12deg)translateX(-3px)translateY(-2px);
}

.acard:hover .acard__cover:nth-child(3) {
  transform: rotate(12deg)translateX(3px)translateY(-2px);
}

.acard__avatar {
  background: var(--accent, var(--red));
  color: #fff;
  width: 54px;
  height: 54px;
  font-family: var(--font-serif);
  border-radius: 999px;
  place-items: center;
  font-size: 1.25rem;
  font-style: italic;
  font-weight: 500;
  display: grid;
}

.acard__body {
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  display: flex;
}

.acard__name {
  color: var(--ink);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .95rem;
  font-weight: 700;
  line-height: 1.2;
  transition: color .15s;
  overflow: hidden;
}

.acard:hover .acard__name {
  color: var(--accent, var(--red));
}

.acard__count {
  color: var(--muted);
  align-items: center;
  gap: 4px;
  font-size: .8rem;
  font-weight: 600;
  display: inline-flex;
}

@media (max-width: 980px) {
  .authorgrid2 {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 680px) {
  .authorgrid2 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 440px) {
  .authorgrid2 {
    grid-template-columns: 1fr;
  }
}

.mobmenu-btn {
  color: var(--ink);
  padding: 8px 6px;
  display: none;
}

.mobdrawer-overlay {
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  background: #0000006b;
  transition: opacity .25s;
  position: fixed;
  inset: 0;
}

.mobdrawer-overlay.is-open {
  opacity: 1;
  visibility: visible;
}

.mobdrawer {
  z-index: 1000;
  visibility: hidden;
  background: #fff;
  flex-direction: column;
  width: min(86%, 340px);
  max-width: 340px;
  height: 100%;
  transition: transform .28s cubic-bezier(.16, 1, .3, 1), visibility .28s;
  display: flex;
  position: fixed;
  top: 0;
  right: 0;
  overflow-y: auto;
  transform: translateX(100%);
  box-shadow: -12px 0 44px -12px #00000059;
}

.mobdrawer.is-open {
  visibility: visible;
  transform: none;
}

.mobdrawer__head {
  border-bottom: 1px solid var(--line);
  justify-content: space-between;
  align-items: center;
  padding: 18px 20px;
  display: flex;
}

.mobdrawer__head .brand__name {
  font-size: 1.4rem;
  font-weight: 700;
}

.mobdrawer__head button {
  color: var(--ink);
  place-items: center;
  display: grid;
}

.mobdrawer__search {
  background: var(--card);
  border-radius: var(--pill);
  align-items: center;
  gap: 10px;
  height: 46px;
  margin: 16px 20px 8px;
  padding: 0 16px;
  display: flex;
}

.mobdrawer__search svg {
  color: var(--muted);
  flex-shrink: 0;
}

.mobdrawer__search input {
  width: 100%;
  font: inherit;
  color: var(--ink);
  background: none;
  border: none;
  outline: none;
  font-size: .95rem;
}

.mobdrawer__nav {
  flex-direction: column;
  padding: 8px 12px;
  display: flex;
}

.mobdrawer__nav a {
  color: var(--ink);
  border-radius: 10px;
  padding: 14px 12px;
  font-size: 1.02rem;
  font-weight: 600;
}

.mobdrawer__nav a.is-active {
  color: var(--red);
  background: var(--red-tint);
}

.mobdrawer__foot {
  border-top: 1px solid var(--line);
  color: var(--muted);
  flex-direction: column;
  gap: 8px;
  margin-top: auto;
  padding: 20px;
  font-size: .9rem;
  display: flex;
}

.mobdrawer__foot a:hover {
  color: var(--red);
}

@media (max-width: 900px) {
  .mobmenu-btn {
    display: inline-flex;
  }

  .mainnav {
    display: none;
  }

  .hide-mobile {
    display: none !important;
  }

  .site-header__main {
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    height: 64px;
    display: flex;
  }

  .header-actions {
    gap: 2px;
    margin-left: auto;
  }

  .brand__name {
    font-size: 1.35rem;
  }
}

@media (max-width: 600px) {
  .topbar .container {
    height: auto;
    padding: 7px 0;
  }

  .topbar span {
    font-size: .72rem;
    line-height: 1.35;
  }
}

@media (max-width: 860px) {
  .hslider {
    padding: 16px 0 4px;
  }

  .hslider__viewport {
    border-radius: 16px;
    min-height: 0;
  }

  .hslide {
    text-align: center;
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 24px 22px 30px;
  }

  .hslide__text {
    order: 2;
    max-width: none;
  }

  .hslide__media {
    order: 1;
    justify-content: center;
    max-width: none;
    display: flex;
  }

  .hslide__frame {
    width: auto;
  }

  .hslide__cover {
    width: 150px;
    transform: rotate(-2deg);
  }

  .hslide__tag {
    padding: 8px 11px;
    top: -8px;
    right: -6px;
  }

  .hslide__tag b {
    font-size: .95rem;
  }

  .hslide__title {
    margin: 8px 0 12px;
    font-size: clamp(1.6rem, 7vw, 2.2rem);
  }

  .hslide__lead {
    font-size: .96rem;
  }

  .hslide__cta {
    justify-content: center;
  }

  .hslider__nav {
    display: none;
  }
}

@media (max-width: 760px) {
  .container {
    padding: 0 18px;
  }

  .section {
    padding: 44px 0;
  }

  .section--void {
    border-radius: 0;
    max-width: none;
    margin: 14px 0;
    padding: 44px 0;
  }

  .section__title {
    font-size: 1.4rem;
  }

  .section__head {
    margin-bottom: 26px;
  }

  .manifesto .container {
    padding: 48px 18px;
  }

  .catalog__title {
    font-size: 1.55rem;
  }

  .pdp__title {
    font-size: 1.5rem;
  }

  .pdp__now {
    font-size: 1.6rem;
  }

  .ptabs__specs th {
    width: 130px;
    padding-right: 12px;
  }

  .comingsoon {
    padding: 24px 18px;
  }

  .weekbook__related a {
    width: 54px;
  }
}

@media (max-width: 560px) {
  .spineshelf {
    gap: 8px;
  }

  .spineshelf .spine {
    width: 46px;
  }

  .spine span {
    max-height: 180px;
    font-size: .82rem;
  }

  .spine:nth-child(6n+1) {
    height: 224px;
  }

  .spine:nth-child(6n+2) {
    height: 212px;
  }

  .spine:nth-child(6n+3) {
    height: 230px;
  }

  .spine:nth-child(6n+4) {
    height: 206px;
  }

  .spine:nth-child(6n+5) {
    height: 222px;
  }

  .spine:nth-child(6n+6) {
    height: 214px;
  }
}

body {
  overflow-x: hidden;
}

.brand__logo {
  width: auto;
  height: 56px;
  display: block;
}

.mobdrawer__head .brand__logo {
  height: 40px;
}

@media (max-width: 900px) {
  .brand__logo {
    height: 42px;
  }
}

.pager {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin: 6px 0 70px;
  display: flex;
}

.pager__btn, .pager__num {
  border: 1.5px solid var(--line-2);
  min-width: 42px;
  height: 42px;
  color: var(--ink);
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  padding: 0 12px;
  font-size: .92rem;
  font-weight: 600;
  transition: all .15s;
  display: inline-flex;
}

.pager__btn:hover:not(:disabled), .pager__num:hover {
  border-color: var(--red);
  color: var(--red);
}

.pager__btn:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.pager__num.is-active {
  background: var(--red);
  border-color: var(--red);
  color: #fff;
}

.pager__dots {
  color: var(--muted);
  padding: 0 2px;
}

@media (max-width: 680px) {
  html, body {
    overflow-x: hidden;
  }

  .section .book-grid:not(.book-grid--catalog) {
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    flex-wrap: nowrap;
    gap: 12px;
    margin: 0 -18px;
    padding: 2px 18px 8px;
    display: flex;
    overflow-x: auto;
  }

  .section .book-grid:not(.book-grid--catalog)::-webkit-scrollbar {
    display: none;
  }

  .section .book-grid:not(.book-grid--catalog) > .book {
    scroll-snap-align: start;
    flex: 0 0 46%;
  }

  .authorgrid2 {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }

  .acard {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 14px;
  }

  .acard__media {
    width: 100%;
    height: 70px;
  }

  .acard__cover {
    bottom: 0;
  }

  .acard__cover:first-child {
    left: 6px;
  }

  .acard__cover:nth-child(2) {
    left: 22px;
  }

  .acard__cover:nth-child(3) {
    left: 38px;
  }

  .acard__name {
    white-space: normal;
  }

  .series__stack {
    height: 150px;
  }

  .series__cover {
    width: 78px;
  }

  .blogpost--row {
    grid-template-columns: 88px 1fr;
    gap: 12px;
  }

  .blogpost--feature b {
    font-size: 1.1rem;
  }

  .comingsoon {
    grid-template-columns: 1fr;
  }

  .spineshelf {
    scrollbar-width: none;
    border-left: none;
    flex-wrap: nowrap;
    justify-content: flex-start;
    margin: 0 -18px;
    padding: 4px 18px 8px;
    overflow-x: auto;
  }

  .spineshelf::-webkit-scrollbar {
    display: none;
  }

  .spineshelf:after {
    display: none;
  }

  .section {
    padding: 38px 0;
  }

  .section--void {
    padding: 40px 0;
  }

  .section__title {
    font-size: 1.3rem;
  }
}

.footer-credit {
  letter-spacing: .08em;
  color: var(--red);
  font-weight: 700;
}

:root[data-theme="dark"] {
  --bg: #0f1114;
  --card: #1a1c21;
  --card-2: #24272d;
  --dark: #16181d;
  --ink: #ecedf0;
  --ink-2: #b6bbc2;
  --muted: #868c95;
  --line: #2a2e35;
  --line-2: #373c44;
  --red: #e35d5d;
  --red-2: #c94242;
  --red-tint: #e35d5d29;
  --shadow-sm: 0 2px 10px #00000073;
  --shadow-md: 0 12px 34px -14px #000000a6;
}

:root[data-theme="dark"] .btn--light {
  background: var(--card-2);
  color: var(--ink);
}

:root[data-theme="dark"] .searchbar:focus-within, :root[data-theme="dark"] .authorsearch:focus-within {
  background: var(--card-2);
}

:root[data-theme="dark"] .catindex a {
  background: var(--card);
}

:root[data-theme="dark"] .book__fav {
  background: var(--card-2);
  color: var(--ink);
}

:root[data-theme="dark"] .footer-social a {
  background: var(--card-2);
}

:root[data-theme="dark"] .contact__form input, :root[data-theme="dark"] .contact__form textarea {
  background: var(--card-2);
  color: var(--ink);
}

:root[data-theme="dark"] .mobdrawer {
  background: var(--card);
}

:root[data-theme="dark"] .site-header {
  background: #0f1114e6;
}

:root[data-theme="dark"] .hslider__arrow {
  color: var(--ink);
  background: #ffffff14;
  border-color: #ffffff2e;
}

:root[data-theme="dark"] .hslider__arrow:hover {
  color: var(--red);
  background: #ffffff26;
}

:root[data-theme="dark"] .section--void {
  background: var(--card);
}

:root[data-theme="dark"] .site-footer {
  background: var(--card);
  border-top-color: var(--line);
}

:root[data-theme="dark"] .hslide--brand {
  background: radial-gradient(120% 140% at 85% 10%, #241633 0%, #1a1622 50%, #16181d 100%);
}

:root[data-theme="dark"] .hslide--spotlight {
  background: radial-gradient(120% 140% at 85% 10%, #182339 0%, #171c27 50%, #16181d 100%);
}

:root[data-theme="dark"] .hslide--campaign {
  background: radial-gradient(120% 140% at 85% 10%, #251b39 0%, #1a1826 50%, #16181d 100%);
}

:root[data-theme="dark"] .book__cover, :root[data-theme="dark"] .hslide__cover, :root[data-theme="dark"] .catcard2__cover, :root[data-theme="dark"] .acard__cover, :root[data-theme="dark"] .rank__cover {
  background: var(--card-2);
}

:root[data-theme="dark"] .brand__logo {
  border-radius: 8px;
}

:root[data-theme="dark"] .book__stars {
  color: #3a3d44;
}

@media (max-width: 680px) {
  .catindex {
    padding: 14px 0 2px;
  }

  .catindex .container {
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap;
    gap: 10px;
    padding-bottom: 6px;
    overflow-x: auto;
  }

  .catindex .container::-webkit-scrollbar {
    display: none;
  }

  .catindex a {
    white-space: nowrap;
    border-radius: 10px 16px 16px 10px;
    flex: none;
    padding: 9px 18px;
    font-size: .85rem;
  }
}

.yktop {
  background: var(--card);
  color: var(--ink-2);
  border-bottom: 1px solid var(--line);
  font-size: .8rem;
}

.yktop__in {
  justify-content: space-between;
  align-items: center;
  height: 40px;
  display: flex;
}

.yktop__social {
  align-items: center;
  gap: 12px;
  display: flex;
}

.yktop__social a {
  color: var(--muted);
  align-items: center;
  gap: 6px;
  transition: color .15s;
  display: inline-flex;
}

.yktop__social a:hover {
  color: var(--red);
}

.yktop__mail {
  border-left: 1px solid var(--line-2);
  color: var(--ink-2);
  margin-left: 4px;
  padding-left: 14px;
  font-weight: 500;
}

.yktop__links {
  align-items: center;
  gap: 20px;
  display: flex;
}

.yktop__links a {
  color: var(--ink-2);
  align-items: center;
  gap: 6px;
  font-weight: 500;
  transition: color .15s;
  display: inline-flex;
}

.yktop__links a:hover {
  color: var(--red);
}

.yktop .themetoggle {
  color: var(--ink-2);
  padding: 4px;
}

.yktop .themetoggle:hover {
  color: var(--red);
  background: var(--card-2);
}

.ykmid {
  background: var(--bg);
  border-bottom: 1px solid var(--line);
}

.ykmid__in {
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 30px;
  padding: 16px 0;
  display: grid;
}

.ykmid .brand__logo {
  height: 60px;
}

.yksearch {
  justify-self: center;
  width: 100%;
  max-width: 620px;
  height: 46px;
  display: flex;
}

.yksearch__field {
  flex: 1;
  display: flex;
  position: relative;
}

.yksearch input {
  border: 2px solid var(--red);
  border-radius: var(--r) 0 0 var(--r);
  width: 100%;
  font: inherit;
  background: var(--bg);
  color: var(--ink);
  border-right: none;
  outline: none;
  padding: 0 18px;
  font-size: .95rem;
}

.yksearch > button {
  background: var(--red);
  color: #fff;
  border-radius: 0 var(--r) var(--r) 0;
  place-items: center;
  width: 54px;
  display: grid;
}

.yksearch > button:hover {
  background: var(--red-2);
}

.yksug {
  z-index: 60;
  background: var(--bg);
  border: 1px solid var(--line-2);
  border-radius: var(--r);
  max-height: min(70vh, 520px);
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  overflow: hidden auto;
  box-shadow: 0 12px 34px #0000002e;
}

.yksug__item {
  color: var(--ink);
  border-bottom: 1px solid var(--line);
  align-items: center;
  gap: 12px;
  padding: 9px 14px;
  display: flex;
}

.yksug__item:last-of-type {
  border-bottom: none;
}

.yksug__item.is-active, .yksug__item:hover {
  background: var(--red);
  color: #fff;
}

.yksug__item.is-active .yksug__meta, .yksug__item:hover .yksug__meta {
  color: #fffc;
}

.yksug__cover {
  object-fit: cover;
  background: var(--line);
  border-radius: 3px;
  flex: none;
  width: 34px;
  height: 48px;
}

.yksug__cover--empty {
  display: block;
}

.yksug__body {
  flex-direction: column;
  flex: 1;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.yksug__title {
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  font-size: .9rem;
  font-weight: 600;
  line-height: 1.25;
  display: -webkit-box;
  overflow: hidden;
}

.yksug__title mark {
  color: var(--red);
  background: none;
  font-weight: 800;
}

.yksug__item.is-active .yksug__title mark, .yksug__item:hover .yksug__title mark {
  color: #fff;
  text-decoration: underline;
}

.yksug__meta {
  color: var(--muted);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .76rem;
  overflow: hidden;
}

.yksug__price {
  white-space: nowrap;
  flex: none;
  font-size: .85rem;
  font-weight: 700;
}

.yksug__empty {
  color: var(--muted);
  align-items: center;
  gap: 8px;
  padding: 16px 14px;
  font-size: .88rem;
  display: flex;
}

.yksug__spin {
  animation: .8s linear infinite yksug-spin;
}

@keyframes yksug-spin {
  to {
    transform: rotate(360deg);
  }
}

.yksug__all {
  text-align: left;
  background: var(--bg-2, var(--bg));
  width: 100%;
  color: var(--red);
  border-top: 1px solid var(--line-2);
  cursor: pointer;
  padding: 11px 14px;
  font-size: .85rem;
  font-weight: 700;
  display: block;
}

.yksug__all:hover {
  background: var(--red);
  color: #fff;
}

.ykmid__right {
  align-items: center;
  gap: 8px;
  display: flex;
}

.ykcart {
  border: 1px solid var(--line-2);
  border-radius: var(--r);
  color: var(--ink);
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  display: inline-flex;
}

.ykcart:hover {
  border-color: var(--red);
  color: var(--red);
}

.ykcart__txt {
  flex-direction: column;
  line-height: 1.1;
  display: flex;
}

.ykcart__txt b {
  font-size: .9rem;
}

.ykcart__txt i {
  color: var(--muted);
  font-size: .72rem;
  font-style: normal;
}

.ykheader {
  border-bottom: 1px solid var(--line);
}

.ykheader .mainnav {
  background: #ececec;
  border-top: none;
}

.ykheader .mainnav .container {
  justify-content: center;
  gap: 0;
  height: 48px;
}

.ykheader .mainnav a {
  color: #333;
  height: 48px;
  font-family: var(--font-sans);
  text-transform: uppercase;
  letter-spacing: .02em;
  border-radius: 0;
  align-items: center;
  padding: 0 20px;
  font-size: .82rem;
  font-weight: 600;
  display: inline-flex;
  position: relative;
}

.ykheader .mainnav a:after {
  content: "";
  background: var(--red);
  height: 3px;
  transition: transform .16s;
  position: absolute;
  bottom: 0;
  left: 20px;
  right: 20px;
  transform: scaleX(0);
}

.ykheader .mainnav a:hover {
  color: var(--red);
}

.ykheader .mainnav a:hover:after, .ykheader .mainnav a.is-active:after {
  transform: scaleX(1);
}

.ykheader .mainnav a.is-active {
  color: var(--red);
}

:root[data-theme="dark"] .ykheader .mainnav {
  background: #1c1726;
}

:root[data-theme="dark"] .ykheader .mainnav a {
  color: #cfc6da;
}

:root[data-theme="dark"] .ykheader .mainnav a:hover, :root[data-theme="dark"] .ykheader .mainnav a.is-active {
  color: var(--red);
}

.homeBannerSec {
  grid-template-columns: 1fr 316px;
  align-items: stretch;
  gap: 20px;
  padding-top: 22px;
  display: grid;
}

.homeBannerSec__main {
  min-width: 0;
}

.homeBannerSec__main .hslider {
  height: 100%;
}

.homeBannerSec__side {
  min-width: 0;
  padding: 24px 0 33px;
}

.sideSlider {
  border-radius: var(--r);
  height: 100%;
  min-height: 340px;
  position: relative;
  overflow: hidden;
}

.sideSlide {
  color: #fff;
  opacity: 0;
  visibility: hidden;
  flex-direction: column;
  justify-content: center;
  padding: 30px 26px 46px;
  transition: opacity .5s;
  display: flex;
  position: absolute;
  inset: 0;
}

.sideSlide.is-active {
  opacity: 1;
  visibility: visible;
}

.sideSlide--authors {
  background: linear-gradient(150deg, var(--red), var(--red-2));
}

.sideSlide--sale {
  background: linear-gradient(150deg, #2a1a1a, var(--dark));
}

.sideSlide--cats {
  background: linear-gradient(150deg, #d64b4b, var(--red));
}

.sideSlide:after {
  content: "";
  border: 2px solid #ffffff24;
  border-radius: 50%;
  width: 150px;
  height: 150px;
  position: absolute;
  top: -40px;
  right: -40px;
}

.sideSlide small {
  letter-spacing: .12em;
  text-transform: uppercase;
  opacity: .85;
  font-size: .74rem;
}

.sideSlide b {
  font-family: var(--font-serif);
  margin: 8px 0 10px;
  font-size: 2.4rem;
  line-height: 1.02;
  display: block;
}

.sideSlide__sub {
  opacity: .92;
  max-width: 15em;
  font-size: .92rem;
  line-height: 1.4;
}

.sideSlide__cta {
  color: var(--ink);
  border-radius: var(--pill);
  background: #fff;
  align-self: flex-start;
  align-items: center;
  gap: 6px;
  margin-top: 20px;
  padding: 9px 16px;
  font-size: .8rem;
  font-weight: 700;
  display: inline-flex;
}

.sideSlide--sale .sideSlide__cta {
  color: var(--dark);
}

.sideSlider__dots {
  z-index: 3;
  gap: 7px;
  display: flex;
  position: absolute;
  bottom: 20px;
  left: 26px;
}

.sideSlider__dots button {
  background: #fff6;
  border-radius: 50%;
  width: 8px;
  height: 8px;
  transition: all .2s;
}

.sideSlider__dots button.is-active {
  background: #fff;
  border-radius: 4px;
  width: 22px;
}

.ykpage {
  grid-template-columns: 236px 1fr;
  align-items: start;
  gap: 32px;
  padding-top: 40px;
  padding-bottom: 60px;
  display: grid;
}

.ykmain {
  min-width: 0;
}

.ykside {
  align-self: start;
}

.ykside__head {
  background: var(--red);
  color: #fff;
  letter-spacing: .01em;
  border-radius: var(--r) var(--r) 0 0;
  justify-content: space-between;
  align-items: center;
  padding: 13px 16px;
  font-size: .98rem;
  font-weight: 700;
  display: flex;
}

.ykside__head:after {
  content: "☰";
  opacity: .85;
  font-size: 1rem;
}

.ykside__list {
  border: 1px solid var(--line);
  border-radius: 0 0 var(--r) var(--r);
  border-top: none;
  overflow: hidden;
}

.ykside__list li + li {
  border-top: 1px solid var(--line);
}

.ykside__list a {
  color: var(--ink-2);
  padding: 10px 16px;
  font-size: .88rem;
  transition: background .12s, color .12s, padding .12s;
  display: block;
}

.ykside__list a:hover {
  background: var(--red-tint);
  color: var(--red);
  padding-left: 22px;
}

.ykside__promo {
  border-radius: var(--r);
  color: #fff;
  margin-top: 18px;
  padding: 22px 20px;
  display: block;
  position: relative;
  overflow: hidden;
}

.ykside__promo--authors {
  background: linear-gradient(150deg, var(--red), var(--red-2));
}

.ykside__promo--sale {
  background: linear-gradient(150deg, #2a1a1a, var(--dark));
}

.ykside__promo span {
  letter-spacing: .1em;
  text-transform: uppercase;
  opacity: .82;
  font-size: .7rem;
}

.ykside__promo b {
  font-family: var(--font-serif);
  margin-top: 5px;
  font-size: 1.5rem;
  line-height: 1.15;
  display: block;
}

.ykside__promo i {
  opacity: .9;
  margin-top: 4px;
  font-size: .85rem;
  font-style: normal;
  display: block;
}

.yksec {
  margin-bottom: 46px;
}

.yksec__head {
  border-bottom: 1px solid var(--line);
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 24px;
  padding-bottom: 10px;
  display: flex;
}

.yksec__head h2 {
  font-family: var(--font-sans);
  color: #6a6a6a;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 1.4rem;
  font-weight: 400;
}

.yksec__head a {
  color: var(--red);
  align-items: center;
  gap: 3px;
  font-size: .82rem;
  font-weight: 600;
  display: inline-flex;
}

.ykgrid {
  grid-template-columns: repeat(4, 1fr);
  gap: 28px 22px;
  display: grid;
}

.ykcard {
  text-align: center;
  flex-direction: column;
  display: flex;
}

.ykcard__cover {
  aspect-ratio: 2 / 3;
  margin-bottom: 14px;
  display: block;
  position: relative;
  overflow: hidden;
}

.ykcard__cover img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  transition: transform .25s;
}

.ykcard__cover:hover img {
  transform: scale(1.03);
}

.ykcard__ribbon {
  z-index: 3;
  pointer-events: none;
  width: 120px;
  height: 120px;
  display: block;
  position: absolute;
  top: -5px;
  right: -5px;
  overflow: hidden;
}

.ykcard__ribbon > span {
  text-align: center;
  color: #fff;
  letter-spacing: .06em;
  text-transform: uppercase;
  transform-origin: 70px 10px;
  background-image: linear-gradient(#d23b3b 0%, #5c1414 100%);
  width: 140px;
  height: 20px;
  font-size: 10px;
  font-weight: 700;
  line-height: 20px;
  position: absolute;
  top: 32px;
  right: -28px;
  transform: rotate(45deg);
  box-shadow: 0 3px 10px -5px #000;
}

.ykcard__title {
  font-family: var(--font-sans);
  letter-spacing: -.01em;
  color: var(--ink);
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  min-height: 2.4em;
  font-size: .94rem;
  font-weight: 700;
  line-height: 1.3;
  display: -webkit-box;
  overflow: hidden;
}

.ykcard__cover:hover + .ykcard__title, .ykcard__title a:hover {
  color: var(--red);
}

.ykcard__author {
  color: #b07a2e;
  margin: 5px 0 9px;
  font-size: .82rem;
}

.ykcard__price {
  justify-content: center;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 13px;
  display: flex;
}

.ykcard__price .now {
  color: var(--red);
  font-size: 1.25rem;
  font-weight: 800;
}

.ykcard__price .was {
  color: var(--muted);
  font-size: .8rem;
  text-decoration: line-through;
}

.ykcard__soldout {
  color: var(--muted);
  margin-bottom: 12px;
  font-size: .82rem;
  font-weight: 600;
}

.ykcard__cart {
  background: var(--dark);
  color: #fff;
  border-radius: var(--r);
  justify-content: center;
  align-items: center;
  gap: 7px;
  margin-top: auto;
  padding: 9px 12px;
  font-size: .82rem;
  font-weight: 600;
  transition: background .15s;
  display: inline-flex;
}

.ykcard__cart:hover {
  background: var(--red);
}

@media (max-width: 1040px) {
  .ykgrid {
    grid-template-columns: repeat(3, 1fr);
  }

  .homeBannerSec {
    grid-template-columns: 1fr 260px;
  }
}

@media (max-width: 900px) {
  .ykmid__in {
    grid-template-columns: auto 1fr auto;
    grid-template-areas: "logo . right"
                         "search search search";
    gap: 12px;
    padding: 12px 0;
  }

  .ykmid .brand {
    grid-area: logo;
  }

  .ykmid__right {
    grid-area: right;
  }

  .yksearch {
    grid-area: search;
    justify-self: stretch;
    width: 100%;
    max-width: none;
    height: 44px;
    display: flex;
  }

  .ykcart__txt {
    display: none;
  }

  .ykmid .brand__logo {
    height: 44px;
  }

  .ykheader {
    display: none;
  }

  .homeBannerSec {
    grid-template-columns: 1fr;
    padding-top: 14px;
  }

  .homeBannerSec__main .hslider {
    height: auto;
  }

  .homeBannerSec__side {
    display: none;
  }

  .ykpage {
    grid-template-columns: 1fr;
    gap: 0;
    padding-top: 26px;
  }

  .ykside, .yktop__social a:not(.yktop__mail) {
    display: none;
  }

  .yktop__mail {
    border-left: none;
    margin-left: 0;
    padding-left: 0;
  }
}

@media (max-width: 560px) {
  .ykgrid {
    grid-template-columns: repeat(2, 1fr);
    gap: 26px 14px;
  }

  .yktop {
    font-size: .72rem;
  }

  .yktop__in {
    gap: 10px;
  }

  .yktop__mail {
    display: none;
  }

  .yksec {
    margin-bottom: 34px;
  }

  .yksec__head h2 {
    font-size: 1.15rem;
  }

  .widhtBanner {
    padding: 18px;
  }
}

@media (max-width: 380px) {
  .ykcard__cart {
    gap: 5px;
    padding: 8px;
    font-size: .76rem;
  }

  .ykcard__title {
    font-size: .88rem;
  }
}

.sideBanner {
  border-radius: var(--r);
  color: #fff;
  text-align: left;
  flex-direction: column;
  justify-content: center;
  min-height: 120px;
  padding: 24px 22px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.sideBanner--authors {
  background: linear-gradient(140deg, var(--red), var(--red-2));
}

.sideBanner--sale {
  background: linear-gradient(140deg, #2a1a1a, var(--dark));
}

.sideBanner small {
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: .82;
  font-size: .72rem;
}

.sideBanner b {
  font-family: var(--font-serif);
  margin: 6px 0 4px;
  font-size: 1.9rem;
  line-height: 1;
  display: block;
}

.sideBanner span {
  opacity: .9;
  font-size: .85rem;
}

.sideBanner:after {
  content: "";
  border: 2px solid #ffffff29;
  border-radius: 50%;
  width: 110px;
  height: 110px;
  position: absolute;
  bottom: -30px;
  right: -30px;
}

.widhtBanner {
  border-radius: var(--r);
  color: #fff;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 40px;
  padding: 22px 28px;
  display: flex;
}

.widhtBanner--purple {
  background: linear-gradient(120deg, var(--red), var(--red-2));
}

.widhtBanner--dark {
  background: linear-gradient(120deg, #2a1a1a, var(--dark));
}

.widhtBanner__text small {
  letter-spacing: .1em;
  text-transform: uppercase;
  opacity: .85;
  font-size: .74rem;
}

.widhtBanner__text b {
  font-family: var(--font-serif);
  margin-top: 3px;
  font-size: 1.4rem;
  line-height: 1.15;
  display: block;
}

.widhtBanner__cta {
  white-space: nowrap;
  color: var(--ink);
  border-radius: var(--pill);
  background: #fff;
  align-items: center;
  gap: 8px;
  padding: 11px 20px;
  font-size: .86rem;
  font-weight: 700;
  display: inline-flex;
}

.widhtBanner--dark .widhtBanner__cta {
  color: var(--dark);
}

@media (max-width: 640px) {
  .widhtBanner {
    text-align: left;
    flex-direction: column;
    align-items: flex-start;
    padding: 20px;
  }

  .widhtBanner__text b {
    font-size: 1.15rem;
  }
}

@keyframes orion-spin {
  to {
    transform: rotate(360deg);
  }
}

.spin {
  animation: .7s linear infinite orion-spin;
}

.field {
  flex-direction: column;
  gap: 6px;
  display: flex;
}

.field__label {
  color: var(--ink-2);
  font-size: .82rem;
  font-weight: 600;
}

.field__input {
  width: 100%;
  font: inherit;
  color: var(--ink);
  background: var(--card);
  border: 1.5px solid var(--line-2);
  border-radius: var(--r-sm);
  padding: 11px 14px;
  transition: border-color .15s, box-shadow .15s;
}

.field__input:focus {
  border-color: var(--red);
  box-shadow: 0 0 0 3px var(--red-tint);
  outline: none;
}

textarea.field__input {
  resize: vertical;
  min-height: 52px;
}

.field__hint {
  color: var(--muted);
  font-size: .76rem;
}

.field__err {
  color: #d33;
  font-size: .78rem;
  font-weight: 500;
}

.field__static {
  color: var(--ink-2);
  background: var(--card-2);
  border-radius: var(--r-sm);
  padding: 11px 14px;
  font-size: .9rem;
}

.formgrid {
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  display: grid;
}

.field--full {
  grid-column: 1 / -1;
}

.btn--sm {
  padding: 9px 16px;
  font-size: .82rem;
}

.authpage {
  place-items: center;
  min-height: 60vh;
  padding: 48px 24px;
  display: grid;
}

.authcard {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r);
  width: 100%;
  max-width: 420px;
  box-shadow: var(--shadow-md);
  padding: 34px 30px;
}

.authcard__title {
  margin-bottom: 6px;
  font-size: 1.7rem;
}

.authcard__sub {
  color: var(--muted);
  margin-bottom: 22px;
  font-size: .9rem;
}

.authform {
  flex-direction: column;
  gap: 16px;
  display: flex;
}

.authform__error {
  color: #d33;
  border-radius: var(--r-sm);
  background: #d333331a;
  border: 1px solid #d333334d;
  padding: 10px 14px;
  font-size: .85rem;
}

.authform__note {
  background: var(--red-tint);
  color: var(--red-2);
  border: 1px solid var(--red-tint);
  border-radius: var(--r-sm);
  padding: 10px 14px;
  font-size: .85rem;
}

.authform__row {
  justify-content: flex-end;
  margin-top: -6px;
  display: flex;
}

.authform__link {
  color: var(--red);
  font-size: .83rem;
}

.authform__link:hover {
  text-decoration: underline;
}

.authform__submit, .authform .btn {
  justify-content: center;
  width: 100%;
}

.authform__foot {
  text-align: center;
  color: var(--muted);
  margin-top: 4px;
  font-size: .86rem;
}

.authform__foot a {
  color: var(--red);
  font-weight: 600;
}

.authform__foot a:hover {
  text-decoration: underline;
}

button[aria-busy="true"] {
  opacity: .7;
  cursor: progress;
}

.yktop__acc {
  color: var(--ink);
  align-items: center;
  gap: 6px;
  font-weight: 600;
  display: inline-flex;
}

.yktop__acc svg, .yktop__acc:hover {
  color: var(--red);
}

.ykcart__ic {
  display: inline-flex;
  position: relative;
}

.ykcart__badge {
  background: var(--red);
  color: #fff;
  border-radius: var(--pill);
  place-items: center;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  font-size: .66rem;
  font-weight: 700;
  line-height: 1;
  display: grid;
  position: absolute;
  top: -7px;
  right: -8px;
}

.cartpage {
  min-height: 50vh;
  padding: 30px 24px 60px;
}

.cartpage__title {
  margin-bottom: 22px;
  font-size: 1.7rem;
}

.cartpage__title span {
  color: var(--muted);
  font-size: 1rem;
  font-family: var(--font-sans);
}

.cart-empty {
  text-align: center;
  color: var(--muted);
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 70px 20px;
  display: flex;
}

.cart-empty svg {
  color: var(--line-2);
}

.cart-empty h1 {
  color: var(--ink);
  font-size: 1.5rem;
}

.cart-empty .btn {
  margin-top: 8px;
}

.cartlayout {
  grid-template-columns: 1fr 340px;
  align-items: start;
  gap: 28px;
  display: grid;
}

.cartlist {
  flex-direction: column;
  gap: 14px;
  display: flex;
}

.cartline {
  background: var(--bg);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
  transition: box-shadow .35s var(--ease-out), transform .35s var(--ease-out), border-color .2s;
  border-radius: 14px;
  grid-template-columns: 84px 1fr auto;
  align-items: start;
  gap: 18px;
  padding: 18px;
  display: grid;
}

.cartline:hover {
  box-shadow: var(--shadow-md);
  border-color: var(--line-2);
  transform: translateY(-2px);
}

.cartline__cover img {
  object-fit: cover;
  border-radius: 8px;
  width: 84px;
  height: 118px;
  box-shadow: 0 6px 16px -6px #16121c47;
}

.cartline__body {
  flex-direction: column;
  gap: 8px;
  display: flex;
}

.cartline__title {
  font-size: .98rem;
  font-weight: 600;
  line-height: 1.3;
}

.cartline__title a:hover {
  color: var(--red);
}

.cartline__price {
  align-items: baseline;
  gap: 8px;
  display: flex;
}

.cartline__price .was, .favitem__price .was {
  color: var(--muted);
  font-size: .82rem;
  text-decoration: line-through;
}

.cartline__price .now, .favitem__price .now {
  color: var(--red);
  font-weight: 700;
}

.cartline__controls {
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  margin-top: 4px;
  display: flex;
}

.qtybox {
  border: 1.5px solid var(--line-2);
  border-radius: var(--pill);
  align-items: center;
  display: inline-flex;
  overflow: hidden;
}

.qtybox button {
  width: 32px;
  height: 32px;
  color: var(--ink-2);
  place-items: center;
  transition: background .15s;
  display: grid;
}

.qtybox button:hover:not(:disabled) {
  background: var(--card-2);
  color: var(--red);
}

.qtybox button:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.qtybox span {
  text-align: center;
  min-width: 32px;
  font-size: .9rem;
  font-weight: 600;
}

.cartline__remove {
  color: var(--muted);
  align-items: center;
  gap: 5px;
  font-size: .82rem;
  display: inline-flex;
}

.cartline__remove:hover {
  color: #d33;
}

.cartline__total {
  white-space: nowrap;
  font-size: 1.02rem;
  font-weight: 700;
}

.cartsum, .checkout__aside {
  background: var(--bg);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-md);
  border-radius: 16px;
  padding: 24px;
  position: sticky;
  top: 20px;
}

.cartsum__title {
  margin-bottom: 16px;
  font-size: 1.1rem;
  font-weight: 700;
}

.cartsum__rows {
  border-top: 1px solid var(--line);
  flex-direction: column;
  gap: 10px;
  padding: 14px 0;
  display: flex;
}

.cartsum__rows > div {
  color: var(--ink-2);
  justify-content: space-between;
  font-size: .9rem;
  display: flex;
}

.cartsum__disc dd {
  color: #2a9d5c;
  font-weight: 600;
}

.cartsum__grand {
  border-top: 1px solid var(--line);
  justify-content: space-between;
  align-items: baseline;
  padding-top: 14px;
  display: flex;
}

.cartsum__grand span {
  font-weight: 600;
}

.cartsum__grand b {
  color: var(--red);
  font-size: 1.5rem;
  font-family: var(--font-sans);
  letter-spacing: -.02em;
  font-weight: 800;
}

.cartsum__cta {
  justify-content: center;
  width: 100%;
  margin-top: 16px;
}

.cartsum__assure {
  flex-direction: column;
  gap: 8px;
  margin-top: 16px;
  display: flex;
}

.cartsum__assure li {
  color: var(--muted);
  align-items: center;
  gap: 8px;
  font-size: .8rem;
  display: flex;
}

.cartsum__assure svg {
  color: var(--red);
}

.cartsum__cont {
  text-align: center;
  color: var(--muted);
  margin-top: 14px;
  font-size: .84rem;
  display: block;
}

.cartsum__cont:hover {
  color: var(--red);
}

.checkout {
  padding: 30px 24px 60px;
}

.checkout__title {
  margin-bottom: 8px;
  font-size: 1.7rem;
}

.checkout__guest {
  color: var(--muted);
  margin-bottom: 22px;
  font-size: .9rem;
}

.checkout__guest a {
  color: var(--red);
  font-weight: 600;
}

.checkout__layout {
  grid-template-columns: 1fr 360px;
  align-items: start;
  gap: 28px;
  display: grid;
}

.checkout__form {
  flex-direction: column;
  gap: 18px;
  display: flex;
}

.checkout__legend {
  font-size: 1.05rem;
  font-weight: 700;
}

.checkout__saved {
  flex-direction: column;
  gap: 10px;
  display: flex;
}

.checkout__savedlist {
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
  display: grid;
}

.checkout__savedcard {
  text-align: left;
  border: 1.5px solid var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink-2);
  flex-direction: column;
  gap: 2px;
  padding: 12px 14px;
  font-size: .82rem;
  transition: border-color .15s;
  display: flex;
}

.checkout__savedcard:hover {
  border-color: var(--red);
}

.checkout__savedcard b {
  color: var(--ink);
  font-size: .88rem;
}

.checkout__savedline {
  color: var(--muted);
}

.checkout__check {
  color: var(--ink-2);
  cursor: pointer;
  align-items: center;
  gap: 9px;
  font-size: .88rem;
  display: flex;
}

.checkout__check input {
  width: 16px;
  height: 16px;
  accent-color: var(--red);
}

.checkout__submit {
  justify-content: center;
  width: 100%;
  margin-top: 6px;
}

.checkout__items {
  border-bottom: 1px solid var(--line);
  flex-direction: column;
  gap: 10px;
  margin-bottom: 4px;
  padding-bottom: 14px;
  display: flex;
}

.checkout__items li, .orderconf__items li {
  grid-template-columns: auto 1fr auto;
  align-items: baseline;
  gap: 8px;
  font-size: .85rem;
  display: grid;
}

.checkout__qty {
  color: var(--red);
  font-weight: 700;
}

.checkout__iname {
  color: var(--ink-2);
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.checkout__iprice {
  white-space: nowrap;
  font-weight: 600;
}

.checkout__secure {
  color: var(--muted);
  align-items: center;
  gap: 7px;
  margin-top: 14px;
  font-size: .78rem;
  display: flex;
}

.checkout__province {
  flex-direction: column;
  gap: 6px;
  margin: 4px 0 14px;
  display: flex;
}

.checkout__province .field__label {
  align-items: center;
  gap: 6px;
  display: flex;
}

.checkout__provincehint {
  color: var(--muted);
  font-size: .72rem;
}

.orderconf {
  padding: 40px 24px 60px;
}

.orderconf__hero {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  margin-bottom: 34px;
  display: flex;
}

.orderconf__check {
  color: #2a9d5c;
}

.orderconf__hero h1 {
  font-size: 1.8rem;
}

.orderconf__hero p {
  color: var(--ink-2);
  font-size: .95rem;
}

.orderconf__hero b {
  color: var(--ink);
}

.orderconf__status {
  border-radius: var(--pill);
  background: var(--red-tint);
  color: var(--red-2);
  align-items: center;
  gap: 6px;
  margin-top: 4px;
  padding: 5px 13px;
  font-size: .78rem;
  font-weight: 600;
  display: inline-flex;
}

.orderconf__status--paid, .orderconf__status--delivered {
  color: #2a9d5c;
  background: #2a9d5c24;
}

.orderconf__status--cancelled, .orderconf__status--refunded {
  color: #d33;
  background: #d333331f;
}

.orderconf__grid {
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  max-width: 780px;
  margin: 0 auto;
  display: grid;
}

.orderconf__box {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 22px;
}

.orderconf__box h2 {
  margin-bottom: 14px;
  font-size: 1.05rem;
}

.orderconf__items {
  flex-direction: column;
  gap: 9px;
  margin-bottom: 12px;
  display: flex;
}

.orderconf__addr {
  color: var(--ink-2);
  flex-direction: column;
  gap: 3px;
  font-size: .88rem;
  font-style: normal;
  display: flex;
}

.orderconf__addr b {
  color: var(--ink);
}

.orderconf__actions {
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 30px;
  display: flex;
}

.account {
  padding: 30px 24px 60px;
}

.account__head {
  margin-bottom: 24px;
}

.account__head h1 {
  font-size: 1.6rem;
}

.account__head p {
  color: var(--muted);
  font-size: .9rem;
}

.account__layout {
  grid-template-columns: 240px 1fr;
  align-items: start;
  gap: 28px;
  display: grid;
}

.account__side {
  position: sticky;
  top: 20px;
}

.acctnav {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r);
  flex-direction: column;
  gap: 4px;
  padding: 10px;
  display: flex;
}

.acctnav a, .acctnav__out {
  border-radius: var(--r-sm);
  color: var(--ink-2);
  text-align: left;
  align-items: center;
  gap: 11px;
  width: 100%;
  padding: 11px 14px;
  font-size: .9rem;
  font-weight: 500;
  transition: background .15s, color .15s;
  display: flex;
}

.acctnav a:hover, .acctnav__out:hover {
  background: var(--card-2);
  color: var(--ink);
}

.acctnav a.is-active {
  background: var(--red-tint);
  color: var(--red-2);
  font-weight: 600;
}

.acctnav__out {
  color: #d33;
}

.acctnav__out:hover {
  color: #d33;
  background: #d333331a;
}

.acctnav form {
  border-top: 1px solid var(--line);
  margin-top: 4px;
  padding-top: 4px;
}

.acctpage__title {
  margin-bottom: 20px;
  font-size: 1.3rem;
}

.acctpage__headrow {
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  display: flex;
}

.acctpage__headrow .acctpage__title {
  margin-bottom: 0;
}

.acctstats {
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 30px;
  display: grid;
}

.acctstat {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r);
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 22px 14px;
  transition: border-color .15s, transform .12s;
  display: flex;
}

.acctstat:hover {
  border-color: var(--red);
  transform: translateY(-2px);
}

.acctstat svg {
  color: var(--red);
}

.acctstat b {
  font-size: 1.5rem;
  font-family: var(--font-serif);
}

.acctstat span {
  color: var(--muted);
  font-size: .82rem;
}

.acctblock__head {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
  display: flex;
}

.acctblock__head h2 {
  font-size: 1.05rem;
}

.acctblock__head a {
  color: var(--red);
  align-items: center;
  gap: 4px;
  font-size: .83rem;
  display: inline-flex;
}

.acctempty {
  color: var(--muted);
  padding: 8px 0;
  font-size: .9rem;
}

.acctempty--lg {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 50px 20px;
  display: flex;
}

.acctempty--lg svg {
  color: var(--line-2);
}

.acctempty--lg .btn {
  margin-top: 6px;
}

.orderlist {
  flex-direction: column;
  gap: 10px;
  display: flex;
}

.ordercard {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r);
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  transition: border-color .15s;
  display: flex;
}

.ordercard:hover {
  border-color: var(--red);
}

.ordercard--lg {
  justify-content: space-between;
}

.ordercard__main {
  flex-direction: column;
  gap: 2px;
  display: flex;
}

.ordercard__no {
  font-size: .92rem;
  font-weight: 700;
}

.ordercard__meta {
  color: var(--muted);
  font-size: .8rem;
}

.ordercard__total {
  white-space: nowrap;
  margin-left: auto;
  font-weight: 700;
}

.ordercard--lg .ordercard__total {
  margin-left: 0;
}

.favgrid {
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 18px;
  display: grid;
}

.favitem {
  flex-direction: column;
  gap: 8px;
  display: flex;
  position: relative;
}

.favitem__remove {
  z-index: 2;
  background: var(--bg);
  border: 1px solid var(--line-2);
  border-radius: var(--pill);
  width: 30px;
  height: 30px;
  color: var(--ink-2);
  box-shadow: var(--shadow-sm);
  place-items: center;
  display: grid;
  position: absolute;
  top: 6px;
  right: 6px;
}

.favitem__remove:hover {
  color: #d33;
  border-color: #d33;
}

.favitem__cover img {
  aspect-ratio: 2 / 3;
  object-fit: cover;
  border-radius: var(--r-sm);
  background: var(--card-2);
  width: 100%;
}

.favitem__title {
  font-size: .9rem;
  font-weight: 600;
  line-height: 1.3;
}

.favitem__title a:hover {
  color: var(--red);
}

.favitem__price {
  align-items: baseline;
  gap: 7px;
  display: flex;
}

.addrgrid {
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 16px;
  display: grid;
}

.addrcard {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r);
  flex-direction: column;
  gap: 4px;
  padding: 18px;
  display: flex;
}

.addrcard.is-default {
  border-color: var(--red);
}

.addrcard__top {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
  display: flex;
}

.addrcard__top b {
  font-size: .95rem;
}

.addrcard__badge {
  color: var(--red);
  align-items: center;
  gap: 4px;
  font-size: .72rem;
  font-weight: 600;
  display: inline-flex;
}

.addrcard__name {
  font-size: .9rem;
  font-weight: 600;
}

.addrcard__line {
  color: var(--ink-2);
  font-size: .84rem;
}

.addrcard__actions {
  gap: 8px;
  margin-top: 12px;
  display: flex;
}

.addrcard__btn {
  color: var(--ink-2);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  align-items: center;
  gap: 5px;
  padding: 6px 10px;
  font-size: .8rem;
  transition: border-color .15s, color .15s;
  display: inline-flex;
}

.addrcard__btn:hover {
  border-color: var(--red);
  color: var(--red);
}

.addrcard__btn--del:hover {
  color: #d33;
  border-color: #d33;
}

.addrform {
  flex-direction: column;
  gap: 18px;
  max-width: 640px;
  display: flex;
}

.addrform__actions {
  gap: 12px;
  display: flex;
}

@media (max-width: 900px) {
  .cartlayout, .checkout__layout, .account__layout {
    grid-template-columns: 1fr;
  }

  .cartsum, .checkout__aside, .account__side {
    position: static;
  }

  .orderconf__grid {
    grid-template-columns: 1fr;
  }

  .account__side .acctnav {
    flex-flow: wrap;
  }

  .account__side .acctnav form {
    border-top: none;
    border-left: 1px solid var(--line);
    margin-top: 0;
    padding-top: 0;
    padding-left: 4px;
  }
}

@media (max-width: 560px) {
  .formgrid {
    grid-template-columns: 1fr;
  }

  .acctstats {
    grid-template-columns: 1fr 1fr;
  }

  .cartline {
    grid-template-columns: 64px 1fr;
  }

  .cartline__cover img {
    width: 64px;
    height: 92px;
  }

  .cartline__total {
    text-align: right;
    grid-column: 2;
  }

  .authcard {
    padding: 26px 20px;
  }
}

:root {
  --shadow-sm: 0 1px 2px #1111110a, 0 3px 10px #1111110d;
  --shadow-md: 0 2px 6px -2px #11111114, 0 14px 34px -12px #1111112e;
  --shadow-lift: 0 10px 22px -10px #11111129, 0 26px 50px -24px #11111138;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}

:root[data-theme="dark"] {
  --shadow-sm: 0 1px 2px #0006, 0 3px 12px #00000059;
  --shadow-md: 0 2px 8px -2px #00000080, 0 16px 38px -14px #0000008c;
  --shadow-lift: 0 12px 26px -10px #0000008c, 0 30px 56px -26px #0009;
}

.reveal-ready [data-reveal] {
  opacity: 0;
  will-change: opacity, transform;
  transform: translateY(24px);
}

.ykcard__cover {
  transition: transform .4s var(--ease-out), box-shadow .4s var(--ease-out);
  border-radius: 0;
  box-shadow: 0 8px 20px -8px #16121c4d, 0 3px 8px -3px #16121c2e;
}

.ykcard__cover:hover {
  transform: translateY(-8px);
  box-shadow: 0 26px 50px -14px #16121c6b, 0 10px 20px -8px #16121c42;
}

:root[data-theme="dark"] .ykcard__cover {
  box-shadow: 0 10px 24px -8px #0009, 0 3px 10px -3px #00000080;
}

:root[data-theme="dark"] .ykcard__cover:hover {
  box-shadow: 0 28px 54px -14px #000000b3, 0 12px 24px -8px #0000008c;
}

.ykcard__cart {
  transition: background .2s, color .2s, transform .2s var(--ease-out), box-shadow .2s;
  box-shadow: 0 6px 14px -6px #16121c59;
}

.ykcard__cart:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 20px -6px #c22f2f80;
}

.ykcard__cart:active {
  transform: scale(.96);
}

.catcard, .catcard2 {
  box-shadow: var(--shadow-sm);
  transition: box-shadow .4s var(--ease-out), transform .4s var(--ease-out);
}

.catcard:hover, .catcard2:hover {
  box-shadow: var(--shadow-lift);
  transform: translateY(-5px);
}

.widhtBanner {
  transition: transform .4s var(--ease-out), box-shadow .4s var(--ease-out), filter .4s var(--ease-out);
}

.widhtBanner--purple {
  box-shadow: 0 16px 34px -16px #c22f2f8c;
}

.widhtBanner--dark {
  box-shadow: 0 16px 34px -16px #00000080;
}

.widhtBanner:hover {
  filter: brightness(1.05);
  transform: translateY(-4px);
}

.widhtBanner--purple:hover {
  box-shadow: 0 26px 50px -16px #c22f2fb3;
}

.widhtBanner--dark:hover {
  box-shadow: 0 26px 50px -16px #0000009e;
}

.widhtBanner__cta {
  transition: transform .3s var(--ease-out), box-shadow .2s;
  box-shadow: 0 4px 12px -4px #00000040;
}

.widhtBanner:hover .widhtBanner__cta {
  transform: translateX(5px);
}

.ykside__list a:hover {
  padding-left: 22px;
}

.ykside__promo {
  box-shadow: var(--shadow-sm);
  transition: box-shadow .35s var(--ease-out), transform .35s var(--ease-out);
}

.ykside__promo:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}

.yksec__head a svg {
  transition: transform .3s var(--ease-out);
}

.yksec__head a:hover svg {
  transform: translateX(4px);
}

.acard {
  box-shadow: var(--shadow-sm);
  transition: box-shadow .4s var(--ease-out), transform .4s var(--ease-out);
}

.acard:hover {
  box-shadow: var(--shadow-lift);
  transform: translateY(-5px);
}

@keyframes orion-float {
  0%, 100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-7px);
  }
}

@keyframes orion-glow {
  0%, 100% {
    opacity: .55;
    transform: scale(1);
  }

  50% {
    opacity: .85;
    transform: scale(1.05);
  }
}

.hslide.is-active .hslide__frame {
  animation: 6s ease-in-out .9s infinite orion-float;
}

.hslide.is-active .hslide__glow {
  animation: 7s ease-in-out infinite orion-glow;
}

.btn {
  transition: transform .18s var(--ease-out), background .15s, border-color .15s, color .15s, box-shadow .2s;
}

.btn:active {
  transform: translateY(1px)scale(.99);
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
  }

  .hslide.is-active .hslide__frame, .hslide.is-active .hslide__glow {
    animation: none !important;
  }

  *, :before, :after {
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
  }
}

.orion-cols {
  align-items: start;
  gap: 20px;
  margin: 20px 0;
  display: grid;
}

.orion-cols > .orion-col {
  min-width: 0;
}

.orion-cols--1-1 {
  grid-template-columns: 1fr 1fr;
}

.orion-cols--2-1 {
  grid-template-columns: 2fr 1fr;
}

.orion-cols--1-2 {
  grid-template-columns: 1fr 2fr;
}

.orion-cols--1-1-1 {
  grid-template-columns: 1fr 1fr 1fr;
}

.orion-cols--2-1-1 {
  grid-template-columns: 2fr 1fr 1fr;
}

.orion-cols--1-2-1 {
  grid-template-columns: 1fr 2fr 1fr;
}

.orion-cols--1-1-2 {
  grid-template-columns: 1fr 1fr 2fr;
}

.orion-cols > .orion-col > :first-child {
  margin-top: 0;
}

.orion-cols img {
  max-width: 100%;
  height: auto;
}

@media (max-width: 700px) {
  .orion-cols--mobil-yigin {
    grid-template-columns: 1fr !important;
  }
}

.bannerStrip {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 16px;
  margin: 28px auto;
  display: grid;
}

.bannerStrip__item {
  border-radius: var(--r, 14px);
  line-height: 0;
  display: block;
  overflow: hidden;
}

.bannerStrip__img {
  object-fit: cover;
  width: 100%;
  height: auto;
  display: block;
}

a.bannerStrip__item {
  transition: transform .2s, box-shadow .2s;
}

a.bannerStrip__item:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 30px #0000001f;
}

.announceBar {
  background: var(--accent, var(--red, #6d28d9));
  color: #fff;
  font-size: 13px;
  font-weight: 500;
}

.announceBar__in, .announceBar__link .announceBar__in {
  text-align: center;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  display: flex;
}

.announceBar__link {
  color: #fff;
  text-decoration: none;
  display: block;
}

.announceBar__link:hover {
  text-decoration: underline;
}

.announce-list {
  flex-direction: column;
  gap: 18px;
  margin-top: 8px;
  display: flex;
}

.announce-item {
  background: var(--card, #fff);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm, 0 1px 3px #0000000f);
  border-radius: 14px;
  padding: 20px 22px;
}

.announce-item h2 {
  margin: 0 0 4px;
  font-size: 19px;
  line-height: 1.3;
}

.announce-item__date {
  color: var(--muted);
  margin-bottom: 10px;
  font-size: 12.5px;
  display: block;
}

.announce-item__body {
  color: var(--ink-2, var(--ink));
  font-size: 15px;
  line-height: 1.7;
}

.announce-item__body p {
  margin: 0 0 10px;
}

.announce-item__body a {
  color: var(--accent, var(--red, #6d28d9));
}

.announce-item__body ul, .announce-item__body ol {
  margin: 8px 0;
  padding-left: 20px;
}

.popupBanner__overlay {
  z-index: 1200;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  background: #0f0f198c;
  justify-content: center;
  align-items: center;
  padding: 20px;
  animation: .2s popupFade;
  display: flex;
  position: fixed;
  inset: 0;
}

@keyframes popupFade {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.popupBanner__box {
  background: var(--card, #fff);
  border-radius: 16px;
  width: 100%;
  max-width: 560px;
  animation: .25s cubic-bezier(.2, .9, .3, 1.2) popupPop;
  position: relative;
  overflow: hidden;
  box-shadow: 0 30px 80px #0006;
}

@keyframes popupPop {
  from {
    opacity: 0;
    transform: scale(.9);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

.popupBanner__img {
  width: 100%;
  height: auto;
  display: block;
}

.popupBanner__link {
  display: block;
}

.popupBanner__close {
  z-index: 2;
  cursor: pointer;
  color: #fff;
  background: #0000008c;
  border: none;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 34px;
  height: 34px;
  transition: background .15s;
  display: flex;
  position: absolute;
  top: 10px;
  right: 10px;
}

.popupBanner__close:hover {
  background: #000c;
}

.admHero {
  width: 100%;
  height: 100%;
  position: relative;
}

.admHero__viewport {
  background: var(--bg);
  border-radius: 16px;
  width: 100%;
  height: 100%;
  min-height: 340px;
  position: relative;
  overflow: hidden;
}

.admHero__slide {
  opacity: 0;
  visibility: hidden;
  transition: opacity .5s;
  position: absolute;
  inset: 0;
}

.admHero__slide.is-active {
  opacity: 1;
  visibility: visible;
}

.admHero__link {
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
}

.admHero__img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  min-height: 340px;
  display: block;
}

.admHero__caption {
  color: #fff;
  background: linear-gradient(to top, #0a0a14b8 0%, #0a0a1459 55%, #0000 100%);
  padding: 28px 30px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.admHero__title {
  margin: 0 0 6px;
  font-size: clamp(20px, 3vw, 30px);
  font-weight: 800;
  line-height: 1.15;
}

.admHero__sub {
  opacity: .92;
  max-width: 60ch;
  margin: 0 0 14px;
  font-size: 15px;
}

.admHero__cta {
  align-items: center;
  gap: 6px;
  display: inline-flex;
}

.admHero__nav {
  pointer-events: none;
  justify-content: space-between;
  align-items: center;
  padding: 0 12px;
  display: flex;
  position: absolute;
  inset: 0;
}

.admHero__arrow {
  pointer-events: auto;
  cursor: pointer;
  color: #111;
  background: #ffffffd9;
  border: none;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  transition: background .15s, transform .15s;
  display: flex;
  box-shadow: 0 4px 14px #0003;
}

.admHero__arrow:hover {
  background: #fff;
  transform: scale(1.05);
}

.admHero__dots {
  justify-content: center;
  align-items: center;
  gap: 7px;
  display: flex;
  position: absolute;
  bottom: 12px;
  left: 0;
  right: 0;
}

.admHero__dot {
  cursor: pointer;
  background: #ffffff8c;
  border: none;
  border-radius: 50%;
  width: 9px;
  height: 9px;
  padding: 0;
  transition: background .15s, transform .15s;
}

.admHero__dot.is-active {
  background: #fff;
  transform: scale(1.25);
}

.bannerStrip--sidebar {
  margin-top: 14px;
  padding: 0;
}

.bannerStrip--sidebar .bannerStrip__item {
  display: block;
}

.bannerStrip--sidebar .bannerStrip__img {
  border-radius: 12px;
  width: 100%;
}

.bannerStrip--category_top {
  margin: 14px auto;
}

/*# sourceMappingURL=%5Broot-of-the-server%5D__0lh8w0q._.css.map*/