/* Probare în cameră (NoGuess): secțiunea de pe homepage (.htr) și banda de sub poza produsului (.atr-strip). */
.htr,.atr-strip{--t-ink:#202322;--t-muted:#5f655f;--t-line:#dce4d5;--t-paper:#f3f6ef;--t-green:#283526;--t-accent:#ffcf32}
.htr *,.atr-strip *{box-sizing:border-box}

/* Homepage */
.htr{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:44px;align-items:center;background:var(--t-paper);border:1px solid var(--t-line);border-radius:22px;padding:22px 48px 22px 22px;margin:44px 0;color:var(--t-ink)}
.htr-media{position:relative;margin:0;border-radius:16px;overflow:hidden;aspect-ratio:3/2;background:#e6e2da}
.htr-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:62% 50%}
.htr-badge{position:absolute;left:16px;top:16px;background:var(--t-accent);color:var(--t-ink);font-size:11px;font-weight:700;letter-spacing:.12em;padding:7px 12px;border-radius:999px}
.htr-kicker{display:block;font-size:11px;letter-spacing:.14em;font-weight:600;color:#3f5a34}
.htr h2{font-size:clamp(30px,3.3vw,44px);line-height:1.08;letter-spacing:-.03em;margin:14px 0 16px;color:var(--t-ink)}
.htr .htr-copy>p{font-size:16px;line-height:1.65;color:#3a3f3a;margin:0 0 22px;max-width:560px}
.htr-steps{list-style:none;padding:0;margin:0 0 26px;display:grid;gap:10px}
.htr-steps li{display:flex;align-items:center;gap:12px;font-size:15px;line-height:1.4}
.htr-steps b{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--t-green);color:#fff;font-size:13px}
.htr-actions{display:flex;flex-wrap:wrap;gap:12px}
.htr-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:10px 24px;border-radius:10px;font-weight:600;font-size:15px;line-height:1.25;text-align:center;text-decoration:none!important;transition:filter .2s,background .2s,border-color .2s}
.htr-btn .al-icon{width:18px;height:18px}
.htr-btn-accent{background:var(--t-accent);color:var(--t-ink)!important}
.htr-btn-accent:hover{filter:brightness(1.04)}
.htr-btn-ghost{border:1px solid #20232233;color:var(--t-ink)!important;background:#fff}
.htr-btn-ghost:hover{border-color:var(--t-ink)}
.htr-btn:focus-visible{outline:3px solid var(--t-green);outline-offset:3px}
.htr .htr-copy>p.htr-note{margin:18px 0 0;font-size:13px;line-height:1.55;color:var(--t-muted);max-width:520px}

/* Pagina produsului */
.atr-strip{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;column-gap:12px;row-gap:6px;width:100%;margin:12px 0 0;padding:12px 14px;border:1px solid #efd98a;border-radius:12px;background:#fff9e3;color:var(--t-ink);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,background .2s}
.atr-strip[hidden]{display:none!important}
.atr-strip:hover{border-color:var(--t-accent);background:#fff5d1}
.atr-strip:focus-visible{outline:3px solid var(--t-green);outline-offset:2px}
.atr-strip-icon{grid-row:1/3;align-self:start;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:var(--t-accent);color:var(--t-ink)}
.atr-strip-text{grid-column:2;min-width:0;display:grid;gap:2px}
.atr-strip-text strong{font-size:14px;line-height:1.3;font-weight:600}
.atr-strip-text span{font-size:12px;line-height:1.4;color:var(--t-muted)}
.atr-strip-go{grid-column:3;grid-row:1/3;font-size:13px;font-weight:600;white-space:nowrap}
/* Galerie îngustă (tabletă, mobil, designul clasic): butonul trece sub text. */
.atr-strip.is-narrow{grid-template-columns:38px minmax(0,1fr)}
.atr-strip.is-narrow .atr-strip-go{grid-column:2;grid-row:auto}
@container (max-width:460px){.atr-strip{grid-template-columns:38px minmax(0,1fr)}.atr-strip .atr-strip-go{grid-column:2;grid-row:auto}}

@media (max-width:1024px){
  .htr{grid-template-columns:1fr;padding:22px 22px 34px;gap:28px}
  .htr-copy{padding:0 12px}
}
@media (max-width:640px){
  .htr{padding:14px 14px 26px;margin:30px 0;border-radius:18px;gap:22px}
  .htr-copy{padding:0 6px}
  .htr-media{aspect-ratio:4/3}
  .htr-media img{object-position:66% 50%}
  .htr h2 br{display:none}
  .htr .htr-copy>p{font-size:15px}
  .htr-steps li{font-size:14px}
  .htr-btn{width:100%}
}
@media (prefers-reduced-motion:reduce){.htr *,.atr-strip{transition:none!important}}