/* Gotosardinia: stile "Tessuto sardo" */
:root{
  --lana:#F4EDE1; --lana2:#EADFCC; --carta:#FBF7F0; --carbone:#1D1916; --inchiostro:#2E2823;
  --terra:#B4472C; --terra2:#8E3520; --indaco:#22385C; --indaco2:#172741; --ocra:#C9963A; --mirto:#3F5B45; --corallo:#D8735A;
  --muted:#6B6158; --line:#D9CCB6; --radius:4px;
  --display:"Fraunces", Georgia, "Times New Roman", serif; --body:"Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
  --w:1180px;
  --weave:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='28' viewBox='0 0 56 28'%3E%3Crect width='56' height='28' fill='%23B4472C'/%3E%3Cpath d='M0 14 L14 0 L28 14 L14 28Z M28 14 L42 0 L56 14 L42 28Z' fill='%2322385C'/%3E%3Cpath d='M14 6 L22 14 L14 22 L6 14Z M42 6 L50 14 L42 22 L34 14Z' fill='%23C9963A'/%3E%3Cpath d='M14 11 L17 14 L14 17 L11 14Z M42 11 L45 14 L42 17 L39 14Z' fill='%23F4EDE1'/%3E%3Ccircle cx='28' cy='14' r='2' fill='%23F4EDE1'/%3E%3Ccircle cx='0' cy='14' r='2' fill='%23F4EDE1'/%3E%3Ccircle cx='56' cy='14' r='2' fill='%23F4EDE1'/%3E%3C/svg%3E");
  --weave-thin:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='12' viewBox='0 0 24 12'%3E%3Cpath d='M0 6 L6 0 L12 6 L6 12Z M12 6 L18 0 L24 6 L18 12Z' fill='%23B4472C'/%3E%3Cpath d='M6 3 L9 6 L6 9 L3 6Z M18 3 L21 6 L18 9 L15 6Z' fill='%23F4EDE1'/%3E%3C/svg%3E");
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M0 0h1v1H0zM4 4h1v1H4z' fill='%23000' fill-opacity='.035'/%3E%3C/svg%3E");
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--lana) var(--grain);color:var(--inchiostro);font:400 1.06rem/1.7 var(--body);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--terra2);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--terra)}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.12;color:var(--carbone);margin:0 0 .6em;font-optical-sizing:auto;letter-spacing:-.01em}
h2{font-size:clamp(1.6rem,3vw,2.3rem)} h3{font-size:1.3rem}
p{margin:0 0 1.1em}
.wrap{max-width:var(--w);margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:99}
.band{height:28px;background:var(--weave);background-size:56px 28px}
.band--thin{height:12px;background:var(--weave-thin);background-size:24px 12px;opacity:.9}
.kicker{display:inline-flex;align-items:center;gap:.6em;font:600 .78rem/1 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--terra)}
.kicker::before{content:"";width:10px;height:10px;background:var(--terra);transform:rotate(45deg)}

/* header */
.top{position:sticky;top:0;z-index:50;background:var(--carta);border-bottom:1px solid var(--line)}
.top__in{max-width:var(--w);margin:0 auto;padding:10px 20px;display:flex;align-items:center;gap:20px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--carbone)}
.brand svg{width:34px;height:34px;flex:none}
.brand b{font:700 1.35rem/1 var(--display);letter-spacing:-.02em}
.brand b i{color:var(--terra);font-style:italic;font-weight:500}
.nav{margin-left:auto}
.nav ul{list-style:none;display:flex;gap:4px;margin:0;padding:0}
.nav a{display:block;padding:8px 11px;text-decoration:none;color:var(--inchiostro);font-weight:600;font-size:.93rem;border-radius:var(--radius)}
.nav a:hover,.nav a[aria-current]{background:var(--lana);color:var(--terra2)}
.langs{display:flex;gap:4px}
.langs a{font:700 .74rem/1 var(--body);letter-spacing:.08em;text-decoration:none;color:var(--muted);border:1px solid var(--line);padding:6px 7px;border-radius:var(--radius)}
.langs a[aria-current]{background:var(--indaco);border-color:var(--indaco);color:#fff}
.navbtn{display:none;margin-left:auto;background:var(--indaco);color:#fff;border:0;padding:9px 14px;font:700 .9rem var(--body);border-radius:var(--radius)}
@media (max-width:1180px){
  .navbtn{display:block}.nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--carta);border-bottom:1px solid var(--line)}
  .nav.open{display:block}.nav ul{flex-direction:column;padding:8px 20px 16px}.langs{order:3}
}

