/* ============================================================
   Curavicino — Design system
   Token (tipografia, spaziature, colore, ombre, stati) + componenti.
   Tutti gli stili vivono qui (niente più stili iniettati da JS).
   ============================================================ */

:root{
  /* colore */
  --paper:#F6F8FB; --paper2:#FFFFFF; --ink:#111826; --muted:#5A6675;
  --brand:#1D63C9; --brand-d:#134B9E; --brand-050:#EAF1FC; --brand-100:#DCE8FA;
  --olive:#1D63C9; --olive-d:#134B9E; --olive-050:#EAF1FC;   /* alias storici */
  --clay:#1D63C9; --clay-d:#134B9E;                           /* alias storici */
  --sage:#EAF1FC; --line:#E4E9F0; --line-2:#EEF2F7; --white:#fff;
  --gold:#E7A400; --gold-bg:#FBEFC9; --gold-line:#EAD79A; --gold-ink:#8A6712;

  /* tipografia */
  --font:'Figtree',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --fs-xs:12px; --fs-sm:13.5px; --fs-base:15.5px; --fs-md:17px;
  --fs-lg:20px; --fs-xl:1.55rem; --fs-2xl:2rem; --fs-hero:clamp(2rem,5vw,3rem);

  /* spaziature (ritmo unico) */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px;
  --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-12:48px;

  /* forma + profondità */
  --radius:14px; --radius-sm:10px; --radius-xs:8px; --radius-pill:999px;
  --shadow:0 1px 2px rgba(17,24,38,.04), 0 6px 20px -14px rgba(17,24,38,.20);
  --shadow-hover:0 10px 26px -14px rgba(17,24,38,.26);
  --ring:0 0 0 3px rgba(29,99,201,.20);

  --maxw:1180px;
  --ease:.18s cubic-bezier(.4,0,.2,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--paper);color:var(--ink);
  font-family:var(--font);font-size:var(--fs-base);line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--sp-5)}
.main{max-width:var(--maxw);margin:0 auto;padding:0 var(--sp-5) var(--sp-12)}
a{color:inherit;text-decoration:none;transition:color var(--ease)}
:focus-visible{outline:none;box-shadow:var(--ring);border-radius:var(--radius-xs)}

/* tipografia di base */
h1,h2,h3,h4{color:var(--ink);letter-spacing:-.02em;line-height:1.15;font-weight:700}
h2{font-size:var(--fs-2xl);font-weight:800}
h3{font-size:var(--fs-md)}
h4{font-size:var(--fs-sm);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.serif{font-family:var(--font)}
.muted{color:var(--muted)} .small{font-size:var(--fs-sm)}
.opt{font-weight:400;color:#94a1b2;font-size:var(--fs-xs)}
.err{color:#c0392b;font-size:var(--fs-sm);margin:2px 0 var(--sp-3)}

/* ---------- header ---------- */
.site{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.85);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;height:64px;max-width:var(--maxw);margin:0 auto;padding:0 var(--sp-5)}
.brand{display:flex;align-items:center;gap:var(--sp-2);font-weight:800;font-size:21px;letter-spacing:-.02em}
.brand .dot{width:10px;height:10px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px var(--brand-100)}
.nav{display:flex;align-items:center;gap:2px;font-size:var(--fs-base)}
.nav a,.linkbtn{padding:8px 12px;border-radius:var(--radius-xs);color:var(--muted);font-weight:500;border:none;background:none;cursor:pointer;font-family:inherit;font-size:var(--fs-base);transition:background var(--ease),color var(--ease)}
.nav a:hover,.linkbtn:hover{background:var(--brand-050);color:var(--brand-d)}
.config-warning{background:#fdecea;border-bottom:1px solid #f5c6c0;color:#a13023;font-size:14px;text-align:center;padding:9px}
.config-warning code{background:#fff;padding:1px 6px;border-radius:5px}
.site-foot{border-top:1px solid var(--line);background:var(--white);color:var(--muted);font-size:var(--fs-sm);padding:var(--sp-6) 0;margin-top:var(--sp-5)}
.site-foot a{text-decoration:underline;text-underline-offset:2px}
.site-foot a:hover{color:var(--brand-d)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);font-family:inherit;font-weight:600;font-size:var(--fs-base);cursor:pointer;padding:11px 20px;border-radius:var(--radius-sm);border:1.5px solid transparent;transition:background var(--ease),border-color var(--ease),box-shadow var(--ease),transform var(--ease);white-space:nowrap}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.6;cursor:default}
.btn-primary{background:var(--brand);color:#fff;box-shadow:0 1px 2px rgba(19,75,158,.25)}
.btn-primary:hover:not(:disabled){background:var(--brand-d)}
.btn-secondary{background:var(--white);color:var(--brand-d);border-color:var(--line)}
.btn-secondary:hover:not(:disabled){background:var(--brand-050);border-color:var(--brand-100)}
.btn.wide{width:100%;margin-top:var(--sp-1)}
.btn.sm{padding:8px 14px;font-size:var(--fs-sm)}

/* ---------- hero + search ---------- */
.hero{background:linear-gradient(180deg,var(--brand-050),var(--paper));border-bottom:1px solid var(--line-2);margin-bottom:var(--sp-8)}
.hero-inner{max-width:760px;margin:0 auto;padding:var(--sp-12) var(--sp-5) var(--sp-10);text-align:center}
.eyebrow{font-size:var(--fs-xs);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--brand)}
.hero h1{font-size:var(--fs-hero);font-weight:800;line-height:1.08;margin-top:var(--sp-3);letter-spacing:-.03em}
.hero h1 em{font-style:normal;color:var(--brand)}
.lede{color:var(--muted);margin-top:var(--sp-4);font-size:1.08rem}
.searchbar{display:flex;gap:var(--sp-2);align-items:flex-end;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--sp-3);margin-top:var(--sp-6);text-align:left}
.sb-field{flex:1;min-width:0}
.sb-field label{display:block;font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin:0 0 5px 4px}
.sb-field select,.sb-field input{width:100%;font-family:inherit;font-size:var(--fs-base);color:var(--ink);background:var(--paper);border:1.5px solid var(--line);border-radius:var(--radius-xs);padding:11px 12px;transition:border-color var(--ease),box-shadow var(--ease)}
.sb-field select:focus,.sb-field input:focus{outline:none;border-color:var(--brand);box-shadow:var(--ring)}
.sb-btn{padding:12px 24px}
@media(max-width:640px){.searchbar{flex-direction:column;align-items:stretch}.sb-btn{width:100%}}

/* how */
.how{max-width:var(--maxw);margin:0 auto var(--sp-2);padding:0 var(--sp-5)}
.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
.how-item{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-5)}
.how-ic{width:30px;height:30px;border-radius:50%;background:var(--brand);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:15px}
.how-item h3{font-size:var(--fs-md);margin:var(--sp-3) 0 var(--sp-1)}
.how-item p{font-size:14.5px}
@media(max-width:760px){.how-grid{grid-template-columns:1fr}}

