/* [dpi_home] — stili del CONTENUTO della home.
   Stanno nel PLUGIN e non nel tema apposta: lo shortcode deve reggersi anche su un sito che
   il child theme non ce l'ha. I token (--blue, --ink, --pad…) li definisce il tema; qui ci
   sono i ripieghi, cosi' nulla resta senza colore se il tema manca. */
.dpi-home{
  --bg:var(--bg,#f2f2f3); --ink:var(--ink,#1d1f20); --ink-2:#424244; --muted:#7a7a7d; --muted-2:#5d5d60;
  --line:rgba(29,31,32,.16); --line-strong:rgba(29,31,32,.28); --line-card:rgba(29,31,32,.24);
  --blue:var(--blue,#5980a6); --blue-deep:var(--blue-deep,#416180); --navy:var(--navy,#1d2d3d); --sky:var(--sky,#94bce3);
  --pad:var(--pad,48px);
  --h-body:"Barlow",system-ui,sans-serif; --h-cond:"Barlow Condensed",system-ui,sans-serif;
  font-family:var(--h-body);color:var(--ink);background:var(--bg);
}
.dpi-home h1,.dpi-home h2,.dpi-home h3{margin:0}
.dpi-home a{text-decoration:none;color:inherit}

.dpi-home .hero{display:grid;grid-template-columns:1.05fr .95fr;border-bottom:1px solid var(--line)}
.dpi-home .hero .copy{position:relative;padding:64px var(--pad) 56px;display:flex;flex-direction:column;gap:20px;border-right:1px solid var(--line)}
.dpi-home .hero h1{font:700 78px/.92 var(--h-cond);letter-spacing:-.015em;text-transform:uppercase}
.dpi-home .hero .lead{margin:0;max-width:430px;font:400 17px/1.55 var(--h-body);color:var(--ink-2);text-wrap:pretty}
.dpi-home .hero .cta-row{display:flex;gap:12px;margin-top:6px;flex-wrap:wrap}
.dpi-home .hero .shot{min-height:560px}
.dpi-home .btn-primary{background:var(--blue);color:#fff;padding:14px 22px;font:600 13px/1 var(--h-cond);letter-spacing:.16em;text-transform:uppercase;position:relative;border:0;display:inline-block}
.dpi-home .btn-outline{border:1px solid var(--ink);padding:14px 22px;font:600 13px/1 var(--h-cond);letter-spacing:.16em;text-transform:uppercase;background:transparent;display:inline-block}
.dpi-home .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}
.dpi-home .stats > div{display:flex;flex-direction:column;gap:4px}
.dpi-home .stats .n{font:700 34px/1 var(--h-cond)}
.dpi-home .stats .k{font:500 10px/1.3 var(--h-cond);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

.dpi-home .sec{padding:56px var(--pad) 8px}
.dpi-home .sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:26px}
.dpi-home .sec-head h2{font:700 42px/1 var(--h-cond);text-transform:uppercase}
.dpi-home .sec-head .more{font:600 12px/1 var(--h-cond);letter-spacing:.16em;text-transform:uppercase;color:var(--blue-deep)}
.dpi-home .sec-head .headL{display:flex;flex-direction:column;gap:8px}
.dpi-home .g3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.dpi-home .g4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}

.dpi-home .scard{position:relative;border:1px solid var(--line-card);display:block}
.dpi-home .scard .duo{aspect-ratio:16/10;margin:10px 10px 0;width:calc(100% - 20px)}
.dpi-home .scard .body{padding:16px 18px 20px;display:flex;flex-direction:column;gap:8px}
.dpi-home .scard h3{font:600 22px/1 var(--h-cond);text-transform:uppercase}
.dpi-home .scard p{margin:0;font:400 14px/1.5 var(--h-body);color:var(--muted-2)}
.dpi-home .scard .lead-link{font:600 11px/1 var(--h-cond);letter-spacing:.16em;text-transform:uppercase;color:var(--blue-deep);margin-top:4px}

.dpi-home .pcard{position:relative;border:1px solid var(--line-card);padding:10px 10px 0;display:block}
.dpi-home .pcard .duo{aspect-ratio:4/5}
.dpi-home .pcard .body{padding:14px 8px 18px;display:flex;flex-direction:column;gap:6px}
.dpi-home .pcard .cat{font:500 10px/1 var(--h-cond);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.dpi-home .pcard .ttl{font:600 17px/1.1 var(--h-cond);text-transform:uppercase}
.dpi-home .pcard .price{display:flex;justify-content:space-between;align-items:baseline;margin-top:2px;gap:8px}
.dpi-home .pcard .price b{font:600 16px/1 var(--h-body)}
.dpi-home .pcard .price small{font:400 11px/1 var(--h-body);color:var(--muted)}
.dpi-home .pcard .price .woocommerce-Price-amount{font:600 16px/1 var(--h-body)}
.dpi-home .pcard del{opacity:.5;font-weight:400}

.dpi-home .look{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.dpi-home .look .duo{aspect-ratio:9/16}

.dpi-home .ctaband{background:var(--blue);color:#fff;padding:46px var(--pad);display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap;margin-top:56px}
.dpi-home .ctaband h2{font:700 40px/1 var(--h-cond);text-transform:uppercase}
.dpi-home .ctaband p{margin:0;font:400 16px/1.5 var(--h-body);color:rgba(255,255,255,.88)}
.dpi-home .ctaband .btns{display:flex;gap:12px;flex-wrap:wrap}
.dpi-home .ctaband .w{background:#fff;color:var(--ink);padding:15px 24px;font:600 13px/1 var(--h-cond);letter-spacing:.16em;text-transform:uppercase}
.dpi-home .ctaband .o{border:1px solid rgba(255,255,255,.7);padding:15px 24px;font:600 13px/1 var(--h-cond);letter-spacing:.16em;text-transform:uppercase}

@media (max-width:1100px){.dpi-home .hero h1{font-size:64px}.dpi-home .g4{grid-template-columns:repeat(2,1fr)}.dpi-home .look{grid-template-columns:repeat(3,1fr)}}
@media (max-width:820px){.dpi-home .hero{grid-template-columns:1fr}.dpi-home .hero .copy{border-right:0;border-bottom:1px solid var(--line);padding:44px var(--pad)}.dpi-home .hero .shot{min-height:340px}}
@media (max-width:640px){.dpi-home .g3,.dpi-home .g4{grid-template-columns:1fr}.dpi-home .look{grid-template-columns:repeat(2,1fr)}.dpi-home .hero h1{font-size:52px}.dpi-home .sec-head{flex-direction:column;align-items:flex-start}.dpi-home .sec-head h2,.dpi-home .ctaband h2{font-size:34px}.dpi-home .stats .n{font-size:28px}}
