/* =========================================================================
   Home — the sections below the hero
   ========================================================================= */

/* ---- Why S.A.R. ---- */
.why { padding-block:clamp(3.5rem,8vw,6.5rem); background:var(--bg); }
.why__inner {
  display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  align-items:center; gap:clamp(2rem,6vw,5rem);
}
.why__story .section-title { max-width:15ch; font-size:clamp(1.875rem,3.6vw,2.75rem); }
.why__story .accent { color:var(--red); }
:root[data-theme="dark"] .why__story .accent { color:var(--red-on-dark); }
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .why__story .accent { color:var(--red-on-dark); }
}
.why__story .lead { margin:1.125rem 0 0; max-width:46ch; }

.why__list { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.why__item {
  margin:0; padding:1.5rem; background:var(--surface); border:1px solid var(--line);
  border-radius:1.25rem; box-shadow:var(--shadow-1);
  transition:transform .25s cubic-bezier(.4,0,.2,1), box-shadow .28s ease, border-color .2s ease;
}
.why__item:hover { transform:translateY(-0.25rem); box-shadow:var(--shadow-2); }
.why__item:nth-child(even) { translate:0 1.5rem; }
.why__icon {
  width:2.75rem; height:2.75rem; padding:0.6875rem; border-radius:0.875rem;
  background:var(--tint); color:var(--red);
}
.why__title { margin:1rem 0 0.375rem; font-family:var(--font-display); font-weight:700; font-size:1.0625rem; line-height:1.25; letter-spacing:-.01em; color:var(--ink); }
.why__text { margin:0; font-size:0.9375rem; line-height:1.5; color:var(--muted); }
:root[data-theme="dark"] .why__icon { color:var(--red-on-dark); }
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .why__icon { color:var(--red-on-dark); }
}

/* ---- Featured products ---- */
.home-products { padding-block:clamp(3.5rem,8vw,6rem); background:var(--surface); border-block:1px solid var(--line); }
.home-products__head { display:flex; align-items:flex-end; justify-content:space-between; gap:1.5rem; margin-bottom:2rem; }
.home-products__head .eyebrow { margin-bottom:0.5rem; }
.home-products__head .section-title { margin:0; }
.home-products__all {
  display:inline-flex; align-items:center; gap:0.5rem; flex-shrink:0; padding-bottom:0.375rem;
  text-decoration:none; color:var(--ink);
  font-family:var(--font-display); font-weight:600; font-size:0.9375rem;
}
.home-products__all svg { width:1.125rem; height:1.125rem; transition:transform .2s ease; }
.home-products__all:hover { color:var(--red); }
.home-products__all:hover svg { transform:translateX(0.25rem); }
:root[data-theme="dark"] .home-products__all:hover { color:var(--red-on-dark); }
.home-products .pcard { background:var(--bg); }

/* ---- All categories ---- */
.home-cats { padding-block:clamp(2.25rem,4.5vw,3.5rem) 0; background:var(--bg); }
.home-cats + .advice { padding-top:clamp(2.25rem,4.5vw,3.5rem); }
.home-cats__head { margin-bottom:1.5rem; }
.home-cats__head .eyebrow { margin-bottom:0.5rem; }
.home-cats__head .section-title { margin:0; }
.home-cats__grid { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.home-cats__item { margin:0; min-width:0; }
.home-cats__card {
  display:flex; align-items:center; gap:1rem; height:100%; padding:1rem 1.125rem 1rem 1rem; text-decoration:none;
  background:var(--surface); border:1px solid var(--line); border-radius:1.125rem; box-shadow:var(--shadow-1);
  transition:transform .25s cubic-bezier(.4,0,.2,1), box-shadow .28s ease, border-color .2s ease;
}
.home-cats__card:hover { transform:translateY(-0.1875rem); box-shadow:var(--shadow-2); border-color:var(--red); }
.home-cats__card:focus-visible { outline:none; border-color:var(--red); box-shadow:0 0 0 3px var(--focus); }
.home-cats__mark {
  display:flex; align-items:center; justify-content:center; flex:0 0 auto;
  width:3.5rem; height:3.5rem; border-radius:0.875rem; background:var(--tint); color:var(--red); overflow:hidden;
}
.home-cats__icon { width:1.625rem; height:1.625rem; }
.home-cats__icon--drawing { width:2.5rem; height:2.5rem; }
.home-cats__image { width:100%; height:100%; object-fit:cover; display:block; margin:0; }
.home-cats__body { display:flex; flex-direction:column; gap:0.1875rem; min-width:0; flex:1 1 auto; }
.home-cats__name { font-family:var(--font-display); font-weight:700; font-size:1.0625rem; line-height:1.25; letter-spacing:-.01em; color:var(--ink); }
.home-cats__count { font-family:var(--font-label); font-size:0.8125rem; color:var(--muted); font-variant-numeric:tabular-nums; }
.home-cats__arrow { width:1.125rem; height:1.125rem; flex:0 0 auto; color:var(--muted); transition:transform .2s ease, color .2s ease; }
.home-cats__card:hover .home-cats__arrow { transform:translateX(0.25rem); color:var(--red); }
:root[data-theme="dark"] .home-cats__mark,
:root[data-theme="dark"] .home-cats__card:hover .home-cats__arrow { color:var(--red-on-dark); }
:root[data-theme="dark"] .home-cats__card:hover { border-color:var(--red-on-dark); }
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .home-cats__mark,
  :root:not([data-theme="light"]) .home-cats__card:hover .home-cats__arrow { color:var(--red-on-dark); }
  :root:not([data-theme="light"]) .home-cats__card:hover { border-color:var(--red-on-dark); }
}