/* hero home */
.hero{position:relative;background:var(--indaco2);color:var(--lana);overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(1200px 500px at 85% 20%,rgba(201,150,58,.18),transparent 60%),radial-gradient(800px 600px at 10% 110%,rgba(180,71,44,.25),transparent 60%)}
.hero__in{position:relative;max-width:var(--w);margin:0 auto;padding:56px 20px 40px;display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}
.hero h1{color:#fff;font-size:clamp(3.2rem,9vw,7.4rem);font-weight:300;font-style:italic;letter-spacing:-.04em;line-height:.9;margin:.15em 0 .2em}
.hero h1 b{display:block;font-style:normal;font-weight:800;color:var(--ocra);letter-spacing:-.03em}
.hero .kicker{color:var(--ocra)}.hero .kicker::before{background:var(--ocra)}
.hero p.lead{font-size:1.2rem;max-width:34em;color:#E9DFCF}
.hero__cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.isola{position:relative;max-width:460px;margin:0 auto;width:100%}
.isola svg{width:100%;height:auto;filter:drop-shadow(0 30px 40px rgba(0,0,0,.35))}
.isola .pt{cursor:pointer}
.isola .pt circle{fill:var(--lana);stroke:var(--indaco2);stroke-width:2}
.isola .pt text{font:600 15px var(--body);fill:#fff;paint-order:stroke;stroke:var(--indaco2);stroke-width:4px}
.isola .pt:hover circle,.isola .pt:focus circle{fill:var(--ocra)}
.isola a{text-decoration:none}
.btn{display:inline-flex;align-items:center;gap:.5em;padding:12px 20px;border-radius:var(--radius);font:700 .98rem/1 var(--body);text-decoration:none;border:2px solid transparent;cursor:pointer}
.btn--terra{background:var(--terra);color:#fff}.btn--terra:hover{background:var(--terra2);color:#fff}
.btn--line{border-color:currentColor;color:inherit}.btn--line:hover{color:var(--ocra)}
.hero .btn--line{color:#fff}
.btn--indaco{background:var(--indaco);color:#fff}.btn--indaco:hover{background:var(--indaco2);color:#fff}

/* page head */
.phead{background:var(--carta);border-bottom:1px solid var(--line)}
.phead__in{max-width:var(--w);margin:0 auto;padding:38px 20px 30px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end}
.phead h1{font-size:clamp(2.2rem,5vw,3.7rem);font-weight:500;margin:.25em 0 .2em}
.phead h1 em{color:var(--terra);font-weight:400}
.phead .lead{font-size:1.15rem;color:var(--muted);max-width:44em;margin:0}
.phead__rose{width:110px;height:110px;opacity:.9}
.crumbs{font-size:.84rem;color:var(--muted);margin-bottom:6px}.crumbs a{color:var(--muted)}
@media (max-width:700px){.phead__in{grid-template-columns:1fr}.phead__rose{display:none}}

/* layout */
main{display:block}
.section{max-width:var(--w);margin:0 auto;padding:56px 20px}
.section--tight{padding-top:28px;padding-bottom:28px}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:26px;flex-wrap:wrap}
.sec-head h2{margin:.3em 0 0}
.grid2{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:44px;align-items:start}
@media (max-width:900px){.grid2{grid-template-columns:1fr}}
.prose{max-width:46em}
.prose h2{margin-top:1.6em}.prose h3{margin-top:1.4em}
.prose>p:first-child:not(.note)::first-letter{font:600 3.6em/.8 var(--display);float:left;margin:.08em .1em 0 0;color:var(--terra)}
.prose ul,.prose ol{padding-left:1.2em}.prose li{margin:.3em 0}
.prose blockquote{margin:1.5em 0;padding:.4em 0 .4em 1.2em;border-left:3px solid var(--ocra);font:italic 1.2rem/1.5 var(--display);color:var(--carbone)}
.note{font-size:.88rem;color:var(--muted)}
.panel{background:var(--carta);border:1px solid var(--line);padding:22px;border-radius:var(--radius);position:relative}
.panel::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:var(--weave-thin);background-size:24px 12px}
.panel h3{font-size:1.15rem;margin-top:.2em}
.side>*+*{margin-top:18px}
.facts{list-style:none;padding:0;margin:0}.facts li{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed var(--line);padding:7px 0;font-size:.95rem}.facts b{font-weight:600}

/* cards */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.card{position:relative;display:flex;flex-direction:column;background:var(--carta);border:1px solid var(--line);border-radius:var(--radius);padding:22px 22px 20px;text-decoration:none;color:inherit;transition:transform .2s,box-shadow .2s;overflow:hidden}
.card:hover{transform:translateY(-3px);box-shadow:0 14px 30px -18px rgba(29,25,22,.45);color:inherit}
.card__n{font:300 italic 2.6rem/1 var(--display);color:var(--ocra)}
.card h3{margin:.35em 0 .3em;font-size:1.32rem}
.card p{color:var(--muted);font-size:.96rem;margin:0}
.card__more{margin-top:auto;padding-top:14px;font-weight:700;font-size:.9rem;color:var(--terra2)}
.card::after{content:"";position:absolute;right:-18px;top:-18px;width:56px;height:56px;background:var(--c,var(--terra));transform:rotate(45deg);opacity:.9}
.card--plain::after{display:none}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.chips a{display:inline-block;padding:7px 12px;border:1px solid var(--line);border-radius:30px;text-decoration:none;color:var(--inchiostro);background:var(--carta);font-size:.92rem}
.chips a:hover{border-color:var(--terra);color:var(--terra2)}
.dark{background:var(--carbone);color:#E9DFCF}
.dark h2,.dark h3{color:#fff}.dark .kicker{color:var(--ocra)}.dark .kicker::before{background:var(--ocra)}
.dark .card{background:#26211D;border-color:#3A322B}.dark .card p{color:#BCAE99}.dark .card__more{color:var(--ocra)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
@media (max-width:860px){.split,.hero__in{grid-template-columns:1fr}}

/* recipe */
.recipe{display:grid;grid-template-columns:320px minmax(0,1fr);gap:40px;align-items:start}
.recipe__ing{position:sticky;top:90px}
.recipe__ing ul{list-style:none;padding:0;margin:0}
.recipe__ing li{padding:8px 0 8px 22px;border-bottom:1px dashed var(--line);position:relative}
.recipe__ing li::before{content:"";position:absolute;left:2px;top:15px;width:8px;height:8px;background:var(--ocra);transform:rotate(45deg)}
.steps{counter-reset:s;list-style:none;padding:0}
.steps li{counter-increment:s;position:relative;padding:0 0 18px 64px;min-height:50px}
.steps li::before{content:counter(s);position:absolute;left:0;top:-6px;font:300 italic 2.6rem/1 var(--display);color:var(--terra)}
@media (max-width:820px){.recipe{grid-template-columns:1fr}.recipe__ing{position:static}}

/* weather */
.meteo{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.meteo__c{background:var(--carta);border:1px solid var(--line);border-radius:var(--radius);padding:14px}
.meteo__c b{display:block;font:600 1.05rem var(--display)}
.meteo__t{font:300 2.3rem/1.1 var(--display);color:var(--terra)}
.meteo__s{font-size:.85rem;color:var(--muted)}
.dark .meteo__c{background:#26211D;border-color:#3A322B}.dark .meteo__c b{color:#fff}.dark .meteo__s{color:#BCAE99}

/* map */
.map{height:560px;border:1px solid var(--line);border-radius:var(--radius);background:#dfe7ea}
.map--s{height:340px}
.legend{display:flex;flex-wrap:wrap;gap:14px;margin:12px 0;font-size:.9rem}
.legend span::before{content:"";display:inline-block;width:10px;height:10px;margin-right:6px;transform:rotate(45deg);background:var(--c)}
.leaflet-popup-content{font:400 .95rem/1.45 var(--body)}
.leaflet-popup-content b{font-family:var(--display);font-size:1.05rem}
.mk{width:16px;height:16px;transform:rotate(45deg);border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.4)}

/* promo / services */
.promo{background:var(--indaco);color:#E7E2D6;border-radius:var(--radius);padding:26px;position:relative;overflow:hidden}
.promo h2,.promo h3{color:#fff}.promo a.btn{margin-top:4px}
.promo::after{content:"";position:absolute;right:-30px;bottom:-30px;width:120px;height:120px;background:var(--weave);background-size:56px 28px;transform:rotate(45deg);opacity:.35}
.promo__note{font-size:.78rem;opacity:.8;margin:12px 0 0}
.promo--terra{background:var(--terra2)}
.promo--mirto{background:var(--mirto)}
.services{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.staymap iframe{border:1px solid var(--line);border-radius:var(--radius);background:#fff}
.ad{margin:26px auto;max-width:var(--w);padding:0 20px;text-align:center}
.ad__label{display:block;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.faq details{border-bottom:1px solid var(--line);padding:12px 0}.faq summary{cursor:pointer;font:600 1.08rem var(--display)}
.toc{columns:2;gap:30px;padding-left:1.1em}@media (max-width:600px){.toc{columns:1}}

/* footer */
.foot{background:var(--carbone);color:#BCAE99;margin-top:60px}
.foot__in{max-width:var(--w);margin:0 auto;padding:44px 20px 30px;display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:30px}
.foot h4{color:#fff;font-size:1.05rem}
.foot ul{list-style:none;padding:0;margin:0}.foot li{margin:6px 0}
.foot a{color:#E9DFCF;text-decoration:none}.foot a:hover{color:var(--ocra)}
.foot__end{border-top:1px solid #3A322B;max-width:var(--w);margin:0 auto;padding:16px 20px 30px;font-size:.84rem;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
@media (max-width:860px){.foot__in{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.foot__in{grid-template-columns:1fr}.section{padding:40px 16px}.wrap,.top__in,.hero__in,.phead__in{padding-left:16px;padding-right:16px}}
.toc{list-style:none;padding:0;margin:0;columns:2;column-gap:2em}.toc li{break-inside:avoid;padding:3px 0;font-size:.93rem}.abbr{columns:2;column-gap:2em;font-size:.93rem}.abbr li{break-inside:avoid}@media(max-width:700px){.toc,.abbr{columns:1}}
.prose h2 a{text-decoration:none;color:inherit}.prose h2 a:hover{color:var(--terra)}
.promo__note{position:relative;z-index:1;max-width:82%}
/* strumenti */
.srch{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid var(--line);border-radius:var(--radius);color:var(--indaco);flex:0 0 34px}
@media (max-width:980px){.srch{order:4}}
.srch:hover{border-color:var(--terra);color:var(--terra)}
.srch svg{width:17px;height:17px}
.bt{background:var(--carta);border:1px solid var(--line);border-radius:var(--radius);padding:18px}
.bt__bar{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.seg{display:inline-flex;border:1px solid var(--indaco);border-radius:var(--radius);overflow:hidden}
.seg button,.mesi button{font:600 .9rem var(--body);background:transparent;border:0;padding:9px 14px;cursor:pointer;color:var(--indaco)}
.seg button[aria-pressed=true]{background:var(--indaco);color:#fff}
.bt__sel select{font:inherit;padding:7px 10px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;margin-left:6px}
.bt__f{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.chipf{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--line);border-radius:99px;background:#fff;font-size:.92rem;cursor:pointer}
.chipf:has(input:checked){border-color:var(--terra);background:#fbe9e3}
.bt__wind{font-size:.95rem;color:var(--muted);margin-bottom:10px}
.bt__list{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
.bc{background:#fff;border:1px solid var(--line);border-left:6px solid var(--c,#999);border-radius:var(--radius);padding:12px 14px}
.bc h3{font-size:1.08rem;margin:0 0 4px}
.bc__lv{display:inline-block;font:700 .75rem var(--body);letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--c);padding:3px 8px;border-radius:3px;margin-right:6px}
.bc p{margin:6px 0 0;font-size:.9rem}
.tag{display:inline-block;font:600 .72rem var(--body);letter-spacing:.04em;padding:2px 7px;border-radius:3px;background:var(--lana2);color:var(--inchiostro);margin:2px 4px 2px 0}
.tag--l{background:transparent;border:1px solid var(--line)}
.days{list-style:none;padding:0;margin:0}
.day{display:flex;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.day__n{flex:0 0 42px;height:42px;display:flex;align-items:center;justify-content:center;background:var(--terra);color:#fff;font:600 1.2rem var(--display);border-radius:50%;margin-top:2px}


.day h3{margin:0 0 .3em;font-size:1.15rem}.day p{margin:0 0 .3em}
.mesi{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px}
.mesi button{border:1px solid var(--line);border-radius:99px;background:#fff}
.mesi button[aria-pressed=true]{background:var(--terra);border-color:var(--terra);color:#fff}
.evlist{list-style:none;padding:0;margin:0}
.ev{display:flex;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.ev[hidden]{display:none}
.ev__d{flex:0 0 54px;height:54px;display:flex;align-items:center;justify-content:center;background:var(--indaco);color:var(--lana);font:600 .95rem var(--display);text-transform:uppercase;border-radius:var(--radius)}
.ev h3{margin:0 0 .2em;font-size:1.15rem}.ev p{margin:0 0 .3em}
.tbl{width:100%;border-collapse:collapse;font-size:.95rem;background:var(--carta)}
.tbl th{text-align:left;background:var(--indaco);color:#fff;padding:9px 10px;font-weight:600}
.tbl td{padding:8px 10px;border-bottom:1px solid var(--line)}
.prose .tbl{display:block;overflow-x:auto}
@media(min-width:700px){.prose .tbl{display:table}}
.sbox{display:flex;gap:10px;margin-bottom:20px}
.sbox input{flex:1;font:inherit;font-size:1.1rem;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
.sres{list-style:none;padding:0;margin:0}.sres li{padding:12px 0;border-bottom:1px solid var(--line)}.sres a{font:600 1.1rem var(--display)}.sres p{margin:.2em 0 0;font-size:.92rem;color:var(--muted)}
.promo2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.promo2 a{display:block;text-decoration:none;color:inherit;background:var(--carta);border:1px solid var(--line);border-top:6px solid var(--c);border-radius:var(--radius);padding:20px 22px}
.promo2 a:hover{border-color:var(--c)}.promo2 h3{margin:.4em 0 .3em}.promo2 p{margin:0;color:var(--muted)}
.bc__d{font-size:.88rem;color:var(--muted)}
@media (max-width:980px){.top__in{gap:8px;padding:10px 14px}.langs{gap:3px}.langs a{padding:6px 5px}.srch{width:32px;height:32px;flex-basis:32px}}

.nav a,.brand{white-space:nowrap}