/* ---------- browse layout ---------- */
.browse-layout{display:grid;grid-template-columns:250px 1fr;gap:var(--sp-8);align-items:start}
@media(max-width:820px){.browse-layout{grid-template-columns:1fr;gap:var(--sp-5)}}
.rail{position:sticky;top:80px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-5) var(--sp-5) var(--sp-3);box-shadow:var(--shadow)}
@media(max-width:820px){.rail{position:static}}
.rail-block{padding-bottom:var(--sp-4);margin-bottom:var(--sp-4);border-bottom:1px solid var(--line-2)}
.rail-h{font-size:var(--fs-xs);font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:var(--sp-3)}
.rail-opts{display:flex;flex-direction:column;gap:6px}
.rail-opt{text-align:left;font-family:inherit;font-size:14.5px;color:var(--ink);background:none;border:1px solid transparent;border-radius:var(--radius-xs);padding:8px 10px;cursor:pointer;transition:background var(--ease),color var(--ease)}
.rail-opt:hover{background:var(--paper)}
.rail-opt.on{background:var(--brand);color:#fff;font-weight:600}
.rail-input{width:100%;font-family:inherit;font-size:var(--fs-base);background:var(--paper);border:1.5px solid var(--line);border-radius:var(--radius-xs);padding:10px 11px;transition:border-color var(--ease),box-shadow var(--ease)}
.rail-input:focus{outline:none;border-color:var(--brand);box-shadow:var(--ring)}
.rail-check{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--ink);cursor:pointer;padding:2px 0 var(--sp-3);line-height:1.4}
.rail-check input{width:17px;height:17px;accent-color:var(--brand);flex:none}
.rail-reset{padding:6px 0;color:var(--brand-d);font-weight:600;font-size:14px}

/* results */
.results-head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);margin-bottom:var(--sp-4);flex-wrap:wrap}
.res-count{font-size:var(--fs-base);font-weight:600}
.sort{display:flex;align-items:center;gap:var(--sp-2);font-size:14px;color:var(--muted)}
.sort select{font-family:inherit;font-size:14.5px;color:var(--ink);background:var(--white);border:1.5px solid var(--line);border-radius:var(--radius-xs);padding:9px 12px}
.results-list{display:flex;flex-direction:column;gap:var(--sp-3)}

