/* Homepage-only Appllama polish: compact commerce hierarchy, calm surfaces, mobile-first. */
:root{
  --home-bg:#f7f8fb;
  --home-surface:#fff;
  --home-line:#e4e7ec;
  --home-text:#101828;
  --home-muted:#667085;
  --home-accent:#2457f5;
  --home-accent-soft:#eef3ff;
  --home-radius:12px;
  --home-radius-sm:9px;
}

body.home-dark{background:var(--home-bg)!important;color:var(--home-text)!important}
body.home-dark main{padding-top:4px!important;padding-bottom:28px!important}.home-dark .home-banner{padding-top:4px!important}
body.home-dark .site-header{box-shadow:0 1px 8px rgba(16,24,40,.04)!important}
.home-shell{width:min(1180px,calc(100% - 48px));margin-inline:auto}

/* Header: quiet, legible, and subordinate to the purchase surface. */
.header-tools{gap:8px}
.header-search{width:40px;height:40px;border-radius:9px;font-size:25px}
.login-pill{height:40px;padding-inline:16px;border-radius:9px;font-size:13px}
.header-search:focus-visible,.login-pill:focus-visible,.category-chip:focus-visible,.product-card:focus-visible,.contact-action:focus-visible{outline:3px solid rgba(36,87,245,.22);outline-offset:2px}

/* Banner is a visual entry point, not a tall hero that pushes products below fold. */
.home-dark .home-banner{padding-top:4px!important}
.banner-main{aspect-ratio:14/5;border-radius:var(--home-radius);box-shadow:0 5px 16px rgba(16,24,40,.07)}
.banner-main.banner-empty{background:#eef3ff}
.hero-dots{padding-top:8px}
.hero-dots span{width:18px;height:5px}

/* Category controls behave like a compact filter rail. */
.category-strip{gap:8px;padding-top:12px;padding-bottom:2px}
.category-chip{min-height:36px;padding-inline:12px;border:1px solid var(--home-line);border-radius:var(--home-radius-sm);box-shadow:none;font-size:12px;font-weight:800;color:#344054;transition:background .16s ease,border-color .16s ease,color .16s ease}
.category-chip.active{background:var(--home-accent);border-color:var(--home-accent);color:#fff}
.category-chip b{font-size:14px}

/* Product discovery gets the strongest hierarchy and predictable loading space. */
.home-section{padding-top:32px}
.home-section-head{margin-bottom:12px}
.home-section-head>div>span{font-size:10px;letter-spacing:.12em;color:#98a2b3}
.home-section-head h2{font-size:23px;letter-spacing:-.03em;margin-top:2px}
.home-section-head>a{font-size:12px;color:#1d4ed8;font-weight:800}
.product-panel{min-height:216px;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
.product-row{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.product-row:has(.empty-admin){display:grid;place-items:center;min-height:180px;border:1px dashed #cfd6e2;border-radius:var(--home-radius);background:#fbfcfe}
.product-card{border:1px solid var(--home-line);border-radius:var(--home-radius-sm);box-shadow:0 2px 8px rgba(16,24,40,.045);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
.product-card:hover{transform:translateY(-2px);border-color:#b7c7fa;box-shadow:0 8px 18px rgba(36,87,245,.10)}
.product-thumb{aspect-ratio:1;border-radius:0;padding:8px}
.product-info{padding:9px 10px 10px}
.product-info strong{font-size:12px}
.product-info span{font-size:10px;color:#667085}

/* How-to remains a sequence, not four unrelated cards. */
.how-section{padding-top:28px}
.how-steps{border:1px solid var(--home-line);border-radius:var(--home-radius);background:#fff;box-shadow:none}
.how-step{padding:15px 14px}
.how-step>b{width:28px;height:28px;border-radius:8px;font-size:10px}
.how-step strong{font-size:12.5px}
.how-step span{font-size:10.5px}

/* Features are supporting content: restrained borders, no card pile. */
.feature-section{padding-top:30px}
.feature-grid{gap:10px}
.feature-card{min-height:104px;padding:14px;border:1px solid var(--home-line);border-radius:var(--home-radius-sm);box-shadow:none}
.feature-icon{width:32px;height:32px;border-radius:8px;font-size:15px}
.feature-card strong{font-size:12px}
.feature-card span{font-size:10px}

.help-section,.contact-section{padding-top:30px}
.faq-list{border:1px solid var(--home-line);border-radius:var(--home-radius);box-shadow:none}
.faq-list summary{font-size:12.5px;padding:15px 0}
.faq-list p{font-size:11px;margin-bottom:15px}
.contact-actions{gap:10px}
.contact-action{min-height:70px;padding:12px;border:1px solid var(--home-line);border-radius:var(--home-radius-sm);box-shadow:none}
.contact-action:hover{border-color:#b7c7fa;background:#fbfcff}

.home-footer{margin-top:40px!important;border-top:1px solid var(--home-line)}

@media(max-width:1000px){
  .product-row{grid-template-columns:repeat(4,minmax(0,1fr))}
  .feature-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  .home-dark .home-banner{padding-top:8px!important}
  .home-dark main{padding-top:60px!important}
  .banner-main{aspect-ratio:16/7;border-radius:10px}
  .category-strip{width:100%!important;padding:10px 16px 2px;gap:7px}
  .category-chip{min-height:36px;padding-inline:11px;font-size:11.5px}
  .home-section{padding-top:26px}
  .home-section-head h2{font-size:21px}
  .product-panel{min-height:190px}
  .product-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .product-row:has(.empty-admin){min-height:150px}
  .product-card{border-radius:8px}
  .product-info{padding:7px 7px 8px}
  .product-info strong{font-size:10.5px}
  .product-info span{font-size:9px}
  .how-steps{grid-template-columns:1fr 1fr}
  .how-step{padding:13px 11px;gap:8px}
  .how-step strong{font-size:11.5px}
  .how-step span{font-size:10px}
  .feature-grid{grid-template-columns:1fr 1fr}
  .feature-card{min-height:96px;padding:12px}
  .feature-card span{font-size:9.5px}
  .contact-actions{grid-template-columns:1fr}
  .home-footer{margin-top:30px!important}
}
@media(max-width:380px){
  .home-shell,.home-banner{width:calc(100% - 24px)!important}
  .category-strip{padding-inline:12px}
  .product-row{gap:6px}
  .product-info{padding-inline:6px}
  .product-info strong{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.product-card,.category-chip,.contact-action{transition:none}}