/* ---- Advice and contact ---- */
.advice { padding-block:clamp(3rem,7vw,5.5rem); background:var(--bg); }
.advice__band {
  position:relative; overflow:hidden; isolation:isolate;
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); align-items:center;
  gap:clamp(1.75rem,5vw,4rem); padding:clamp(1.75rem,5vw,3.5rem);
  background:var(--anthracite); color:#fff; border:1px solid #000; border-radius:1.75rem;
}
.advice__band::before {
  content:""; position:absolute; z-index:-1; width:34rem; height:34rem; right:-10rem; top:-14rem; border-radius:50%;
  background:radial-gradient(closest-side, rgba(225,37,27,.38), rgba(225,37,27,0));
}
.advice__kick { margin:0 0 0.75rem; font-family:var(--font-label); font-size:0.75rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); }
.advice__title { margin:0; font-family:var(--font-display); font-weight:800; font-size:clamp(1.625rem,3.2vw,2.375rem); line-height:1.08; letter-spacing:-.02em; color:#fff; text-wrap:balance; }
.advice__text { margin:1rem 0 0; max-width:44ch; font-size:1.0625rem; line-height:1.5; color:rgba(255,255,255,.78); }
.advice__meta { margin:1.5rem 0 0; font-size:0.8125rem; line-height:1.6; color:rgba(255,255,255,.55); }

.advice__actions { display:flex; flex-direction:column; gap:0.75rem; }
.advice__link {
  display:flex; align-items:center; gap:1rem; padding:1rem 1.25rem; text-decoration:none;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14); border-radius:1rem; color:#fff;
  font-family:var(--font-display); font-weight:700; font-size:1.125rem; line-height:1.2;
  transition:background .2s ease, border-color .2s ease, transform .2s cubic-bezier(.4,0,.2,1);
}
.advice__link svg { width:1.5rem; height:1.5rem; flex-shrink:0; }
.advice__link span { display:flex; flex-direction:column; min-width:0; overflow-wrap:anywhere; }
.advice__link small { font-family:var(--font-label); font-weight:500; font-size:0.6875rem; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.6); margin-bottom:0.1875rem; }
.advice__link:hover { background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.3); color:#fff; transform:translateY(-0.125rem); }
.advice__link--phone { background:var(--red); border-color:transparent; }
.advice__link--phone small { color:rgba(255,255,255,.8); }
.advice__link--phone:hover { background:var(--red-strong); border-color:transparent; }
.advice__link:focus-visible, .advice__more:focus-visible { outline:none; box-shadow:0 0 0 3px var(--focus); }
.advice__more {
  display:inline-flex; align-items:center; gap:0.5rem; align-self:flex-start; margin-top:0.25rem; padding:0.25rem 0;
  text-decoration:none; color:rgba(255,255,255,.8); font-family:var(--font-display); font-weight:600; font-size:0.9375rem;
}
.advice__more svg { width:1.125rem; height:1.125rem; transition:transform .2s ease; }
.advice__more:hover { color:#fff; }
.advice__more:hover svg { transform:translateX(0.25rem); }

@media (max-width:900px){
  .why__inner { grid-template-columns:minmax(0,1fr); }
  .why__item:nth-child(even) { translate:none; }
  .home-cats__grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .advice__band { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:560px){
  .home-cats__grid { grid-template-columns:minmax(0,1fr); gap:0.625rem; }
  .home-cats__mark { width:3rem; height:3rem; }
  .why__list { grid-template-columns:minmax(0,1fr); }
  .why__item { display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:1rem; padding:1.125rem; }
  .why__icon { grid-row:1 / span 2; }
  .why__title { margin-top:0; }
  .home-products__head { flex-direction:column; align-items:flex-start; gap:0.75rem; }
  .advice__link { font-size:1rem; }
}