:root{--ink:#202821;--muted:#637164;--bg:#f4f6f1;--line:#dce2d8;--green:#163e2b;--lime:#d1ef80}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 Arial,sans-serif}header{background:var(--green);color:#fff;padding:20px 4vw;display:flex;align-items:center;justify-content:space-between;gap:20px}header a{color:inherit;text-decoration:none}nav{display:flex;gap:18px;flex-wrap:wrap}main{max-width:1240px;margin:auto;padding:40px 24px 70px}h1{font-size:clamp(30px,4vw,46px);letter-spacing:-1.5px;margin:6px 0 16px;line-height:1.15}h2{font-size:22px;margin-top:0}.eyebrow{letter-spacing:2px;font-size:11px;text-transform:uppercase;font-weight:700;color:var(--muted)}.muted,.hint{color:var(--muted);font-size:14px}.toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:24px 0}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.card,.panel{background:white;border:1px solid var(--line);border-radius:16px;padding:24px;margin-bottom:20px}.card strong{display:block;font-size:34px;margin:8px 0}.grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.badge{display:inline-block;padding:5px 12px;border-radius:20px;background:#e7eddf;font-size:12px;font-weight:700}.pending{background:#fff0ce;color:#6c4c00}button,.button{border:1px solid var(--green);background:var(--green);color:white;border-radius:8px;padding:12px 18px;font:inherit;cursor:pointer;display:inline-block;text-decoration:none}button.secondary,.button.secondary{background:white;color:var(--green)}button:disabled{opacity:.5;cursor:not-allowed}input,select,textarea{display:block;width:100%;padding:12px;border:1px solid #bdc8bb;border-radius:8px;background:white;color:var(--ink);font:inherit;margin:6px 0 18px}textarea{min-height:110px}label{font-size:14px;font-weight:600}label.check{display:flex;gap:10px;align-items:flex-start;margin:14px 0}input[type=checkbox]{width:20px;flex-shrink:0;margin:2px 0}a{color:var(--green)}table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:left;padding:12px 6px;border-bottom:1px solid var(--line)}.scroll{overflow:auto}.bar-row{display:grid;grid-template-columns:110px 1fr 45px;gap:10px;align-items:center;margin:10px 0;font-size:13px}.bar{height:12px;border-radius:6px;background:var(--lime);min-width:2px}.chart{display:flex;align-items:end;gap:4px;height:160px;border-bottom:1px solid var(--line);margin:25px 0 8px}.chart div{flex:1;min-width:3px;background:var(--green);border-radius:3px 3px 0 0}.notice{padding:18px;background:#fff4d9;border-radius:12px;margin:20px 0}.status{white-space:pre-line;min-height:24px}.option-row{display:grid;grid-template-columns:80px 1fr 130px;gap:12px}.product-photo{width:100%;max-height:550px;object-fit:contain;background:#e9eee3;border-radius:20px}.preview-name{padding:38px 24px;background:#edf0e8;border-radius:14px;font-size:32px;text-align:center;overflow-wrap:anywhere}.chips{display:flex;gap:10px}.chips label{flex:1}.chips input{display:inline-block;width:auto}details{margin:16px 0}summary{cursor:pointer}*:focus-visible{outline:3px solid #8aa547;outline-offset:3px}[hidden]{display:none!important}@media(max-width:760px){header{align-items:flex-start;flex-direction:column}.grid{grid-template-columns:1fr}.cards{grid-template-columns:1fr 1fr}.card,.panel{padding:18px}main{padding:26px 16px}.option-row{grid-template-columns:60px 1fr 100px}}@media(max-width:420px){.cards{grid-template-columns:1fr 1fr}.card strong{font-size:27px}}

/* Configuratore Pet */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.pet-page{background:#f7f4ed}.pet-page main{max-width:1380px}.pet-config-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(390px,.75fr);gap:34px;align-items:start}.pet-visual{position:sticky;top:16px}.viewer-stage{position:relative;border:1px solid #dfd9cf;border-radius:24px;overflow:hidden;background:#eee8de;box-shadow:0 22px 60px #26342612}.viewer-stage canvas{display:block;width:100%;height:auto;touch-action:auto;cursor:default}.viewer-stage canvas:active{cursor:default}.viewer-stage p{position:absolute;bottom:16px;left:0;right:0;text-align:center;margin:0;font-size:13px;font-weight:700}.viewer-badge{position:absolute;right:18px;top:18px;border:1px solid #ffffffaa;background:#ffffffcc;backdrop-filter:blur(8px);border-radius:999px;padding:8px 12px;font-weight:800}.pet-controls{padding:30px}.pet-controls h2{font:500 34px/1.08 Georgia,serif;letter-spacing:-1px}.pet-controls fieldset{min-width:0;border:0;padding:0;margin:25px 0}.pet-controls legend,.pet-controls>label{display:flex;justify-content:space-between;width:100%;font-weight:750;margin-bottom:12px}.choice-row,.font-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.choice,.font-choice{background:#fff;color:var(--ink);border:1px solid #bac4b8;padding:13px 8px}.choice[data-active=true],.font-choice[data-active=true]{background:var(--green);color:#fff;border-color:var(--green)}.choice {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  line-height: 1.35;
}
.choice strong { font-size: 17px; }
.choice span:last-child { margin-top: 3px; font-weight: 600; }.choice span{font-size:13px}.swatch-grid{display:grid;grid-template-columns:repeat(9,1fr);gap:10px 7px}.swatch{position:relative;min-width:0;display:grid;place-items:center;gap:2px;cursor:pointer}.swatch input{position:absolute;width:1px;height:1px;padding:0;margin:0;border:0;overflow:hidden;clip-path:inset(50%);opacity:0;pointer-events:none}.swatch input:focus-visible+span{outline:3px solid #8aa547;outline-offset:4px}.swatch span{display:block;width:35px;height:35px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #aeb5aa}.swatch input:checked+span{box-shadow:0 0 0 3px var(--green);transform:scale(1.06)}.swatch small{font-size:10px;color:var(--muted)}.pet-controls #request{width:100%;font-weight:800;letter-spacing:.5px}.pet-controls #counter{font-size:12px;color:var(--muted);font-weight:400}.pet-controls #pet-name{text-transform:uppercase;font-size:18px}.font-choice:last-child{font-style:normal}.pet-page .privacy-footer{background:#f7f4ed}@media(max-width:900px){.pet-config-grid{grid-template-columns:minmax(0,1fr)}.pet-visual{position:static}.viewer-stage{max-width:700px;margin:auto}.pet-controls{padding:24px}.swatch-grid{grid-template-columns:repeat(9,1fr)}}@media(max-width:520px){.pet-page main{padding:24px 12px}.pet-page h1{font-size:34px}.viewer-stage{border-radius:16px}.viewer-stage p{bottom:8px}.viewer-badge{right:10px;top:10px}.pet-controls{padding:20px 16px}.pet-controls h2{font-size:29px}.swatch-grid{grid-template-columns:repeat(6,1fr)}.swatch span{width:34px;height:34px}.choice-row,.font-row{gap:5px}.choice,.font-choice{padding:11px 4px;font-size:12px}}



/* Keep intrinsic canvas and form widths inside the mobile viewport. */
.pet-config-grid>*{min-width:0;max-width:100%}.pet-page canvas{max-width:100%}



/* Presentazione aggiornata del configuratore */
.pet-page{background:#fff}
.pet-page .privacy-footer{background:#fff}
.pet-page .pet-kicker{margin:8px 0 0;font:500 clamp(24px,3vw,38px)/1.08 Georgia,serif;letter-spacing:-1px}

.pet-page .viewer-stage{background:#fff}
#pet-care { margin:18px 0 20px; padding:0; border-radius:12px; }
#pet-care summary { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:48px; padding:12px 18px; border-radius:inherit; list-style:none; font-size:15px; font-weight:700; }
#pet-care summary::-webkit-details-marker { display:none; }
.care-toggle { flex:none; width:1em; text-align:center; font-size:22px; font-weight:400; line-height:1; }
.care-toggle::before { content:"+"; }
#pet-care[open] .care-toggle::before { content:"−"; }
.care-instructions { padding:0 18px 16px; max-width:80ch; }
.care-instructions p { margin:0; color:#4f5b52; font-size:14px; line-height:1.55; }
.care-instructions p + p { margin-top:8px; }

.pet-page header { background: #fff; color: #171717; border-bottom: 1px solid #e2e2df; }
.pet-page .pet-controls #request { background: #171717; border-color: #171717; color: #fff; }
.pet-page .pet-controls #request:hover { background: #333; }

.pet-price-row { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:8px; }
.pet-price-row h2 { margin:0; }
.pet-shipping-note { margin:0; color:#555; line-height:1.4; }
.pet-shipping-note small { font-size:.8125rem; }
#variant-price { font-size:clamp(23px,3vw,30px); font-weight:650; line-height:1.15; white-space:nowrap; }
.bowl-options,.stand-options { display:grid; gap:8px; }
.bowl-options { grid-template-columns:repeat(4,minmax(0,1fr)); }
.stand-options { grid-template-columns:repeat(3,minmax(0,1fr)); }
.pet-option { position:relative; display:block; min-width:0; cursor:pointer; }
.pet-option input { position:absolute; width:1px; height:1px; padding:0; margin:0; clip-path:inset(50%); overflow:hidden; border:0; }
.pet-option-card { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; height:100%; padding:10px 2px; border:1px solid #c9cdc7; border-radius:14px; color:#262b28; line-height:1.3; }
.pet-option-card strong { font-size:17px; }
.pet-option-card small { font-size:12px; font-weight:400; white-space:nowrap; }
.pet-option input:checked + .pet-option-card { color:#fff; background:#202622; border-color:#202622; }
.pet-option input:focus-visible + .pet-option-card { outline:3px solid #779444; outline-offset:3px; }
.stand-diagram { position:relative; display:block; height:33px; width:32px; margin:0 auto 5px; }
.stand-diagram::before,.stand-diagram::after { content:""; position:absolute; width:100%; left:0; box-sizing:border-box; border:1px solid currentColor; }
.stand-diagram::before { bottom:0; height:var(--stand-height); border-radius:50% / 3px; }
.stand-diagram::after { bottom:calc(var(--stand-height) - 6px); height:6px; border-radius:50%; }
@media(max-width:360px){.bowl-options,.stand-options{gap:4px}.pet-option-card small{font-size:11px}}

#pet-photo { display:block; width:100%; height:auto; }
#pet-gallery [hidden] { display:none; }
#pet-gallery canvas { touch-action:pan-y pinch-zoom; }
#preview-notice:not(:empty) { display:block; padding:8px 12px; font-size:.8125rem; }
.pet-photo-arrow {
 position:absolute; top:50%; transform:translateY(-50%); display:grid; place-items:center;
 width:44px; height:44px; padding:0; border-radius:50%; border:1px solid #d7d7d2;
 color:#202622; background:rgba(255,255,255,.94); box-shadow:0 2px 8px #20262212;
}
.pet-photo-arrow::before {
 content:""; width:9px; height:9px; border:solid currentColor; border-width:2px 2px 0 0;
}
#photo-prev { left:clamp(8px,2vw,18px); }
#photo-next { right:clamp(8px,2vw,18px); }
#photo-prev::before { transform:translateX(2px) rotate(-135deg); }
#photo-next::before { transform:translateX(-2px) rotate(45deg); }
@media(hover:hover){.pet-photo-arrow:hover { background:#f3f3ef; border-color:#a8ada7; }}

.pet-product-badges { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 8px; }
.pet-product-badges span { display:inline-flex; align-items:center; border:1px solid; border-radius:999px; padding:4px 12px; font-size:13px; font-weight:600; line-height:1.4; }
.pet-product-badges .pet-bestseller { background:#7739ce; color:white; border-color:#7739ce; }
.pet-product-badges .pet-made-to-order { background:#fff8e7; color:#884b12; border-color:#edcc8c; }

.pet-page #status:empty{min-height:0;margin:0}
.pet-overview{margin:clamp(28px,4vw,56px) 0 24px;border-top:1px solid var(--line);padding-top:clamp(22px,3vw,36px)}
.pet-overview h2{margin:0 0 10px;font:500 clamp(28px,3.2vw,40px)/1.1 Georgia,serif;letter-spacing:-.035em}
.pet-overview .pet-lead{max-width:66ch;margin:0 0 18px;font-size:16px;line-height:1.55}
.pet-highlights{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-width:640px;padding:0;margin:0;list-style:none}
.pet-highlights li{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:16px 10px;border-radius:14px;background:#f4f1eb;text-align:center;font:500 clamp(16px,1.75vw,22px)/1.2 Georgia,serif}
.pet-highlights svg{width:clamp(76px,8vw,104px);height:auto;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.pet-overview .render-note{max-width:70ch;margin:14px 0 0;color:var(--muted);font-size:14px;line-height:1.5}

/* Recensioni del portaciotole */
.pet-reviews { margin: 28px 0 0; max-width: 880px; }
.pet-reviews h2 {
  margin: 0 0 16px;
  font: 500 clamp(29px, 4vw, 38px)/1.06 Georgia, serif;
  letter-spacing: -.04em;
}
.pet-review-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.pet-review-card { overflow: hidden; margin: 0; border: 1px solid #dedfd8; border-radius: 16px; background: #fff; }
.pet-review-photos { position: relative; aspect-ratio: 4 / 5; background: #f4f1eb; }
#review-eda-gallery { touch-action: pan-y pinch-zoom; }
.pet-review-photos img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pet-review-photos [hidden] { display: none; }
.pet-review-nav {
  position: absolute; inset: auto 6px 8px;
  display: flex; align-items: center; justify-content: space-between;
  pointer-events: none;
}
.pet-review-nav button {
  display: grid; place-items: center; width: 44px; height: 44px; padding: 0;
  color: var(--ink); background: transparent; border: 0; pointer-events: auto;
}
.pet-review-nav button span {
  display: grid; place-items: center; width: 32px; height: 32px;
  background: #fff; color: var(--ink); border-radius: 50%; font: 24px/1 Arial, sans-serif;
}
.pet-review-counter {
  border-radius: 20px; padding: 2px 9px;
  background: #242522cb; color: #fff; font: 12px/1.5 Arial, sans-serif;
}
.pet-review-copy { padding: 15px 16px 18px; }
.pet-review-byline { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 8px; }
.pet-review-byline h3 { margin: 0; font: 650 17px/1.3 Arial, sans-serif; }
.pet-review-stars { color: #996212; font: 18px/1 Arial, sans-serif; letter-spacing: 1px; white-space: nowrap; }
.pet-review-copy blockquote { margin: 9px 0 0; padding: 0; font: 16px/1.45 Arial, sans-serif; }
@media (max-width: 560px) {
  .pet-review-grid { grid-template-columns: minmax(0, 1fr); }
}