/* Devin Flora — Stili del tema (base, tipografia, componenti, header, footer, homepage)
   Estratti dal prototipo. Usano le variabili in tokens.css. */

/* ===== DESIGN TOKENS (dal sistema di design v1.2) ===== */

*{ box-sizing:border-box; }
html,body{ margin:0; }
body{ background:var(--df-cream); color:var(--df-ink); font-family:var(--df-font-sans); -webkit-font-smoothing:antialiased; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; }
img{ display:block; max-width:100%; }

/* =========================================================
   ANNOUNCEMENT BAR
   ========================================================= */
.df-announce{
  background:var(--df-forest-900); color:var(--df-cream);
  font-size:13.5px; line-height:1.3; min-height:40px;
  display:flex; align-items:center; justify-content:center; padding:7px 44px; position:relative;
}
.df-announce__track{ text-align:center; }
.df-announce__msg{ display:none; align-items:center; gap:8px; justify-content:center; }
.df-announce__msg.is-active{ display:inline-flex; }
.df-announce__msg b{ color:var(--df-gold-500); font-weight:700; }
.df-announce .sprig{ width:15px; height:15px; color:var(--df-gold-500); flex:none; }
.df-announce__phone{ position:absolute; right:16px; top:50%; transform:translateY(-50%); display:none; align-items:center; gap:6px; font-weight:600; font-size:12.5px; color:#E7EFE9; }
.df-announce__phone svg{ width:14px; height:14px; }

/* =========================================================
   HEADER BAR
   ========================================================= */
.df-header{
  position:sticky; top:0; z-index:60;
  background:var(--df-paper); border-bottom:1px solid var(--df-stone-300);
}
.df-bar{ display:flex; align-items:center; gap:12px; padding:8px 16px; min-height:var(--df-header-h); }

.df-burger{
  display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px;
  border:none; background:transparent; color:var(--df-forest-800); border-radius:var(--df-radius-sm); cursor:pointer; flex:none;
}
.df-burger:hover{ background:var(--df-forest-100); }
.df-burger svg{ width:24px; height:24px; }

.df-logo{ flex:1 1 auto; display:flex; justify-content:center; }
.df-logo img{ height:50px; width:auto; }

/* actions cluster */
.df-actions{ display:flex; align-items:center; gap:2px; flex:none; }
.df-iconbtn{
  display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px;
  border:none; background:transparent; color:var(--df-forest-800); border-radius:var(--df-radius-sm); cursor:pointer; position:relative;
}
.df-iconbtn:hover{ background:var(--df-forest-100); }
.df-iconbtn svg{ width:22px; height:22px; }
.df-iconbtn:focus-visible,.df-burger:focus-visible,.df-nav__link:focus-visible,.df-mega__link:focus-visible,.df-mega__cta:focus-visible{ outline:3px solid var(--df-gold-500); outline-offset:2px; }
.df-cart__count{
  position:absolute; top:4px; right:4px; min-width:17px; height:17px; padding:0 4px;
  background:var(--df-clay-700); color:#fff; font-size:11px; font-weight:700; line-height:17px;
  text-align:center; border-radius:var(--df-radius-pill);
}
/* desktop-only inline labels for account/phone */
.df-account-d,.df-phone-d{ display:none; }

/* =========================================================
   NAV (desktop) / DRAWER (mobile) — un solo markup
   ========================================================= */
.df-drawer{
  position:fixed; top:0; left:0; bottom:0; width:min(86vw,360px);
  background:var(--df-paper); box-shadow:var(--df-shadow-lg);
  transform:translateX(-100%); transition:transform .28s ease; z-index:90;
  display:flex; flex-direction:column; overflow-y:auto;
}
.df-drawer.is-open{ transform:none; }
.df-drawer__head{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:14px 16px; border-bottom:1px solid var(--df-stone-300);
}
.df-drawer__head img{ height:46px; }
.df-drawer__close{ border:none; background:transparent; width:40px; height:40px; border-radius:var(--df-radius-sm); cursor:pointer; color:var(--df-ink); display:inline-flex; align-items:center; justify-content:center; }
.df-drawer__close:hover{ background:var(--df-sand); }
.df-drawer__close svg{ width:22px; height:22px; }

.df-overlay{
  position:fixed; inset:0; background:rgba(30,58,43,.42); opacity:0; visibility:hidden;
  transition:opacity .28s ease; z-index:80;
}
.df-overlay.is-open{ opacity:1; visibility:visible; }

.df-nav__list{ list-style:none; margin:0; padding:6px 8px 0; display:flex; flex-direction:column; }
.df-nav__item{ border-bottom:1px solid var(--df-cream); }
.df-nav__link{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:8px;
  background:transparent; border:none; cursor:pointer; text-align:left;
  font-family:var(--df-font-sans); font-weight:600; font-size:16px; color:var(--df-ink);
  padding:14px 8px;
}
.df-nav__link:hover{ color:var(--df-forest-700); }
.df-caret{ width:18px; height:18px; color:var(--df-stone-400); transition:transform .2s ease; flex:none; }
.df-nav__item.is-open > .df-nav__link .df-caret{ transform:rotate(180deg); color:var(--df-forest-700); }

/* mega — mobile accordion (base) */
.df-mega{ overflow:hidden; max-height:0; transition:max-height .3s ease; }
.df-nav__item.is-open > .df-mega{ max-height:1200px; }
.df-mega__inner{ padding:2px 0 10px 8px; }
.df-mega__lead{ padding:4px 8px 10px; }
.df-mega__eyebrow{ display:inline-flex; align-items:center; gap:7px; font-family:var(--df-font-display); font-weight:600; font-size:18px; color:var(--df-forest-800); }
.df-mega__eyebrow .sprig{ width:18px; height:18px; color:var(--df-gold-500); }
.df-mega__blurb{ margin:6px 0 8px; font-size:13.5px; color:var(--df-stone-600); line-height:1.45; max-width:46ch; }
.df-mega__cta{ display:inline-flex; align-items:center; gap:6px; font-weight:700; font-size:13.5px; color:var(--df-clay-700); }
.df-mega__cta:hover{ color:var(--df-clay-800); }
.df-mega__cols{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.df-mega__link{ display:flex; align-items:center; gap:8px; padding:10px 8px; font-size:15px; color:var(--df-stone-600); border-radius:var(--df-radius-sm); }
.df-mega__link:hover{ color:var(--df-forest-800); background:var(--df-cream); }
.df-seasondot{ width:7px; height:7px; border-radius:50%; background:var(--df-gold-500); flex:none; }
.df-mega__link--season{ color:var(--df-gold-800); font-weight:600; }

/* drawer footer (mobile) */
.df-drawer__foot{ margin-top:auto; padding:16px; border-top:1px solid var(--df-stone-300); display:flex; flex-direction:column; gap:10px; }
.df-drawer__foot .df-fbtn{ display:flex; align-items:center; gap:10px; font-weight:600; font-size:15px; color:var(--df-ink); padding:10px 8px; border-radius:var(--df-radius-sm); }
.df-drawer__foot .df-fbtn:hover{ background:var(--df-cream); }
.df-drawer__foot .df-fbtn svg{ width:20px; height:20px; color:var(--df-forest-700); }
.df-drawer__cta{
  margin-top:4px; display:flex; align-items:center; justify-content:center; gap:8px;
  background:var(--df-clay-700); color:#fff; font-weight:700; padding:14px; border-radius:var(--df-radius-md);
}

/* =========================================================
   SEARCH (espandibile)
   ========================================================= */
.df-search{
  max-height:0; overflow:hidden; transition:max-height .25s ease; border-top:1px solid transparent;
  background:var(--df-cream);
}
.df-search.is-open{ max-height:120px; border-top-color:var(--df-stone-300); }
.df-search__inner{ display:flex; gap:8px; align-items:center; padding:12px 16px; max-width:740px; margin:0 auto; }
.df-search__field{ position:relative; flex:1; }
.df-search__field svg{ position:absolute; left:14px; top:50%; transform:translateY(-50%); width:18px; height:18px; color:var(--df-stone-400); }
.df-search input{
  width:100%; font-family:var(--df-font-sans); font-size:16px; color:var(--df-ink);
  background:var(--df-paper); border:1.5px solid var(--df-stone-300); border-radius:var(--df-radius-pill);
  padding:13px 16px 13px 42px;
}
.df-search input:focus{ outline:none; border-color:var(--df-forest-800); box-shadow:0 0 0 3px rgba(38,70,52,.18); }
.df-search__go{ background:var(--df-forest-800); color:#fff; border:none; font-weight:600; font-size:15px; padding:13px 22px; border-radius:var(--df-radius-pill); cursor:pointer; }
.df-search__go:hover{ background:var(--df-forest-700); }

/* =========================================================
   DESKTOP (≥1100px)
   ========================================================= */
@media (min-width:1100px){
  :root{ --df-header-h:74px; }
  .df-announce__phone{ display:flex; }
  .df-burger{ display:none; }
  .df-logo{ flex:0 0 auto; justify-content:flex-start; }
  .df-logo img{ height:62px; }

  /* drawer becomes inline nav */
  .df-drawer{
    position:static; transform:none; width:auto; flex:1 1 auto;
    background:transparent; box-shadow:none; overflow:visible; flex-direction:row; justify-content:center;
  }
  .df-drawer__head,.df-drawer__foot{ display:none; }
  .df-overlay{ display:none; }
  .df-nav__list{ flex-direction:row; align-items:center; gap:2px; padding:0; }
  .df-nav__item{ border:none; position:static; }
  .df-nav__link{ width:auto; padding:12px 12px; font-size:15px; position:relative; }
  .df-nav__link::after{
    content:""; position:absolute; left:12px; right:12px; bottom:6px; height:2px;
    background:var(--df-gold-500); border-radius:2px; transform:scaleX(0); transform-origin:left; transition:transform .2s ease;
  }
  .df-has-mega:hover > .df-nav__link, .df-nav__link:hover{ color:var(--df-forest-800); }
  .df-has-mega:hover > .df-nav__link::after,
  .df-nav__item:not(.df-has-mega) .df-nav__link:hover::after,
  .df-nav__item.is-open > .df-nav__link::after{ transform:scaleX(1); }
  .df-caret{ width:16px; height:16px; }

  /* mega = pannello full-width sotto la barra */
  .df-mega{
    position:absolute; left:0; right:0; top:100%; max-height:none; overflow:visible;
    background:var(--df-paper); border-top:1px solid var(--df-stone-300); box-shadow:var(--df-shadow-lg);
    opacity:0; visibility:hidden; transform:translateY(7px); pointer-events:none;
    transition:opacity .18s ease, transform .18s ease, visibility .18s;
  }
  @media (hover:hover){
    .df-has-mega:hover > .df-mega{ opacity:1; visibility:visible; transform:none; pointer-events:auto; }
  }
  .df-has-mega:focus-within > .df-mega,
  .df-has-mega.is-open > .df-mega{ opacity:1; visibility:visible; transform:none; pointer-events:auto; }

  .df-mega__inner{ display:grid; grid-template-columns:248px 1fr; gap:36px; max-width:1180px; margin:0 auto; padding:28px 24px 32px; }
  .df-mega__lead{ padding:0; border-right:1px solid var(--df-stone-300); padding-right:32px; }
  .df-mega__eyebrow{ font-size:24px; }
  .df-mega__blurb{ font-size:14.5px; margin:10px 0 14px; }
  .df-mega__cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:2px 18px; align-content:start; }
  .df-mega__link{ font-size:14.5px; padding:9px 10px; }

  /* actions: mostra etichette account & telefono */
  .df-actions{ gap:4px; }
  .df-account-d{ display:inline-flex; align-items:center; gap:7px; padding:8px 12px; border-radius:var(--df-radius-sm); color:var(--df-ink); font-weight:600; font-size:14px; }
  .df-account-d:hover{ background:var(--df-forest-100); }
  .df-account-d svg{ width:20px; height:20px; color:var(--df-forest-800); }
  .df-account-m{ display:none; }
}

/* =========================================================
   COMPONENTI (dal sistema di design v1.2)
   ========================================================= */
.df-btn{ font-family:var(--df-font-sans); font-weight:600; font-size:1rem; line-height:1; border-radius:var(--df-radius-md); padding:14px 24px; border:1.5px solid transparent; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:8px; transition:background .18s,color .18s,border-color .18s,transform .05s; text-align:center; }
.df-btn:active{ transform:translateY(1px); }
.df-btn:focus-visible{ outline:3px solid var(--df-gold-500); outline-offset:2px; }
.df-btn--primary{ background:var(--df-forest-800); color:#fff; }
.df-btn--primary:hover{ background:var(--df-forest-700); }
.df-btn--secondary{ background:rgba(255,255,255,.6); color:var(--df-forest-800); border-color:var(--df-forest-800); }
.df-btn--secondary:hover{ background:var(--df-forest-100); }
.df-btn--accent{ background:var(--df-clay-700); color:#fff; }
.df-btn--accent:hover{ background:var(--df-clay-800); }
.df-btn--lg{ padding:16px 28px; font-size:1.0625rem; }

.df-badge{ font-family:var(--df-font-sans); font-weight:600; font-size:.8125rem; padding:5px 12px; border-radius:var(--df-radius-pill); display:inline-flex; align-items:center; gap:6px; line-height:1; }
.df-badge--ordinato{ background:var(--df-forest-100); color:var(--df-forest-800); }
.df-badge--oggi{ background:var(--df-clay-100); color:var(--df-clay-800); }
.df-badge--mano{ background:var(--df-gold-100); color:var(--df-gold-800); }
.df-badge--amore{ background:var(--df-blush-100); color:var(--df-blush-700); }
.df-badge .df-dot{ width:7px; height:7px; border-radius:50%; background:currentColor; }

.df-card{ background:var(--df-paper); border:1px solid var(--df-stone-300); border-radius:var(--df-radius-lg); overflow:hidden; display:flex; flex-direction:column; transition:box-shadow .2s,transform .2s; }
.df-card:hover{ box-shadow:var(--df-shadow-md); transform:translateY(-2px); }
.df-card__media{ position:relative; aspect-ratio:1/1; background:linear-gradient(160deg,#F4EEE4,var(--df-sand)); }
.df-card__media svg{ width:100%; height:100%; display:block; }
.df-card__badges{ position:absolute; top:12px; left:12px; display:flex; flex-direction:column; gap:6px; align-items:flex-start; }
.df-card__body{ padding:14px 14px 16px; display:flex; flex-direction:column; gap:5px; flex:1; }
.df-card__name{ font-family:var(--df-font-display); font-weight:600; font-size:1.25rem; color:var(--df-ink); line-height:1.12; }
.df-card__desc{ font-size:.875rem; color:var(--df-stone-600); line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.df-card__foot{ margin-top:auto; display:flex; align-items:baseline; justify-content:space-between; padding-top:8px; gap:8px; }
.df-card__price{ font-weight:700; font-size:1.125rem; color:var(--df-forest-900); font-variant-numeric:tabular-nums; }
.df-card__price span{ font-weight:500; font-size:.72em; color:var(--df-stone-600); }

/* =========================================================
   HOMEPAGE — layout & sezioni
   ========================================================= */
.hp-wrap{ max-width:1180px; margin:0 auto; padding:0 16px; }
.hp-section{ padding:46px 0; }
.hp-section--tint{ background:var(--df-forest-100); }
.hp-head{ margin-bottom:22px; }
.hp-head__row{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.hp-eyebrow{ display:inline-flex; align-items:center; gap:8px; font-size:.8125rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--df-gold-800); margin-bottom:8px; }
.hp-eyebrow .sprig{ width:16px; height:16px; color:var(--df-gold-500); }
.hp-h2{ font-family:var(--df-font-display); font-weight:600; font-size:clamp(1.6rem,1.25rem+1.5vw,2.375rem); line-height:1.1; margin:0; color:var(--df-forest-900); }
.hp-sub{ color:var(--df-stone-600); margin:8px 0 0; font-size:1rem; line-height:1.55; max-width:60ch; }
.hp-seeall{ display:inline-flex; align-items:center; gap:6px; font-weight:700; font-size:.9375rem; color:var(--df-forest-700); flex:none; }
.hp-seeall:hover{ color:var(--df-forest-600); }

/* HERO */
.hp-hero{ position:relative; background:linear-gradient(150deg,var(--df-cream) 0%, #FBF1EE 55%, var(--df-sand) 100%); overflow:hidden; }
.hp-hero__inner{ position:relative; max-width:1180px; margin:0 auto; padding:32px 16px 38px; }
.hp-slide{ display:none; }
.hp-slide.is-active{ display:block; animation:hpfade .5s ease; }
@keyframes hpfade{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
.hp-slide__grid{ display:grid; gap:24px; align-items:center; }
.hp-slide h1{ font-family:var(--df-font-display); font-weight:500; font-size:clamp(2.1rem,1.5rem+2.6vw,3.4rem); line-height:1.04; color:var(--df-forest-900); margin:6px 0 12px; }
.hp-slide h1 em{ font-style:italic; color:var(--df-clay-700); }
.hp-slide__p{ font-size:1.0625rem; line-height:1.55; color:var(--df-ink); max-width:46ch; margin:0 0 20px; }
.hp-slide__cta{ display:flex; flex-wrap:wrap; gap:12px; }
.hp-trust{ display:flex; flex-wrap:wrap; gap:12px 22px; margin-top:22px; }
.hp-trust span{ display:inline-flex; align-items:center; gap:8px; font-size:.875rem; font-weight:600; color:var(--df-forest-800); }
.hp-trust svg{ width:18px; height:18px; color:var(--df-gold-800); }
.hp-frame{ position:relative; border-radius:var(--df-radius-lg); overflow:hidden; box-shadow:var(--df-shadow-lg); background:var(--df-paper); aspect-ratio:4/3; }
.hp-frame svg{ width:100%; height:100%; display:block; }
.hp-frame__badges{ position:absolute; top:14px; left:14px; display:flex; flex-direction:column; gap:8px; align-items:flex-start; }
.hp-frame__tag{ position:absolute; bottom:14px; right:14px; background:rgba(255,255,255,.94); border-radius:var(--df-radius-pill); padding:8px 14px; font-weight:700; font-size:.8125rem; color:var(--df-forest-900); box-shadow:var(--df-shadow-sm); display:flex; align-items:center; gap:7px; }
.hp-frame__tag .df-dot{ width:8px; height:8px; border-radius:50%; background:var(--df-clay-700); }
.hp-dots{ display:flex; gap:8px; justify-content:center; margin-top:22px; }
.hp-dot{ width:9px; height:9px; border-radius:50%; border:none; background:var(--df-stone-300); cursor:pointer; padding:0; transition:width .2s, background .2s; }
.hp-dot.is-active{ background:var(--df-forest-700); width:26px; border-radius:5px; }

/* PILLS */
.hp-pills-wrap{ background:var(--df-paper); border-bottom:1px solid var(--df-stone-300); }
.hp-pills{ max-width:1180px; margin:0 auto; display:flex; gap:10px; overflow-x:auto; padding:14px 16px; scroll-snap-type:x proximity; scrollbar-width:none; }
.hp-pills::-webkit-scrollbar{ display:none; }
.hp-pill{ scroll-snap-align:start; flex:none; display:inline-flex; align-items:center; gap:9px; background:var(--df-cream); border:1px solid var(--df-stone-300); border-radius:var(--df-radius-pill); padding:8px 16px 8px 8px; font-weight:600; font-size:.9375rem; color:var(--df-ink); white-space:nowrap; transition:border-color .15s, background .15s; }
.hp-pill:hover{ border-color:var(--df-forest-300); background:var(--df-paper); }
.hp-pill__ico{ width:30px; height:30px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; flex:none; background:var(--df-forest-100); color:var(--df-forest-700); }
.hp-pill__ico svg{ width:17px; height:17px; }

/* FIND widget (senza CAP) */
.hp-find{ background:var(--df-sand); }
.hp-find__inner{ max-width:1180px; margin:0 auto; padding:30px 16px; }
.hp-find__card{ background:var(--df-paper); border:1px solid var(--df-stone-300); border-radius:var(--df-radius-lg); box-shadow:var(--df-shadow-md); padding:22px; }
.hp-find__title{ font-family:var(--df-font-display); font-weight:600; font-size:1.375rem; color:var(--df-forest-900); margin:0 0 4px; }
.hp-find__hint{ font-size:.875rem; color:var(--df-stone-600); margin:0 0 16px; line-height:1.45; }
.hp-find__fields{ display:grid; gap:12px; }
.hp-find__fields .df-btn{ width:100%; }
.hp-find__field{ position:relative; }
.hp-find__field>svg{ position:absolute; left:14px; top:50%; transform:translateY(-50%); width:18px; height:18px; color:var(--df-stone-400); pointer-events:none; }
.hp-find__field input{ width:100%; font-family:var(--df-font-sans); font-size:1rem; color:var(--df-ink); background:var(--df-paper); border:1.5px solid var(--df-stone-300); border-radius:var(--df-radius-sm); padding:14px 16px 14px 42px; }
.hp-find__field input:focus{ outline:none; border-color:var(--df-forest-800); box-shadow:0 0 0 3px rgba(38,70,52,.18); }
.hp-find__chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.hp-chip{ font-size:.8125rem; font-weight:600; padding:7px 13px; border-radius:var(--df-radius-pill); background:var(--df-cream); border:1px solid var(--df-stone-300); color:var(--df-stone-600); }
.hp-chip:hover{ color:var(--df-forest-800); border-color:var(--df-forest-300); }
.hp-chip--oggi{ background:var(--df-clay-100); border-color:transparent; color:var(--df-clay-800); }

/* PRODUCT GRID */
.hp-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }

/* PROMO */
.hp-promos{ display:flex; gap:14px; overflow-x:auto; padding-bottom:6px; scroll-snap-type:x proximity; scrollbar-width:none; }
.hp-promos::-webkit-scrollbar{ display:none; }
.hp-promo{ scroll-snap-align:start; flex:0 0 84%; position:relative; border-radius:var(--df-radius-lg); overflow:hidden; min-height:220px; display:flex; align-items:flex-end; padding:22px; color:#fff; }
.hp-promo__body{ position:relative; z-index:1; }
.hp-promo h3{ font-family:var(--df-font-display); font-weight:600; font-size:1.5rem; margin:0 0 8px; }
.hp-promo p{ margin:0 0 10px; font-size:.9375rem; opacity:.92; max-width:30ch; }
.hp-promo a{ font-weight:700; font-size:.9375rem; color:#fff; display:inline-flex; gap:6px; align-items:center; }
.hp-promo::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,0) 35%, rgba(20,32,24,.5)); z-index:0; }
.hp-promo--a{ background:linear-gradient(135deg,var(--df-forest-700),var(--df-forest-900)); }
.hp-promo--b{ background:linear-gradient(135deg,var(--df-clay-500),var(--df-clay-800)); }
.hp-promo--c{ background:linear-gradient(135deg,var(--df-blush-500),var(--df-blush-700)); }

/* WHY */
.hp-why{ display:grid; grid-template-columns:1fr; gap:16px; }
.hp-why__item{ background:var(--df-paper); border:1px solid var(--df-stone-300); border-radius:var(--df-radius-lg); padding:22px; box-shadow:var(--df-shadow-sm); }
.hp-why__ico{ width:48px; height:48px; border-radius:14px; display:flex; align-items:center; justify-content:center; margin-bottom:14px; }
.hp-why__ico svg{ width:24px; height:24px; }
.hp-why h3{ font-family:var(--df-font-display); font-weight:600; font-size:1.25rem; color:var(--df-forest-900); margin:0 0 6px; }
.hp-why p{ font-size:.9375rem; color:var(--df-stone-600); line-height:1.5; margin:0; }

/* FLORISTS (banda scura) */
.hp-florists{ background:var(--df-forest-900); color:var(--df-cream); }
.hp-florists__inner{ max-width:1180px; margin:0 auto; padding:50px 16px; }
.hp-florists .hp-eyebrow{ color:var(--df-gold-500); }
.hp-florists h2{ font-family:var(--df-font-display); font-weight:500; font-size:clamp(1.7rem,1.3rem+1.6vw,2.5rem); line-height:1.08; color:#fff; margin:0 0 12px; }
.hp-florists__p{ color:#D6DED7; max-width:54ch; font-size:1.0625rem; line-height:1.55; margin:0 0 22px; }
.hp-florists__cards{ display:grid; grid-template-columns:1fr; gap:14px; margin-top:26px; }
.hp-fcard{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:var(--df-radius-lg); padding:16px; display:flex; align-items:center; gap:14px; }
.hp-fcard__ph{ width:56px; height:56px; border-radius:50%; flex:none; overflow:hidden; background:var(--df-sand); }
.hp-fcard__ph svg{ width:100%; height:100%; }
.hp-fcard__name{ font-weight:700; color:#fff; font-size:1rem; }
.hp-fcard__meta{ font-size:.85rem; color:#B9C6BC; margin-top:2px; }

/* FOOTER (chiaro) */
.hp-footer{ background:var(--df-sand); border-top:1px solid var(--df-stone-300); }
.hp-footer__inner{ max-width:1180px; margin:0 auto; padding:40px 16px 24px; }
.hp-footer__grid{ display:grid; grid-template-columns:1fr; gap:30px; }
.hp-footer__brand img{ height:54px; margin-bottom:12px; background:#fff; border:1px solid var(--df-stone-300); border-radius:12px; padding:8px 12px; }
.hp-footer__brand p{ color:var(--df-stone-600); font-size:.9375rem; line-height:1.5; max-width:34ch; margin:0 0 14px; }
.hp-social{ display:flex; gap:10px; }
.hp-social a{ width:38px; height:38px; border-radius:50%; background:var(--df-paper); border:1px solid var(--df-stone-300); display:inline-flex; align-items:center; justify-content:center; color:var(--df-forest-800); }
.hp-social a:hover{ background:var(--df-forest-100); }
.hp-social svg{ width:18px; height:18px; }
.hp-fcol h4{ font-family:var(--df-font-sans); font-weight:700; font-size:.875rem; letter-spacing:.04em; text-transform:uppercase; color:var(--df-ink); margin:0 0 12px; }
.hp-fcol ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.hp-fcol a{ color:var(--df-stone-600); font-size:.9375rem; }
.hp-fcol a:hover{ color:var(--df-forest-800); }
.hp-news__group{ display:flex; gap:8px; margin-top:8px; }
.hp-news__group input{ flex:1; min-width:0; font-family:var(--df-font-sans); font-size:.9375rem; padding:12px 14px; border:1.5px solid var(--df-stone-300); border-radius:var(--df-radius-sm); background:var(--df-paper); }
.hp-news__group input:focus{ outline:none; border-color:var(--df-forest-800); box-shadow:0 0 0 3px rgba(38,70,52,.18); }
.hp-pay{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:28px; }
.hp-pay span{ font-size:.75rem; color:var(--df-stone-400); margin-right:4px; }
.hp-pay .chip{ background:var(--df-paper); border:1px solid var(--df-stone-300); border-radius:6px; padding:5px 9px; font-size:.7rem; font-weight:700; color:var(--df-stone-600); letter-spacing:.03em; }
.hp-footer__bottom{ margin-top:22px; padding-top:18px; border-top:1px solid var(--df-stone-300); display:flex; flex-wrap:wrap; gap:8px 18px; align-items:center; justify-content:space-between; font-size:.8125rem; color:var(--df-stone-600); }
.hp-footer__bottom nav{ display:flex; gap:16px; flex-wrap:wrap; }
.hp-footer__bottom a:hover{ color:var(--df-forest-800); }

/* helper colori (icone) */
.bg-forest{ background:var(--df-forest-100); color:var(--df-forest-700); }
.bg-clay{ background:var(--df-clay-100); color:var(--df-clay-700); }
.bg-gold{ background:var(--df-gold-100); color:var(--df-gold-800); }
.bg-blush{ background:var(--df-blush-100); color:var(--df-blush-700); }

/* ===== DESKTOP homepage ===== */
@media (min-width:760px){
  .hp-section{ padding:62px 0; }
  .hp-wrap{ padding:0 24px; }
  .hp-hero__inner{ padding:48px 24px 54px; }
  .hp-slide__grid{ grid-template-columns:1.05fr .95fr; gap:40px; }
  .hp-grid{ grid-template-columns:repeat(3,1fr); gap:20px; }
  .hp-find__inner{ padding:36px 24px; }
  .hp-find__fields{ grid-template-columns:1fr auto; align-items:center; }
  .hp-find__fields .df-btn{ width:auto; }
  .hp-find__card{ padding:26px 28px; }
  .hp-promo{ flex-basis:46%; }
  .hp-why{ grid-template-columns:repeat(2,1fr); gap:20px; }
  .hp-florists__cards{ grid-template-columns:repeat(3,1fr); }
  .hp-footer__grid{ grid-template-columns:1.5fr 1fr 1fr 1.4fr; gap:32px; }
}
@media (min-width:1100px){
  .hp-grid{ grid-template-columns:repeat(4,1fr); }
  .hp-promo{ flex-basis:31.5%; }
  .hp-why{ grid-template-columns:repeat(4,1fr); }
  .hp-hero__inner{ padding:60px 24px 64px; }
}

@media (prefers-reduced-motion: reduce){ *{ transition:none !important; animation:none !important; } }


/* ===== Front-page: tessere categorie ===== */
.fp-cats{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
@media(min-width:640px){ .fp-cats{ grid-template-columns:repeat(3,1fr); } }
@media(min-width:980px){ .fp-cats{ grid-template-columns:repeat(4,1fr); } }
.fp-cat{ display:flex; align-items:center; justify-content:center; text-align:center; min-height:104px; padding:18px; border-radius:var(--df-radius-lg); background:linear-gradient(150deg,var(--df-forest-100),var(--df-blush-100)); border:1px solid var(--df-stone-300); text-decoration:none; transition:transform .16s ease, box-shadow .16s ease; }
.fp-cat:hover{ transform:translateY(-3px); box-shadow:var(--df-shadow-md); }
.fp-cat__name{ font-family:var(--df-font-display); font-weight:600; font-size:1.2rem; color:var(--df-forest-900); }


/* ==========================================================================
   Devin Flora — Icone floreali (sostituzione centralizzata)
   Nasconde le vecchie icone e ne disegna di nuove, per colore, ovunque
   compaiano (.hp-why__ico e .fi-assure__ico). Niente modifiche alle pagine.
   ========================================================================== */
.hp-why__ico, .fi-assure__ico{ display:flex; align-items:center; justify-content:center; }
.hp-why__ico > svg, .fi-assure__ico > svg{ display:none !important; }

.hp-why__ico:has(> svg)::before,
.fi-assure__ico:has(> svg)::before{
  content:""; display:block; width:30px; height:30px;
  background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23264634%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%2021V8%27%2F%3E%3Cpath%20d%3D%27M12%2014c-3%200-5-2-5-5%203%200%205%202%205%205Z%27%2F%3E%3Cpath%20d%3D%27M12%2011c3%200%205-2%205-5-3%200-5%202-5%205Z%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;   /* default: rametto (verde) */
}
.hp-why__ico.bg-gold:has(> svg)::before,
.fi-assure__ico.bg-gold:has(> svg)::before{ background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%237A5E16%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%271.8%27%2F%3E%3Cellipse%20cx%3D%2712%27%20cy%3D%276.8%27%20rx%3D%271.7%27%20ry%3D%272.8%27%2F%3E%3Cellipse%20cx%3D%2712%27%20cy%3D%276.8%27%20rx%3D%271.7%27%20ry%3D%272.8%27%20transform%3D%27rotate%2872%2012%2012%29%27%2F%3E%3Cellipse%20cx%3D%2712%27%20cy%3D%276.8%27%20rx%3D%271.7%27%20ry%3D%272.8%27%20transform%3D%27rotate%28144%2012%2012%29%27%2F%3E%3Cellipse%20cx%3D%2712%27%20cy%3D%276.8%27%20rx%3D%271.7%27%20ry%3D%272.8%27%20transform%3D%27rotate%28216%2012%2012%29%27%2F%3E%3Cellipse%20cx%3D%2712%27%20cy%3D%276.8%27%20rx%3D%271.7%27%20ry%3D%272.8%27%20transform%3D%27rotate%28288%2012%2012%29%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat; }
.hp-why__ico.bg-clay:has(> svg)::before,
.fi-assure__ico.bg-clay:has(> svg)::before{ background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23B5532A%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%278.4%27%2F%3E%3Cpath%20d%3D%27M12%207.6V12l3.1%201.9%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat; }
.hp-why__ico.bg-blush:has(> svg)::before,
.fi-assure__ico.bg-blush:has(> svg)::before{ background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23AC5A66%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%2021v-7.5%27%2F%3E%3Cpath%20d%3D%27M12%2013.5c-3%200-5-2-5-5%200%200%202.2-.4%203.6%201.1C10.8%206.9%2012%204.5%2012%204.5s1.2%202.4%201.4%205.1C14.8%208.1%2017%208.5%2017%208.5c0%203-2%205-5%205Z%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat; }
.hp-why__ico.bg-forest:has(> svg)::before,
.fi-assure__ico.bg-forest:has(> svg)::before{ background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23264634%27%20stroke-width%3D%271.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%2021V8%27%2F%3E%3Cpath%20d%3D%27M12%2014c-3%200-5-2-5-5%203%200%205%202%205%205Z%27%2F%3E%3Cpath%20d%3D%27M12%2011c3%200%205-2%205-5-3%200-5%202-5%205Z%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat; }


/* ==========================================================================
   Devin Flora — Slide della home con foto reale del prodotto (tag slide-1/2)
   ========================================================================== */
.hp-frame--photo{ display:block; text-decoration:none; }
.hp-frame--photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.hp-frame__caption{ position:absolute; left:0; right:0; bottom:0; display:flex; align-items:baseline;
  justify-content:space-between; gap:10px; padding:16px 18px;
  background:linear-gradient(to top, rgba(20,16,12,.80), rgba(20,16,12,0)); }
.hp-frame__name{ color:#fff; font-family:var(--df-font-display); font-weight:600; font-size:1.1rem; line-height:1.2; }
.hp-frame__price{ color:#fff; font-weight:700; font-size:.95rem; white-space:nowrap; }
.hp-frame__price *{ color:#fff; }


/* Devin Flora — rimuovo la sezione "Dove consegniamo" e la lista regioni */
.hp-section:has(.fi-regions){ display:none !important; }

/* Newsletter footer — messaggi */
.df-news__ok{ color:var(--df-success,#2E7D4F); font-weight:600; font-size:.9rem; margin:0 0 8px; }
.df-news__err{ color:var(--df-error,#C0392B); font-weight:600; font-size:.9rem; margin:0 0 8px; }

/* Slide home: segnaposto se manca la foto */
.hp-frame__ph{ display:block; width:100%; height:100%; background:linear-gradient(160deg,#FBF1EE,#F0E9DF); }