/* rich result card */
.rcard{display:grid;grid-template-columns:auto 1fr auto;gap:var(--sp-5);align-items:start;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-5);cursor:pointer;transition:box-shadow var(--ease),border-color var(--ease),transform var(--ease)}
.rcard:hover{box-shadow:var(--shadow-hover);border-color:var(--brand-100);transform:translateY(-1px)}
.rcard.featured{border-color:var(--gold-line);box-shadow:0 0 0 1px var(--gold-line), var(--shadow)}
.rcard-avatar{width:60px;height:60px;border-radius:50%;background:var(--sage);color:var(--brand-d);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:21px;overflow:hidden}
.rcard-avatar img,.avatar img,.photo-prev img{width:100%;height:100%;object-fit:cover}
.rcard-badges{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin-bottom:var(--sp-1)}
.rcard-name{font-size:1.18rem;font-weight:700;letter-spacing:-.01em}
.rcard-sub{color:var(--brand-d);font-weight:600;font-size:14.5px;margin-top:1px}
.rcard-zone{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:14px;margin-top:7px}
.rcard-zone .pin{color:var(--brand)}
.rcard-serv{color:var(--muted);font-size:14.5px;margin-top:9px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rcard-side{display:flex;flex-direction:column;align-items:flex-end;gap:var(--sp-3);text-align:right;min-width:120px}
.rcard-price{font-size:1.4rem;font-weight:800;line-height:1;color:var(--ink);letter-spacing:-.02em}
.rcard-price span{font-size:var(--fs-xs);color:var(--muted);font-weight:500}
.rcard-price.muted-price{font-size:14px;color:var(--muted);font-weight:500;letter-spacing:0}
.rcard-cta{pointer-events:none}
@media(max-width:560px){
  .rcard{grid-template-columns:auto 1fr;row-gap:var(--sp-3)}
  .rcard-side{grid-column:1 / -1;flex-direction:row;justify-content:space-between;align-items:center;text-align:left;border-top:1px solid var(--line-2);padding-top:var(--sp-3)}
  .rcard-cta{pointer-events:auto}
}

/* badges + stelle */
.feat{font-size:11px;font-weight:600;color:var(--gold-ink);background:var(--gold-bg);border:1px solid var(--gold-line);padding:2px 9px;border-radius:var(--radius-pill);white-space:nowrap}
.verified{font-size:11px;font-weight:600;color:var(--brand-d);background:var(--brand-050);border:1px solid var(--brand-100);padding:2px 9px;border-radius:var(--radius-pill);white-space:nowrap}
.rating-chip{font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap}
.star{color:var(--gold)}
.stars .star{font-size:14px}

/* ---------- cards / forms ---------- */
.narrow{max-width:560px;margin:0 auto}
.card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--sp-6);margin-top:var(--sp-4)}
.card.featured{border-color:var(--gold-line);box-shadow:0 0 0 1px var(--gold-line), var(--shadow)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)}
@media(max-width:460px){.grid2{grid-template-columns:1fr}}
.field{margin-bottom:var(--sp-4)}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;font-family:inherit;font-size:16px;color:var(--ink);background:var(--paper);border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:11px 13px;transition:border-color var(--ease),box-shadow var(--ease)}
.field textarea{resize:vertical;min-height:82px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--brand);box-shadow:var(--ring)}
.field input[type=file]{padding:8px;background:var(--white);font-size:14px}
.roles{display:flex;gap:var(--sp-3)}
.role{flex:1;display:flex;align-items:center;gap:var(--sp-2);border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:var(--sp-3);font-size:var(--fs-base);cursor:pointer;background:var(--paper);transition:border-color var(--ease),background var(--ease)}
.role:hover{border-color:var(--brand-100)}
.switch{margin-top:var(--sp-4);font-size:14px;color:var(--muted);text-align:center}
.switch a{color:var(--brand-d);font-weight:600}

/* completezza profilo */
.completeness{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-sm);padding:var(--sp-3) var(--sp-4);margin-bottom:var(--sp-4)}
.comp-top{display:flex;justify-content:space-between;gap:var(--sp-3);flex-wrap:wrap;font-size:14px;margin-bottom:var(--sp-2)}
.comp-bar{height:8px;background:var(--line);border-radius:var(--radius-pill);overflow:hidden}
.comp-fill{height:100%;background:var(--brand);border-radius:var(--radius-pill);transition:width .4s var(--ease)}

/* foto profilo (form) */
.photo-row{display:flex;align-items:center;gap:var(--sp-4)}
.photo-prev{width:64px;height:64px;border-radius:50%;background:var(--sage);color:var(--brand-d);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:20px;overflow:hidden;flex:none}

