/* Homepage showroom. The catalogue modal and admin keep their shared styles. */

/* The content width of every page, header included. Defined once on :root
   rather than per page type: when it lived on .page-browse only, the product
   pages had no value for it and their header stretched to the full screen. */
:root { --home-wrap: 1080px; }

.page-browse {
  background: #070a0d;
  color: #f7f7f8;
}
.home-wrap { width: min(calc(100% - 56px), var(--home-wrap)); margin-inline: auto; padding-inline: 0; }

/* Header */
.page-browse .home-head {
  position: absolute; top: 0; width: 100%; margin: 0; z-index: 50;
  background: transparent; border-bottom: 1px solid rgba(255,255,255,.14);
}
.page-browse .home-head.is-scrolled { position: fixed; background: rgba(7,10,13,.96); border-bottom: 1px solid rgba(255,255,255,.13); backdrop-filter: blur(18px); }
.home-head .head-inner { position: relative; height: 100%; gap: 22px; }
.home-head .brand { margin: 0; }
.home-head .brand-logo { width: 130px; transform: translateY(-2px); }
.home-nav { display: flex; align-items: center; gap: 2px; height: 42px; padding: 4px; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; background: rgba(12,16,20,.62); }
.home-nav a { position: relative; display: flex; align-items: center; height: 32px; padding: 0 12px; border-radius: 8px; color: rgba(255,255,255,.78); font-size: .78rem; font-weight: 600; transition: color .2s ease,background .2s ease; }
.home-nav a:hover { color: #fff; background: rgba(255,255,255,.055); }
.home-nav a.is-on { color: #fff; background: rgba(255,255,255,.075); }
.home-nav a.is-on::after { display: none; }
.head-search { position: relative; flex: 1 1 300px; min-width: 190px; max-width: 460px; margin-left: auto; }
.head-search svg { position: absolute; left: 14px; top: 50%; width: 16px; transform: translateY(-50%); color: rgba(255,255,255,.55); }
.head-search input { width: 100%; height: 40px; padding: 0 15px 0 41px; border-radius: 30px; border: 1px solid rgba(255,255,255,.3); background: rgba(6,9,12,.68); outline: 0; font-size: .77rem; }
.head-search input:focus { border-color: var(--accent); background: rgba(6,9,12,.8); }
.head-search input::placeholder { color: rgba(255,255,255,.5); }
.head-pro { display: flex; flex: none; align-items: center; gap: 8px; height: 42px; padding: 0 13px; white-space: nowrap; border: 1px solid var(--accent); border-radius: 30px; color: #fff; }
.head-pro svg { width: 20px; color: var(--accent); }
.head-pro span { display: flex; flex-direction: column; line-height: 1.05; }
.head-pro strong { color: var(--accent); font-size: .8rem; }
.head-pro small { color: #fff; font-size: .64rem; margin-top: 3px; }
.head-account { flex: none; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); }
.head-account svg { width: 17px; }
.head-menu { display: none; }
.head-account-menu[hidden]{display:none}.head-account-menu{position:absolute;top:calc(100% - 3px);right:0;z-index:80;min-width:205px;display:grid;gap:2px;padding:9px;border:1px solid rgba(255,255,255,.17);border-radius:12px;background:#11161a;box-shadow:0 18px 45px rgba(0,0,0,.5)}.head-account-menu a,.head-account-menu button{min-height:38px;display:flex;align-items:center;padding:0 12px;border:0;border-radius:7px;background:transparent;color:#e8eaed;text-align:left;font:600 .72rem Inter,sans-serif;cursor:pointer}.head-account-menu a:hover,.head-account-menu button:hover{background:rgba(255,255,255,.08)}.head-account-menu button{border-top:1px solid rgba(255,255,255,.09);border-radius:0;color:#bfc5cc}

/* The information pages use the exact same store header as the catalogue. */
.page-doc .home-head,
.page-doc .home-head.is-scrolled {
  position: sticky; top: 0; width: 100%; margin: 0;
  background: rgba(7,10,13,.94); border-bottom: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(18px);
}

/* Hero */
.home-hero { position: relative; min-height: 650px; overflow: hidden; background: #080b0e; }
.home-hero-bg {
  position: absolute;
  z-index: 0;
  inset: 0;
  background: #080b0e;
}
/* The source is portrait: keep its natural crop on the right and feather its
   left edge into the hero instead of stretching it across the whole viewport. */
.home-hero-bg::after {
  content: '';
  position: absolute;
  z-index: 1;
  inset: 0;
  background-image: var(--hero-image,none);
  background-position: var(--hero-image-x,100%) var(--hero-image-y,35%);
  background-size: auto var(--hero-image-size,145%);
  background-repeat: no-repeat;
  -webkit-mask-image: linear-gradient(90deg,transparent 52%,rgba(0,0,0,.12) 62%,#000 79%);
  mask-image: linear-gradient(90deg,transparent 52%,rgba(0,0,0,.12) 62%,#000 79%);
}
.home-hero-bg::before {
  content: '';
  position: absolute;
  z-index: 2;
  inset: 0;
  background: linear-gradient(90deg,#080b0e 0%,#080b0e 31%,rgba(8,11,14,.9) 43%,rgba(8,11,14,.25) 70%,rgba(8,11,14,.06) 100%),linear-gradient(0deg,rgba(7,10,13,.97),transparent 32%),linear-gradient(180deg,rgba(4,7,10,.28),transparent 36%);
  pointer-events: none;
}
.home-hero-inner { position: relative; z-index: 1; min-height: 650px; display: grid; grid-template-columns: minmax(0,1fr) 340px; align-items: center; gap: 62px; padding-top: 60px; }
.home-hero-copy { width: 580px; padding-bottom: 24px; }
.home-eyebrow { color: var(--accent); font-size: .73rem; font-weight: 800; letter-spacing: .19em; text-transform: uppercase; margin-bottom: 14px; }
.home-hero h1 { max-width: 580px; font-size: clamp(3.8rem,4.8vw,4.35rem); line-height: .92; font-weight: 850; }
.home-hero h1 em { color: var(--accent); font-style: normal; }
.home-intro { margin-top: 16px; color: rgba(255,255,255,.78); font-size: clamp(1.08rem,1.45vw,1.4rem); line-height: 1.45; white-space: pre-line; }
.home-hero-actions { display: flex; align-items: center; gap: 12px; margin-top: 30px; }
.home-btn { display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-height: 54px; padding: 0 26px; border-radius: 28px; font-size: .88rem; font-weight: 750; transition: transform .25s var(--ease),filter .2s; }
.home-btn:hover { transform: translateY(-2px); filter: brightness(1.08); }
.home-btn-primary { background: linear-gradient(100deg,#ff743e,#ef5824); color: #fff; box-shadow: 0 10px 26px rgba(232,100,45,.22); }
.home-btn-secondary { border: 1px solid rgba(255,255,255,.25); background: rgba(8,11,14,.62); }
.home-btn-secondary svg { width: 18px; }
.home-btn-secondary > span { display: flex; flex-direction: column; line-height: 1.05; }
.home-btn-secondary small { margin-top: 4px; font-size: .66rem; font-weight: 500; color: rgba(255,255,255,.7); }
.home-stats { display: flex; align-items: stretch; margin-top: 34px; }
.home-stats > div { display: flex; align-items: center; gap: 14px; min-width: 175px; padding: 0 28px; border-right: 1px solid rgba(255,255,255,.16); }
.home-stats > div:first-child { padding-left: 0; }
.home-stats > div:last-child { border: 0; }
.home-stats i { width: 34px; height: 34px; flex: none; display: grid; place-items: center; color: rgba(255,255,255,.8); }
.home-stats svg { width: 29px; }
.home-stats span { display: flex; flex-direction: column; line-height: 1.2; }
.home-stats strong { font-size: .95rem; }
.home-stats small { margin-top: 4px; color: rgba(255,255,255,.58); font-size: .72rem; }
.home-scribble { position: absolute; right: 20px; top: 190px; transform: rotate(-9deg); color: rgba(255,255,255,.62); font: italic 1.2rem/1.25 cursive; text-align: center; white-space: pre-line; }
.home-scribble::after { content: ''; display: block; width: 84px; height: 2px; margin: 10px auto 0; transform: rotate(-14deg); background: var(--accent); }
.home-built { position: absolute; right: 22px; bottom: 120px; color: rgba(255,255,255,.62); font-size: .6rem; line-height: 1.6; letter-spacing: .15em; text-transform: uppercase; white-space: pre-line; }

/* Featured product in the hero */
.home-feature { position: relative; width: 340px; height: 445px; overflow: hidden; border: 1px solid rgba(255,255,255,.2); border-radius: 24px; background: #10151a; box-shadow: 0 28px 70px rgba(0,0,0,.42),0 0 60px rgba(31,126,126,.09); transition: transform .35s var(--ease),border-color .25s; }
.home-feature > img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.home-feature-shade { position: absolute; inset: 0; background: linear-gradient(180deg,rgba(5,8,11,.34),transparent 34%,rgba(5,7,10,.08) 45%,rgba(5,7,10,.94) 100%); }
.home-feature-top { position: absolute; top: 18px; left: 18px; right: 18px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.home-feature-top b,.home-feature-top em { display: inline-flex; align-items: center; min-height: 28px; padding: 0 11px; border-radius: 16px; font-size: .58rem; font-style: normal; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.home-feature-top b { gap: 7px; border: 1px solid rgba(255,255,255,.19); background: rgba(7,10,13,.74); backdrop-filter: blur(8px); }
.home-feature-top b i { width: 6px; height: 6px; border-radius: 50%; background: #48c47b; }
.home-feature-top em { background: var(--accent); }
.home-feature-copy { position: absolute; left: 23px; right: 23px; bottom: 23px; display: flex; align-items: flex-start; flex-direction: column; }
.home-feature-copy > strong { font-size: 1.7rem; line-height: 1.02; letter-spacing: -.045em; }
.home-feature-copy > small { display: -webkit-box; overflow: hidden; margin-top: 9px; color: rgba(255,255,255,.75); font-size: .73rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.home-feature-copy > span { display: inline-flex; align-items: center; gap: 18px; min-height: 43px; margin-top: 16px; padding: 0 18px; border-radius: 23px; background: var(--accent); font-size: .72rem; font-weight: 800; }
.home-feature:hover { transform: translateY(-6px); border-color: rgba(232,100,45,.55); }
.home-feature:hover > img { transform: scale(1.045); }
.home-feature:hover .home-feature-copy > span b { transform: translateX(3px); }
.home-hero.has-feature .home-scribble,.home-hero.has-feature .home-built { display: none; }

/* Category doors */
.home-categories { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; margin-top: -48px; }
.home-category { position: relative; height: 260px; overflow: hidden; border: 1px solid rgba(255,255,255,.2); border-radius: 18px; background: #11161b; }
.home-category img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.home-category-shade { position: absolute; inset: 0; background: linear-gradient(0deg,rgba(5,7,10,.88),transparent 62%); }
.home-category-copy { position: absolute; left: 30px; right: 72px; bottom: 27px; display: flex; flex-direction: column; }
.home-category-copy strong { font-size: 1.7rem; line-height: 1.1; text-transform: uppercase; }
.home-category-copy small { color: rgba(255,255,255,.7); font-size: .95rem; margin-top: 7px; }
.home-round-arrow { position: absolute; right: 25px; bottom: 26px; width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; }
.home-round-arrow svg { width: 18px; }
.home-category:hover img { transform: scale(1.045); }
.home-category:hover .home-round-arrow { background: var(--accent); border-color: var(--accent); }

/* Shared section heading */
.home-section { padding-top: 62px; }
.home-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 25px; margin-bottom: 25px; }
.home-section-head h2 { font-size: 2rem; line-height: 1.1; letter-spacing: -.035em; }
.home-section-head p { margin-top: 5px; color: rgba(255,255,255,.6); font-size: .85rem; }
.home-outline-btn { display: inline-flex; align-items: center; justify-content: center; gap: 16px; min-height: 44px; padding: 0 20px; border: 1px solid rgba(255,255,255,.28); border-radius: 24px; background: transparent; color: #fff; cursor: pointer; font-size: .76rem; font-weight: 650; }
.home-outline-btn:hover { border-color: var(--accent); }

/* Product strip */
.home-products { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
.home-product { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: linear-gradient(155deg,#151a20,#0d1116); transition: transform .3s var(--ease),border-color .25s; }
.home-product:hover { transform: translateY(-5px); border-color: var(--line-2); }
.home-product-media { position: relative; display: block; aspect-ratio: 1.05/1; overflow: hidden; background: #11151a; }
.home-product-media::after { content: ''; position: absolute; inset: auto 0 0; height: 28%; background: linear-gradient(transparent,rgba(8,11,14,.55)); }
.home-product-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.home-product:hover img { transform: scale(1.04); }
.home-product-kind,.home-product-new { position: absolute; z-index: 2; top: 11px; padding: 5px 9px; border-radius: 14px; font-size: .57rem; line-height: 1; text-transform: uppercase; }
.home-product-kind { left: 11px; background: rgba(7,10,13,.82); border: 1px solid rgba(255,255,255,.18); }
.home-product-new { left: auto; right: 11px; background: var(--accent); }
.home-heart { position: absolute; z-index: 3; top: 8px; right: 8px; width: 31px; height: 31px; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(6,8,11,.52); cursor: pointer; }
.home-product-new + .home-heart { top: 42px; }
.home-heart svg { width: 16px; }
.home-heart.is-on { color: var(--accent); }
.home-heart.is-on svg { fill: currentColor; }
.home-product-copy { display: flex; flex-direction: column; min-height: 124px; padding: 13px 14px 15px; }
.home-product-copy > strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .86rem; }
.home-product-copy > small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 4px; color: rgba(255,255,255,.55); font-size: .68rem; }
.home-product-price { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 16px; }
.home-product-price b { font-size: 1rem; }
.home-price-amount { display: inline-flex; align-items: baseline; gap: 5px; }
.home-product-price i { font-style: normal; font-size: .6rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.5); }
.home-product-price em { color: var(--accent); font-size: .61rem; font-style: normal; text-align: right; }

.home-create-callout { min-height: 88px; display: flex; align-items: center; gap: 18px; margin-top: 42px; padding: 18px 24px; border: 1px solid rgba(232,100,45,.32); border-radius: 14px; background: linear-gradient(100deg,rgba(232,100,45,.1),rgba(15,19,24,.72) 55%,rgba(15,19,24,.9)); transition: border-color .2s,transform .2s; }
.home-create-callout:hover { border-color: rgba(232,100,45,.72); transform: translateY(-2px); }
.home-create-icon { width: 42px; height: 42px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--accent); color: #080a0c; font-size: 1.3rem; font-weight: 900; }
.home-create-callout > span:nth-child(2) { display: flex; flex-direction: column; gap: 5px; }
.home-create-callout strong { font-size: .9rem; }
.home-create-callout small { color: rgba(255,255,255,.58); font-size: .7rem; }
.home-create-callout > b { display: flex; align-items: center; gap: 18px; margin-left: auto; color: #fff; font-size: .75rem; white-space: nowrap; }
.home-create-callout > b i { color: var(--accent); font-size: 1rem; font-style: normal; }
.home-empty { padding: 60px 0; color: rgba(255,255,255,.6); text-align: center; }

/* Pro banner */
.home-pro { position: relative; min-height: 315px; display: grid; grid-template-columns: 1.25fr 1fr; align-items: center; overflow: hidden; margin-top: 65px; border: 1px solid rgba(232,100,45,.45); border-radius: 18px; background: #111316; }
.home-pro-bg { position: absolute; inset: 0; background-size: cover; background-position: center 36%; opacity: .42; filter: saturate(.75); }
.home-pro::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(10,9,9,.98) 0%,rgba(27,15,12,.75) 43%,rgba(7,10,13,.35) 70%,rgba(7,10,13,.8)); }
.home-pro-copy,.home-pro-benefits { position: relative; z-index: 1; }
.home-pro-copy { padding: 45px 55px; }
.home-pro-brand { font-size: 1.25rem; font-weight: 800; }
.home-pro-brand > span:first-child { color: var(--accent); font-size: 1.6rem; }
.home-pro-brand > span:last-child { color: var(--accent); }
.home-pro-copy h2 { margin-top: 16px; font-size: 2.5rem; letter-spacing: -.045em; }
.home-pro-copy > p:not(.home-pro-brand) { margin-top: 8px; color: rgba(255,255,255,.72); line-height: 1.5; }
.home-pro-copy .home-btn { margin-top: 24px; min-height: 49px; }
.home-pro-benefits { display: grid; grid-template-columns: repeat(4,1fr); gap: 15px; padding-right: 38px; }
.home-pro-benefits > div { display: flex; align-items: center; flex-direction: column; text-align: center; }
.home-pro-benefits i { width: 58px; height: 58px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.45); border-radius: 50%; font-size: 1.8rem; font-style: normal; }
.home-pro-benefits strong { margin-top: 14px; font-size: .73rem; }
.home-pro-benefits span { max-width: 90px; margin-top: 4px; color: rgba(255,255,255,.55); font-size: .65rem; line-height: 1.35; }

/* Collections */
.home-collections-section { padding-bottom: 75px; }
.home-collection-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 18px; }
.home-collection { position: relative; aspect-ratio: .82; overflow: hidden; border: 1px solid rgba(255,255,255,.15); border-radius: 14px; }
.home-collection > img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.home-collection > span { position: absolute; inset: 0; background: linear-gradient(0deg,rgba(6,8,11,.94),transparent 60%); }
.home-collection > div { position: absolute; left: 20px; right: 15px; bottom: 18px; display: flex; flex-direction: column; }
.home-collection small { font-size: .57rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.home-collection strong { margin-top: 4px; font-size: 1.1rem; line-height: 1.15; }
.home-collection em { margin-top: 5px; color: rgba(255,255,255,.65); font-size: .69rem; font-style: normal; }
.home-collection:hover img { transform: scale(1.05); }

.page-browse .site-foot { background: #06090c; }

/* Product-first homepage */
.page-home-store { background: radial-gradient(circle at 74% 8%,rgba(26,96,96,.08),transparent 31%),#070a0d; }
.page-home-store .home-head,
.page-home-store .home-head.is-scrolled { position: sticky; top: 0; margin-bottom: 0; background: rgba(7,10,13,.93); border-bottom: 1px solid rgba(255,255,255,.12); backdrop-filter: blur(18px); }
.store-main { padding-top: 20px; }
.store-toolbar { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.store-pills { display: flex; align-items: center; gap: 9px; }
.store-pills a { display: inline-flex; align-items: center; justify-content: center; min-height: 34px; padding: 0 17px; border: 1px solid rgba(255,255,255,.13); border-radius: 9px; background: #10151a; color: rgba(255,255,255,.72); font-size: .69rem; font-weight: 650; }
.store-pills a:hover { color: #fff; border-color: rgba(232,100,45,.55); }
.store-pills a.is-on { border-color: var(--accent); background: var(--accent); color: #fff; box-shadow: 0 7px 18px rgba(232,100,45,.2); }
.store-sort { position: relative; flex: none; }
.store-sort span { position: absolute; z-index: 1; left: 14px; top: 5px; color: rgba(255,255,255,.42); font-size: .48rem; pointer-events: none; }
.store-sort select { width: 125px; height: 42px; padding: 15px 30px 2px 13px; border: 1px solid rgba(255,255,255,.18); border-radius: 10px; background: #0d1217; outline: none; font-size: .67rem; font-weight: 700; }
.store-section { padding-top: 34px; }
.store-featured { padding-top: 12px; }
.store-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 14px; }
.store-section-head h1,.store-section-head h2 { font-size: 1.55rem; line-height: 1.05; letter-spacing: -.035em; }
.store-section-head p { margin-top: 4px; color: rgba(255,255,255,.57); font-size: .78rem; }
.store-section-head .home-outline-btn { min-height: 38px; padding-inline: 17px; }
.store-feature-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; }
.store-feature-card { position: relative; height: 280px; overflow: hidden; border: 1px solid var(--line); border-radius: 11px; background: #11161b; transition: border-color .25s; }
.store-feature-card > img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.store-feature-card:hover { border-color: var(--line-2); }
.store-feature-card:hover > img { transform: scale(1.035); }
.store-feature-shade { position: absolute; inset: 0; background: linear-gradient(0deg,rgba(6,9,12,.96),transparent 70%); }
.store-feature-card > b { position: absolute; top: 11px; left: 11px; padding: 4px 9px; border: 1px solid rgba(255,255,255,.25); border-radius: 12px; background: rgba(5,8,11,.72); font-size: .57rem; text-transform: uppercase; }
.store-feature-card > .home-heart { top: 8px; }
.store-feature-copy { position: absolute; left: 14px; right: 14px; bottom: 12px; display: flex; flex-direction: column; }
.store-feature-copy > strong { display: -webkit-box; overflow: hidden; font-size: 1.35rem; line-height: 1.12; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.store-feature-copy > small { margin-top: 2px; color: rgba(255,255,255,.62); font-size: .66rem; }
.store-feature-meta { display: flex; align-items: center; gap: 13px; margin-top: 8px; }
.store-feature-meta em { color: rgba(255,255,255,.72); font-size: .64rem; font-style: normal; }
.store-feature-meta i { margin-left: auto; font-size: .88rem; font-style: normal; font-weight: 800; }
.store-feature-meta u { color: var(--accent); font-size: .57rem; text-decoration: none; }
.page-home-store .home-product,
.page-library .home-product { position: relative; aspect-ratio: .78; min-height: 0; background: #10151a; }
.page-home-store .home-product-media,
.page-library .home-product-media { position: absolute; inset: 0; aspect-ratio: auto; }
.page-home-store .home-product-media::after,
.page-library .home-product-media::after { inset: 0; height: auto; background: linear-gradient(180deg,rgba(5,8,11,.16) 0%,transparent 38%,rgba(5,8,11,.2) 55%,rgba(5,8,11,.96) 100%); }
.page-home-store .home-product-copy,
.page-library .home-product-copy { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; min-height: 0; padding: 48px 13px 13px; background: linear-gradient(transparent,rgba(6,9,12,.72) 36%,rgba(6,9,12,.94)); }
.page-home-store .home-product-copy > strong,
.page-library .home-product-copy > strong {
  display: -webkit-box; overflow: hidden; color: #fff; font-size: 1.25rem; line-height: 1.12;
  white-space: normal; text-overflow: clip; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
}
.page-home-store .home-product-copy > small,
.page-library .home-product-copy > small { color: rgba(255,255,255,.72); }
.store-card-stats { display: flex; align-items: center; gap: 13px; margin-top: 8px; color: rgba(255,255,255,.63); font-size: .59rem; }
.store-card-stats:empty { display: none; }
.page-home-store .home-product-price,
.page-library .home-product-price { align-items: baseline; flex-direction: row; padding-top: 8px; }
.page-home-store .home-product-price b,
.page-library .home-product-price b { color: #fff; font-size: .86rem; }
.page-home-store .home-product-price em,
.page-library .home-product-price em { text-shadow: 0 1px 8px rgba(0,0,0,.9); }
.page-home-store .home-product:hover,
.page-library .home-product:hover { box-shadow: 0 12px 30px rgba(0,0,0,.35); }
.page-home-store .home-pro { min-height: 235px; margin-top: 42px; }
.page-home-store .home-pro-copy { padding: 30px 36px; }
.page-home-store .home-pro-copy h2 { margin-top: 9px; font-size: 2rem; }
.page-home-store .home-pro-copy .home-btn { margin-top: 15px; }
.page-home-store .home-pro-benefits i { width: 48px; height: 48px; font-size: 1.5rem; }
.store-assurance { display: grid; grid-template-columns: repeat(3,1fr); gap: 0; margin-top: 22px; margin-bottom: 72px; border: 1px solid rgba(255,255,255,.11); border-radius: 14px; background: rgba(13,17,22,.68); }
.store-assurance > div { display: flex; align-items: center; gap: 13px; min-height: 82px; padding: 15px 24px; border-right: 1px solid rgba(255,255,255,.09); }
.store-assurance > div:last-child { border-right: 0; }
.store-assurance i { width: 34px; height: 34px; flex: none; display: grid; place-items: center; border: 1px solid rgba(232,100,45,.48); border-radius: 50%; color: var(--accent); font-size: .88rem; font-style: normal; font-weight: 800; }
.store-assurance span { display: flex; flex-direction: column; }
.store-assurance strong { font-size: .75rem; }
.store-assurance small { margin-top: 2px; color: rgba(255,255,255,.53); font-size: .64rem; line-height: 1.4; }

@media (max-width: 920px) {
  .store-toolbar { align-items: flex-start; flex-direction: column; padding-top: 10px; }
  .store-pills { width: 100%; overflow-x: auto; padding-bottom: 4px; }
  .store-pills a { flex: none; }
  .store-sort { align-self: flex-end; margin-top: -5px; }
  .store-feature-grid { grid-template-columns: 1fr 1fr; }
  .store-feature-card:last-child { display: none; }
  .store-assurance { grid-template-columns: 1fr; }
  .store-assurance > div { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.09); }
  .store-assurance > div:last-child { border-bottom: 0; }
}
@media (max-width: 620px) {
  .store-main { padding-top: 10px; }
  .store-section-head { align-items: flex-start; }
  .store-section-head .home-outline-btn { min-width: auto; padding-inline: 13px; white-space: nowrap; }
  .store-feature-grid { grid-template-columns: 1fr; }
  .store-feature-card { height: 280px; }
  .store-feature-card:nth-child(n+2) { display: none; }
}

@media (max-width: 1180px) {
  .home-nav { gap: 2px; }
  .head-search { min-width: 150px; }
  .home-hero-inner { grid-template-columns: minmax(0,1fr) 310px; gap: 35px; }
  .home-hero-copy { width: 100%; }
  .home-feature { width: 310px; height: 420px; }
  .home-scribble,.home-built { display: none; }
  .home-products { grid-template-columns: repeat(3,1fr); }
  .home-pro { grid-template-columns: 1fr; }
  .home-pro-benefits { padding: 0 45px 38px; }
}
@media (max-width: 940px) {
  .head-search { display: none; }
}
@media (max-width: 820px) {
  .home-wrap { width: calc(100% - 36px); }
  .home-nav { display: none; }
  .home-head .head-inner { gap: 12px; }
  .home-head .brand-logo { width: 120px; }
  .head-pro { margin-left: auto; padding: 0 13px; }
  .home-hero { min-height: 700px; }
  .home-hero-bg { inset: 0; background-size: cover; background-position: 62% center; opacity: .58; }
  .home-hero-bg::after { background-size: cover; background-position: 62% center; -webkit-mask-image: none; mask-image: none; }
  .home-hero-bg::before { background: linear-gradient(90deg,rgba(7,10,13,.96),rgba(7,10,13,.45)),linear-gradient(0deg,#070a0d,transparent 55%); }
  .home-hero-inner { min-height: 700px; display: flex; align-items: flex-end; padding-bottom: 90px; }
  .home-hero-copy { width: 100%; }
  .home-feature { display: none; }
  .home-hero h1 { font-size: clamp(3.4rem,12vw,5.2rem); }
  .home-categories { grid-template-columns: 1fr; margin-top: -65px; }
  .home-category { height: 230px; }
  .home-products { grid-template-columns: repeat(2,1fr); }
  .home-collection-grid { grid-template-columns: repeat(2,1fr); }
  .home-pro-copy { padding: 38px 28px; }
  .home-pro-benefits { grid-template-columns: repeat(2,1fr); padding: 0 25px 35px; row-gap: 26px; }
}
@media (max-width: 620px) {
  #latest .home-products, #popular .home-products { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .head-account { display: none; }
  .head-pro strong { font-size: .7rem; }
  .home-hero-actions { align-items: stretch; flex-direction: column; max-width: 260px; }
  .home-stats { gap: 18px; flex-wrap: wrap; }
  .home-stats > div { min-width: auto; padding: 0 18px 0 0; border: 0; }
  .home-stats > div:last-child { width: 100%; }
  .home-section-head { align-items: flex-start; flex-direction: column; }
  .home-products { gap: 10px; }
  .home-product-copy { min-height: 116px; padding: 11px; }
  .home-product-price { align-items: flex-start; flex-direction: column; padding-top: 10px; }
  .home-product-price em { text-align: left; }
  .home-collection-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .home-collection > div { left: 13px; bottom: 13px; }
  .home-pro-copy h2 { font-size: 2rem; }
}

@media (max-width:620px){.home-create-callout{align-items:flex-start;flex-wrap:wrap;padding:20px}.home-create-callout>b{width:100%;margin:2px 0 0 60px}}
/* The account entry remains reachable on phones. */
@media (max-width:520px){.head-account{display:grid;width:38px;height:38px;flex:none}.head-pro{padding:0 10px}.home-head .brand-logo{width:108px}}
@media (max-width:820px){
  .head-menu{width:40px;height:40px;display:flex;flex:none;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:1px solid rgba(255,255,255,.22);border-radius:50%;background:rgba(7,10,13,.6);color:#fff;cursor:pointer}
  .head-menu span{width:17px;height:1.5px;border-radius:2px;background:currentColor}
  .home-head .head-inner{position:relative}
  .home-head.is-menu-open .home-nav{position:absolute;top:calc(100% - 2px);right:0;left:0;z-index:70;height:auto;display:flex;align-items:stretch;flex-direction:column;gap:3px;padding:10px;border:1px solid rgba(255,255,255,.16);border-radius:0 0 14px 14px;background:#101419;box-shadow:0 20px 40px rgba(0,0,0,.45)}
  .home-head.is-menu-open .home-nav a{min-height:42px;padding:0 14px}
}
@media (max-width:390px){.home-head .head-inner{gap:8px}.head-pro{height:38px;padding:0 8px}.head-account,.head-menu{width:36px;height:36px}}

/* Work with Enzino: a quiet line at the bottom of the homepage. */
.home-work { display: flex; align-items: center; justify-content: space-between; gap: 40px; margin-bottom: 72px; padding: 42px 44px; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; background: linear-gradient(120deg, rgba(232,100,45,.07), rgba(13,17,22,.6) 45%); }
.home-work-kicker { color: var(--accent); font-size: .68rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.home-work h2 { margin-top: 10px; max-width: 620px; font-size: clamp(1.4rem, 2.6vw, 1.9rem); line-height: 1.15; letter-spacing: -.035em; }
.home-work p:not(.home-work-kicker) { margin-top: 12px; max-width: 620px; color: rgba(255,255,255,.66); font-size: .9rem; line-height: 1.6; }
.home-work-cta { display: inline-flex; flex: none; align-items: center; gap: 9px; height: 46px; padding: 0 22px; border: 1px solid rgba(255,255,255,.28); border-radius: 30px; font-size: .86rem; font-weight: 700; white-space: nowrap; transition: border-color .2s, background .2s; }
.home-work-cta:hover { border-color: var(--accent); background: rgba(232,100,45,.1); }
@media (max-width: 760px) {
  .home-work { flex-direction: column; align-items: flex-start; padding: 30px 24px; gap: 22px; }
}

/* Bottom of the home page: one framed block (Pro) instead of four in a row.
   The trust points sit as a quiet line under the shelves, and the B2B offer
   reads as a closing paragraph rather than another card. */
.page-home-store .store-assurance { margin-top: 48px; margin-bottom: 0; border: 0; border-top: 1px solid rgba(255,255,255,.08); border-bottom: 1px solid rgba(255,255,255,.08); border-radius: 0; background: none; }
.page-home-store .store-assurance > div { border-right: 0; padding-left: 0; }
.page-home-store .home-pro { margin-top: 56px; }
.page-home-store .home-create-callout { margin-top: 40px; margin-bottom: 8px; }
.page-home-store .home-work { margin-top: 64px; padding: 44px 0 0; border: 0; border-top: 1px solid rgba(255,255,255,.08); border-radius: 0; background: none; }
@media (max-width: 760px) {
  .page-home-store .store-assurance > div { border-bottom: 1px solid rgba(255,255,255,.06); }
  .page-home-store .home-work { padding: 32px 0 0; }
}

/* Community poll: the same unframed treatment as "Work with Enzino", so the
   bottom of the page keeps a single framed block (Pro). */
.home-poll { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 48px; align-items: start; margin-top: 64px; padding-top: 44px; border-top: 1px solid rgba(255,255,255,.08); }
.home-poll[hidden] { display: none; }
.home-poll-kicker { color: var(--accent); font-size: .68rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.home-poll h2 { margin-top: 10px; font-size: clamp(1.4rem, 2.6vw, 1.9rem); line-height: 1.15; letter-spacing: -.035em; }
.home-poll-lead { margin-top: 12px; color: rgba(255,255,255,.62); font-size: .9rem; line-height: 1.6; }
.home-poll-options { display: grid; gap: 8px; }
.home-poll-option { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; min-height: 48px; padding: 12px 18px; border: 1px solid rgba(255,255,255,.14); border-radius: 12px; background: rgba(255,255,255,.02); color: #fff; font: inherit; font-size: .9rem; font-weight: 600; text-align: left; cursor: pointer; transition: border-color .2s, background .2s, transform .15s; }
.home-poll-option:hover { border-color: rgba(232,100,45,.6); background: rgba(232,100,45,.06); }
.home-poll-option:active { transform: scale(.995); }
.home-poll-label, .home-poll-pct { position: relative; z-index: 1; }
.home-poll-label b { color: var(--accent); }
.home-poll-pct { color: rgba(255,255,255,.7); font-size: .82rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.home-poll-bar { position: absolute; inset: 0 auto 0 0; background: rgba(255,255,255,.06); transition: width .6s cubic-bezier(.2,.7,.2,1); }
.home-poll-option.is-top .home-poll-bar { background: rgba(232,100,45,.16); }
.home-poll-option.is-mine { border-color: rgba(232,100,45,.7); }
.home-poll.is-busy .home-poll-option { opacity: .7; pointer-events: none; }
.home-poll-idea { margin-top: 16px; }
.home-poll-idea label { display: block; margin-bottom: 7px; color: rgba(255,255,255,.55); font-size: .78rem; font-weight: 600; }
.home-poll-idea div { display: flex; gap: 8px; }
.home-poll-idea input { flex: 1; min-width: 0; padding: 11px 14px; border: 1px solid rgba(255,255,255,.14); border-radius: 10px; background: rgba(0,0,0,.25); color: #fff; font: inherit; font-size: .86rem; }
.home-poll-idea input:focus { outline: none; border-color: var(--accent); }
.home-poll-idea button { padding: 0 18px; border: 1px solid rgba(255,255,255,.25); border-radius: 10px; background: transparent; color: #fff; font: inherit; font-size: .82rem; font-weight: 700; cursor: pointer; }
.home-poll-idea button:hover { border-color: var(--accent); }
.home-poll-status { min-height: 1.2em; margin-top: 10px; color: #6ede9f; font-size: .82rem; }
.home-poll-status.is-bad { color: #ff8a70; }
@media (max-width: 860px) { .home-poll { grid-template-columns: 1fr; gap: 22px; } }

/* The poll in its own card: neutral frame so Pro stays the orange one. */
.home-poll { margin-top: 56px; padding: 40px 44px; border: 1px solid rgba(255,255,255,.1); border-top-color: rgba(255,255,255,.1); border-radius: 18px;
  background: radial-gradient(120% 140% at 0% 0%, rgba(232,100,45,.09), transparent 45%), linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01)); }
.home-poll-option { background: rgba(7,10,13,.55); }
.home-poll-idea input { background: rgba(7,10,13,.55); }
@media (max-width: 860px) { .home-poll { padding: 28px 22px; } }

#popular[hidden] { display: none; }

/* Poll, a notch quieter than Pro: about 15 % less height. */
.home-poll { padding: 30px 40px; gap: 40px; }
.home-poll h2 { margin-top: 8px; font-size: clamp(1.25rem, 2.2vw, 1.6rem); }
.home-poll-lead { margin-top: 8px; font-size: .86rem; }
.home-poll-options { gap: 6px; }
.home-poll-option { min-height: 42px; padding: 9px 16px; font-size: .86rem; }
.home-poll-idea { margin-top: 12px; }
.home-poll-idea label { margin-bottom: 5px; }
.home-poll-idea input { padding: 9px 13px; }
.home-poll-status:empty { display: none; }
@media (max-width: 860px) { .home-poll { padding: 24px 20px; } }

/* ── phones ─────────────────────────────────────────────────────────────
   Two cards per row instead of one: the home was 8,900px tall on a phone,
   with each release card a full screen high. */
@media (max-width: 620px) {
  /* One card per row, a little less tall than on a computer so the page
     does not become endless. */
  #latest .home-products, #popular .home-products { grid-template-columns: 1fr; gap: 12px; }
  .page-home-store .home-product { aspect-ratio: .92; border-radius: 14px; }
  .page-home-store .home-product-copy { padding: 48px 14px 14px; }
  .page-home-store .home-product-price { flex-direction: row; align-items: baseline; justify-content: space-between; }
  /* Tighter rhythm on a phone: sections 28px apart, Featured right under the header. */
  .store-section { margin-top: 0; padding-top: 28px; }
  .page-home-store .store-featured { padding-top: 0; }
  .page-home-store .store-main { padding-top: 16px; }
  .store-section-head h1, .store-section-head h2 { font-size: 1.6rem; }
  /* Create banner: icon and text side by side, the link under the text. */
  .page-home-store .home-create-callout { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 4px 14px; min-height: 0; margin-top: 20px; margin-bottom: 0; padding: 16px; }
  .home-create-callout .home-create-icon { width: 44px; height: 44px; grid-row: span 2; }
  .home-create-callout > b { grid-column: 2; width: auto; margin: 6px 0 0; justify-content: flex-start; gap: 10px; }
  .home-poll { margin-top: 36px; }
  .home-pro { margin-top: 40px; }
}
@media (max-width: 620px) {
  .store-feature-meta u, .store-feature-copy > small { font-size: .66rem; }
}

/* Featured on a phone: one card across the full width, small arrows on it to
   go to the next pick (swiping works too), dots saying where you are. */
.store-feature-dots, .store-feature-arrow { display: none; }
@media (max-width: 620px) {
  .store-feature-slider { position: relative; }
  .store-feature-grid { display: flex; gap: 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; border-radius: 11px; }
  .store-feature-grid::-webkit-scrollbar { display: none; }
  .store-feature-grid > .store-feature-card, .store-feature-card:nth-child(n+2), .store-feature-card:last-child { display: block; flex: 0 0 100%; scroll-snap-align: start; height: 280px; }
  .store-feature-arrow { position: absolute; top: 50%; z-index: 3; display: grid; place-items: center; width: 34px; height: 34px; margin-top: -17px; padding: 0; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; background: rgba(7,10,13,.55); color: #fff; cursor: pointer; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
  .store-feature-arrow svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; }
  .store-feature-arrow.is-prev { left: 8px; } .store-feature-arrow.is-next { right: 8px; }
  .store-feature-arrow[hidden] { display: none; }
  .store-feature-dots { display: flex; justify-content: center; gap: 6px; margin-top: 10px; }
  .store-feature-dots i { width: 6px; height: 6px; border-radius: 6px; background: rgba(255,255,255,.25); transition: width .25s, background .25s; }
  .store-feature-dots i.is-on { width: 18px; background: var(--accent); }
  .store-feature-dots:has(i:only-child) { display: none; }
}

/* ── phone menu ─────────────────────────────────────────────────────────── */
.mnav { display: none; }
@media (max-width: 820px) {
  .home-head.is-menu-open .home-nav { display: none !important; }
  .mnav:not([hidden]) { position: fixed; left: 0; right: 0; bottom: 0; z-index: 69; display: flex; flex-direction: column; gap: 18px; padding: 18px 18px 28px; overflow-y: auto; background: #080b0e; animation: mnavIn .22s ease-out; }
  @keyframes mnavIn { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
  /* No overflow lock on the page: on pages whose body clips sideways (Create),
     it made the body its own scroller and the page jumped. The panel covers
     the page and keeps its own scroll instead. */
  .mnav, .head-account-menu.is-panel { overscroll-behavior: contain; }
  .home-head.is-menu-open .head-menu span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
  .home-head.is-menu-open .head-menu span:nth-child(2) { opacity: 0; }
  .home-head.is-menu-open .head-menu span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
  .head-menu span { transition: transform .2s, opacity .2s; }
  .mnav-search { display: flex; align-items: center; gap: 10px; padding: 0 16px; height: 48px; border: 1px solid rgba(255,255,255,.14); border-radius: 14px; background: rgba(255,255,255,.04); }
  .mnav-search svg { width: 18px; height: 18px; flex: none; color: rgba(255,255,255,.5); fill: none; stroke: currentColor; stroke-width: 2; }
  .mnav-search input { flex: 1; min-width: 0; border: 0; background: none; color: #fff; font: inherit; font-size: .95rem; outline: none; }
  .mnav-list { display: grid; gap: 2px; }
  .mnav-item { display: flex; align-items: center; gap: 14px; padding: 12px 6px; border-radius: 12px; color: #fff; text-decoration: none; }
  .mnav-item:active, .mnav-item.is-on { background: rgba(255,255,255,.05); }
  .mnav-item i { width: 40px; height: 40px; flex: none; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; color: rgba(255,255,255,.85); }
  .mnav-item i svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .mnav-item span { display: grid; gap: 2px; flex: 1; min-width: 0; }
  .mnav-item strong { font-size: 1.02rem; font-weight: 700; }
  .mnav-item small { color: rgba(255,255,255,.5); font-size: .78rem; }
  .mnav-item b { color: rgba(255,255,255,.3); font-weight: 400; }
  .mnav-item.is-create i { border-color: rgba(232,100,45,.5); background: rgba(232,100,45,.12); color: var(--accent); }
  .mnav-item.is-create b { color: var(--accent); }
  .mnav-more { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.08); }
  .mnav-more a { padding: 9px 14px; border: 1px solid rgba(255,255,255,.14); border-radius: 20px; color: rgba(255,255,255,.8); font-size: .84rem; font-weight: 600; text-decoration: none; }
  .mnav-pro { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px; border: 1px solid rgba(232,100,45,.45); border-radius: 16px; background: linear-gradient(120deg, rgba(232,100,45,.16), rgba(232,100,45,.04)); color: #fff; text-decoration: none; }
  .mnav-pro span { display: grid; gap: 3px; }
  .mnav-pro strong { font-size: .98rem; }
  .mnav-pro small { color: rgba(255,255,255,.6); font-size: .78rem; }
  .mnav-pro b { flex: none; padding: 9px 14px; border-radius: 20px; background: var(--accent); font-size: .82rem; }
  .mnav-account { display: flex; align-items: center; gap: 10px; padding: 4px 6px; color: rgba(255,255,255,.75); font-size: .9rem; font-weight: 600; text-decoration: none; }
  .mnav-account svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
}

/* Account menu: icons and a line each; on a phone, the same full panel as the site menu. */
.head-account-menu { min-width: 250px; }
.head-account-menu a { gap: 10px; min-height: 44px; }
.head-account-menu a i { width: 30px; height: 30px; flex: none; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 9px; color: rgba(255,255,255,.8); }
.head-account-menu a i svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.head-account-menu a span { display: grid; gap: 1px; }
.head-account-menu a strong { font-size: .78rem; }
.head-account-menu a small { color: rgba(255,255,255,.45); font-size: .66rem; font-weight: 500; }
.ham-who { display: flex; align-items: center; gap: 10px; padding: 6px 10px 12px; margin-bottom: 4px; border-bottom: 1px solid rgba(255,255,255,.09); }
.ham-who b { width: 34px; height: 34px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--accent); color: #0b0d0f; font-size: .9rem; }
.ham-who span { display: grid; gap: 2px; min-width: 0; }
.ham-who strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .82rem; }
.ham-who small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: rgba(255,255,255,.5); font-size: .7rem; }
.ham-who.is-guest { padding-left: 12px; }
@media (max-width: 820px) {
  .head-account-menu.is-panel:not([hidden]) { position: fixed; left: 0; right: 0; bottom: 0; min-width: 0; z-index: 69; display: flex; flex-direction: column; gap: 18px; padding: 18px 18px 28px; overflow-y: auto; border: 0; border-radius: 0; background: #080b0e; box-shadow: none; animation: mnavIn .22s ease-out; }
  .head-account-menu.is-panel a, .head-account-menu.is-panel button { font: inherit; }
  .head-account-menu.is-panel .mnav-item { min-height: 0; padding: 12px 6px; border-radius: 12px; }
  .head-account-menu.is-panel .mnav-item:hover { background: rgba(255,255,255,.05); }
  .head-account-menu.is-panel .mnav-item i { width: 40px; height: 40px; border-radius: 12px; }
  .head-account-menu.is-panel .mnav-item i svg { width: 19px; height: 19px; }
  .head-account-menu.is-panel .mnav-item strong { font-size: 1.02rem; font-weight: 700; }
  .head-account-menu.is-panel .mnav-item small { font-size: .78rem; font-weight: 400; }
  .head-account-menu.is-panel .mnav-pro { padding: 16px; min-height: 0; border: 1px solid rgba(232,100,45,.45); border-radius: 16px; background: linear-gradient(120deg, rgba(232,100,45,.16), rgba(232,100,45,.04)); color: #fff; }
  .head-account-menu.is-panel .mnav-pro strong { font-size: .98rem; }
  .head-account-menu.is-panel .mnav-pro small { font-size: .78rem; }
  .head-account-menu.is-panel .mnav-pro b { font-size: .82rem; }
  .head-account-menu.is-panel .mnav-item b { font-weight: 400; }
  .mnav-who { display: flex; align-items: center; gap: 14px; padding: 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 16px; background: rgba(255,255,255,.03); }
  .mnav-who > b { width: 46px; height: 46px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--accent); color: #0b0d0f; font-size: 1.15rem; font-weight: 800; }
  .mnav-who.is-guest > b { background: rgba(255,255,255,.08); color: rgba(255,255,255,.8); }
  .mnav-who > b svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; }
  .mnav-who span { display: grid; gap: 3px; min-width: 0; }
  .mnav-who strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 1.02rem; }
  .mnav-who small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: rgba(255,255,255,.5); font-size: .8rem; }
  .head-account-menu.is-panel .mnav-signout { min-height: 48px; margin: 0; padding: 0 16px; border: 1px solid rgba(255,255,255,.14) !important; border-radius: 14px !important; background: none; color: rgba(255,255,255,.8); font-size: .92rem; font-weight: 600; justify-content: center; cursor: pointer; }
}

/* Coming soon on the home cards: badge under the kind, highlight, no price. */
/* Kind and Coming soon side by side, in the corner the kind badge uses alone. */
.badge-row { position: absolute; z-index: 2; top: 11px; left: 11px; display: flex; align-items: center; gap: 6px; }
.badge-row .home-product-kind { position: static; }
.store-feature-card .badge-row > b:first-child { padding: 4px 9px; border: 1px solid rgba(255,255,255,.25); border-radius: 12px; background: rgba(5,8,11,.72); font-size: .57rem; text-transform: uppercase; }
.soon-line { display: block; margin-top: 6px; color: rgba(255,255,255,.78); font-size: .76rem; }
.home-product.is-soon .home-price-amount b, .store-feature-card.is-soon .store-feature-meta i { color: var(--accent); }