/* profilo dettaglio */
.prof-head{display:flex;align-items:flex-start;gap:var(--sp-3)}
.prof-head.big{gap:var(--sp-4)}
.avatar{width:46px;height:46px;border-radius:50%;background:var(--sage);color:var(--brand-d);display:flex;align-items:center;justify-content:center;font-weight:700;flex:none;overflow:hidden}
.avatar.lg{width:64px;height:64px;font-size:22px}
.prof-meta{flex:1;min-width:0}
.prof-name{font-weight:700;display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.prof-name.lg{font-size:1.35rem;letter-spacing:-.01em}
.rate{text-align:right;font-weight:800;font-size:1.3rem;letter-spacing:-.02em}
.rate span{display:block;font-size:11px;color:#94a1b2;font-weight:500}
.detail{margin-top:var(--sp-4)}
.detail h4{margin-bottom:var(--sp-1)}
.back{display:inline-block;margin-bottom:var(--sp-2);color:var(--muted);font-size:14px}
.back:hover{color:var(--brand-d)}
.empty{padding:var(--sp-10);text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:var(--radius);background:var(--white)}

/* recensioni */
.review{border-top:1px solid var(--line-2);padding:var(--sp-4) 0}
.review:first-of-type{border-top:none}
.review-head{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.review-author{font-weight:600}
.review-text{margin-top:6px}
.review-reply{margin-top:var(--sp-2);background:var(--paper);border-radius:var(--radius-xs);padding:10px 12px;font-size:14px;color:var(--muted)}
.stars-pick .star{font-size:26px;cursor:pointer;margin-right:2px;color:#cbd3dd;transition:color var(--ease)}
.stars-pick .star.on{color:var(--gold)}

/* dashboard */
.dash-head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-1)}
.req{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-4);margin-top:var(--sp-3);display:flex;justify-content:space-between;gap:var(--sp-4);align-items:flex-start}
.req-top{font-weight:600}
.req-note{color:var(--muted);font-size:var(--fs-base);margin-top:6px}

/* piani */
.plans-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:var(--sp-4);margin-top:var(--sp-3)}
.plan{border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-5);background:var(--white);display:flex;flex-direction:column;gap:var(--sp-2);box-shadow:var(--shadow)}
.plan.free{background:var(--paper);box-shadow:none}
.plan .price{font-size:2rem;font-weight:800;line-height:1;letter-spacing:-.02em}
.plan .price small{font-size:.9rem;color:var(--muted);font-weight:500}
.plan-status{background:var(--brand-050);border:1px solid var(--brand-100);border-radius:var(--radius);padding:var(--sp-4) var(--sp-5);margin:var(--sp-4) 0}

/* autocomplete comune */
.ac-wrap{position:relative}
.ac-drop{position:absolute;left:0;right:0;top:calc(100% + 4px);background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow);z-index:50;max-height:240px;overflow:auto}
.ac-item{padding:9px 12px;cursor:pointer;font-size:var(--fs-base);display:flex;justify-content:space-between;gap:var(--sp-2)}
.ac-item:hover{background:var(--brand-050)}
.ac-item small{color:var(--muted)}

/* mappa */
.map-wrap{margin-top:var(--sp-3)}
#map{height:520px;border-radius:var(--radius);border:1px solid var(--line);overflow:hidden}
#browse-map{height:300px;border-radius:var(--radius);border:1px solid var(--line);overflow:hidden;margin-bottom:var(--sp-4)}
.leaflet-popup-content{font-family:var(--font)}
.map-pop b{font-size:15px}.map-pop a{color:var(--brand-d);font-weight:600}
@media(max-width:640px){#map{height:60vh}}

/* pubblicità */
.ad-card{display:block;border:1px solid var(--line);border-radius:var(--radius);background:var(--white);padding:var(--sp-4);margin-bottom:var(--sp-3);text-decoration:none;color:var(--ink);transition:box-shadow var(--ease),border-color var(--ease)}
.ad-card:hover{box-shadow:var(--shadow-hover);border-color:var(--brand-100)}
.ad-label{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-pill);padding:2px 8px}
.ad-title{font-weight:700;font-size:1.05rem;margin-top:var(--sp-1)}
.ad-cta{color:var(--brand-d);font-weight:600;font-size:14px}

/* done + toast */
.done{text-align:center;padding:var(--sp-4) 6px}
.done .badge{width:52px;height:52px;border-radius:50%;background:var(--brand-050);color:var(--brand-d);display:flex;align-items:center;justify-content:center;font-size:24px;margin:0 auto var(--sp-3)}
.done h4{font-weight:800;font-size:1.3rem;margin-bottom:6px;text-transform:none;letter-spacing:-.01em;color:var(--ink)}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;font-size:var(--fs-base);padding:11px 18px;border-radius:var(--radius-sm);box-shadow:var(--shadow);z-index:40}

/* ---------- skeleton (caricamento) ---------- */
@keyframes shimmer{100%{background-position:-200% 0}}
.skeleton,.skel-card{background:linear-gradient(90deg,#eef2f7 25%,#e2e8f0 37%,#eef2f7 63%);background-size:200% 100%;animation:shimmer 1.3s linear infinite;border-radius:var(--radius)}
.skel-card{height:104px;margin-bottom:var(--sp-3)}
