:root{--page:#f7f5ee;--paper:#fffefa;--ink:#232d25;--green:#294f3c;--muted:#606d62;--line:#d9ded3;--sage:#e8eee3;--rust:#a03d30}
*{box-sizing:border-box}
body{margin:0;background:var(--page);color:var(--ink);font:16px/1.55 "Inter",system-ui,sans-serif}
[hidden]{display:none!important}
h1,h2,h3,p{margin:0}
h1,h2,h3,.brand{font-family:"Instrument Serif",Georgia,serif;font-weight:400}
h1{font-size:clamp(2.5rem,5vw,4.6rem);line-height:.99;letter-spacing:-.047em}
h2{font-size:clamp(2rem,3vw,2.9rem);line-height:1.05;letter-spacing:-.035em}
h3{font-size:2rem;line-height:1.12;letter-spacing:-.035em}
button,input,select{font:inherit}
button{cursor:pointer}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #738a56;outline-offset:3px}
button:disabled{cursor:default;opacity:.55}
.shell{max-width:1200px;margin:auto;padding-inline:32px}
.demo-notice{text-align:center;background:#283d30;color:white;padding:7px 12px;font-size:.72rem;letter-spacing:.07em}
.header{height:96px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.brand{font-size:2rem;text-decoration:none;color:var(--ink);line-height:1;letter-spacing:-.045em}
.brand span{display:block;font:600 .58rem/1.5 system-ui;letter-spacing:.21em;margin-top:7px}
.outline,.primary{border-radius:5px;padding:12px 17px;font-size:.86rem;font-weight:650;white-space:nowrap}
.outline{background:transparent;border:1px solid #aeb8ab;color:var(--ink)}
.outline:hover{background:var(--sage)}
.primary{color:white;background:var(--green);border:1px solid var(--green)}
.primary:hover:not(:disabled){background:#1e3b2d}
.primary span,.outline span{margin-left:5px}
.hero{min-height:380px;border-radius:12px;display:flex;align-items:center;padding:48px;background:linear-gradient(100deg,#17251be8,#17251b78 47%,transparent 80%),url('cortile.webp') center 53%/cover,#344637;color:#fffdf3}
.hero-text{max-width:470px}
.hero .eyebrow{color:#e6e9d8;margin-bottom:22px}
.hero-text p:not(.eyebrow){max-width:330px;margin-top:19px;color:#f2f0e5}
.eyebrow{font-size:.67rem;letter-spacing:.16em;font-weight:750;color:var(--green)}
.search{position:relative;display:grid;grid-template-columns:1fr 1fr .8fr auto;gap:16px;align-items:end;background:var(--paper);border:1px solid var(--line);border-radius:9px;margin:-21px 26px 0;padding:19px;box-shadow:0 10px 34px #22372812}
label{display:grid;gap:6px;font-size:.78rem;font-weight:650;min-width:0}
input,select{border:1px solid #bfc8b9;border-radius:5px;padding:10px 11px;width:100%;min-width:0;background:white;color:var(--ink);min-height:44px}
.search .primary{min-height:44px}
.error{color:var(--rust);font-size:.83rem;grid-column:1/-1}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:12px;margin:39px 0 17px}
.section-head .eyebrow{margin-bottom:8px}
.section-head>p,.muted{font-size:.87rem;color:var(--muted)}
.rooms{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.panel,.room{border:1px solid var(--line);border-radius:9px;padding:22px;background:var(--paper)}
.room{display:grid;grid-template-columns:1fr auto;gap:18px}
.room p{margin-top:7px;color:var(--muted);font-size:.83rem}
.room small{display:block;color:var(--muted);margin-top:4px}
.room-price{text-align:right;align-self:center}
.room-price strong{font-size:1.45rem}
.room .primary{grid-column:1/-1;justify-self:start}
.inner{padding-top:12px;min-height:510px}
.inner h1{margin:24px 0}
.checkout-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:18px;align-items:start}
.checkout-grid h2{font-size:1.8rem;margin-bottom:8px}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:17px}
fieldset{border:0;padding:0;margin:20px 0 10px}
legend{font-weight:700;margin-bottom:8px;font-size:.9rem}
.option{display:flex;align-items:center;gap:7px;margin:6px 0}
.option input{width:auto;min-height:auto;accent-color:var(--green)}
.hint{background:var(--sage);padding:10px 12px;border-radius:5px;color:var(--green);font-size:.8rem;margin:13px 0}
.summary .sum-row{display:flex;justify-content:space-between;gap:15px;margin:12px 0;font-size:.89rem}
.summary .total{border-top:1px solid var(--line);padding-top:12px;font-size:1rem}
.confirmation{text-align:center;max-width:740px;margin:30px auto}
.confirmation h1{font-size:clamp(2.4rem,5vw,3.7rem)}
.confirmation .actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:19px auto 4px}
.checkmark{display:grid;place-items:center;width:47px;height:47px;margin:0 auto 18px;border-radius:50%;background:var(--sage);color:var(--green);font-size:1.4rem}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-bottom:15px}
.stats strong{display:block;font-size:1.6rem;margin-top:4px}
.table-panel{overflow:auto;padding:12px;margin-bottom:13px}
table{width:100%;border-collapse:collapse;text-align:left;font-size:.83rem;white-space:nowrap}
th,td{padding:11px;border-bottom:1px solid var(--line)}
th{font-size:.7rem;color:var(--muted)}
td .outline{padding:6px 9px;font-size:.74rem}
#noBookings{padding:20px}
.footer{padding-block:26px;margin-top:28px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:.75rem}
@media(max-width:720px){
 .shell{padding-inline:16px}.header{height:78px}.brand{font-size:1.56rem}
 .hero{min-height:330px;padding:25px;background-position:center,right 42%}
 .search{grid-template-columns:1fr 1fr;margin:-14px 10px 0;gap:11px;padding:13px}
 .search .primary{white-space:normal}
 .section-head{align-items:start;flex-direction:column;margin-top:28px}
 .rooms,.checkout-grid{grid-template-columns:1fr}.fields{grid-template-columns:1fr}
 .checkout-grid .summary{grid-row:1}.stats{gap:7px}.stats .panel{padding:10px}
 .stats strong{font-size:1.05rem}.stats .muted{font-size:.65rem}
 .footer{flex-direction:column}
}

.navigation{display:flex;justify-content:center;gap:clamp(14px,2.5vw,35px);font-size:.82rem;font-weight:650}
.navigation a{color:var(--ink);text-decoration:none}
.navigation a:hover{text-decoration:underline;text-underline-offset:5px}
.hero-link{display:inline-flex;align-items:center;justify-content:center;border-radius:5px;margin-top:19px;padding:11px 15px;background:#f7f5ee;color:#294532;text-decoration:none;font-weight:700;font-size:.83rem}
.hero-link:hover{background:#e8eee3}
#results,#searchForm,#la-casa,#dintorni,#informazioni{scroll-margin-top:24px}
.rooms{gap:20px}
.room{display:block;padding:0;overflow:hidden}
.room-photo{display:block;width:100%;position:relative;background:#e6e5dc;border:0;padding:0;text-align:left}
.room-photo img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block}
.room-photo span{position:absolute;right:12px;bottom:12px;padding:5px 10px;background:#fffef5;color:var(--ink);border-radius:3px;font-size:.73rem;font-weight:700}
.room-photo:hover span{text-decoration:underline}
.room-body{padding:22px}
.room-heading{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end}
.capacity{display:block;font-size:.72rem;color:var(--muted);margin-bottom:6px}
.room-amenities{margin:14px 0;border-block:1px solid var(--line);padding:9px 0;font-size:.82rem}
.room-amenities summary,.faq summary{cursor:pointer;font-weight:680}
.room-body .primary{margin-top:2px}
.story{margin:67px 0;display:grid;grid-template-columns:.93fr 1.07fr;gap:clamp(28px,6vw,85px);padding:35px 0;border-block:1px solid var(--line)}
.story h2,.destination h2,.information h2{margin:10px 0 15px}
.story-copy>p:last-child,.destination-copy>p:not(.eyebrow),.information>div>p:last-child{color:var(--muted);font-size:.94rem}
.services{display:grid;gap:12px}
.services div{border-left:2px solid #a5b89a;padding-left:15px}
.services strong{font-size:.91rem}
.services p{font-size:.83rem;color:var(--muted)}
.destination{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;border-radius:10px;overflow:hidden;background:#e6eadf}
.destination>img{width:100%;height:100%;min-height:340px;object-fit:cover}
.destination-copy{padding:clamp(24px,4vw,50px)}
.destination dl{margin:20px 0 0}
.destination dl>div{border-top:1px solid #c7d1c0;padding:10px 0}
.destination dt{font-size:.83rem;font-weight:700}
.destination dd{margin:2px 0 0;font-size:.82rem;color:var(--muted)}
.information{margin:66px 0;display:grid;grid-template-columns:.82fr 1.18fr;gap:30px}
.faq details{border-bottom:1px solid var(--line);padding:14px 0}
.faq details:first-child{border-top:1px solid var(--line)}
.faq details p{margin-top:9px;font-size:.89rem;color:var(--muted)}
.final-cta{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--green);color:#fffdf3;padding:clamp(20px,4vw,36px);border-radius:9px}
.final-cta .eyebrow{color:#dce9d4;margin-bottom:7px}
.final-cta .hero-link{margin:0;white-space:nowrap}
.summary-photo{display:block;width:100%;height:auto;aspect-ratio:16/8;object-fit:cover;margin-bottom:16px;border-radius:5px}
#photoDialog{width:min(92vw,950px);max-height:94vh;border:1px solid var(--line);border-radius:9px;padding:12px;background:var(--paper);color:var(--ink)}
#photoDialog::backdrop{background:#18271ec7}
.photo-dialog-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:2px 0 10px}
#largePhoto{display:block;width:100%;max-height:74vh;object-fit:contain;background:#e6e5dc;border-radius:4px}
@media(max-width:720px){
 .header{height:auto;min-height:78px;display:grid;grid-template-columns:1fr auto;padding-block:13px;gap:12px}
 .navigation{grid-row:2;grid-column:1/-1;justify-content:space-between;gap:9px;font-size:.75rem;border-top:1px solid var(--line);padding-top:9px}
 .hero{min-height:365px}
 .story,.destination,.information{grid-template-columns:1fr}
 .story,.information{margin-block:42px}
 .destination>img{min-height:0;aspect-ratio:3/2}
 .room-body{padding:16px}
 .room-heading h3{font-size:1.55rem}
 .room-price strong{font-size:1.16rem}
}

.room-perks{display:flex;flex-wrap:wrap;gap:7px;list-style:none;padding:0;margin:13px 0 17px}
.room-perks li{border:1px solid var(--line);border-radius:20px;padding:3px 8px;font-size:.72rem;color:var(--muted)}
.room-actions{display:flex;gap:8px;flex-wrap:wrap}
.room-actions .primary{margin:0}
#photoDialog{width:min(94vw,1120px);padding:21px}
.photo-dialog-head h2{font-size:clamp(1.85rem,3vw,2.5rem)}
.room-detail{display:grid;grid-template-columns:1.1fr .9fr;gap:23px;align-items:start}
.gallery figure{margin:0}
#largePhoto{aspect-ratio:3/2;height:auto;max-height:none;object-fit:cover}
.gallery figcaption{padding-top:8px;color:var(--muted);font-size:.78rem}
.photo-thumbnails{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:9px}
.photo-thumbnails button{padding:3px;background:transparent;border:2px solid transparent;border-radius:6px}
.photo-thumbnails button[aria-pressed="true"]{border-color:var(--green)}
.photo-thumbnails img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block;border-radius:3px}
.room-specs>p:not(.eyebrow){margin:8px 0 12px;color:var(--muted);font-size:.9rem}
.room-specs h3{font:700 .9rem/1.35 system-ui,sans-serif;letter-spacing:0;margin-bottom:6px}
.amenities-list{display:grid;grid-template-columns:1fr 1fr;gap:5px 13px;padding-left:15px;margin:0;font-size:.81rem}
.amenities-list li::marker{color:var(--green)}
.room-rules{padding:11px 0;margin-top:12px;border-top:1px solid var(--line)}
.room-rules p{font-size:.79rem;color:var(--muted)}
.detail-booking{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;padding-top:11px;border-top:1px solid var(--line)}
.detail-booking strong,.detail-booking small{display:block}
.detail-booking strong{font-size:1.35rem}
.detail-booking small{font-size:.75rem;color:var(--muted)}
.checkout-rules{border:1px solid var(--line);border-radius:5px;padding:12px;margin-top:16px;font-size:.84rem}
.checkout-rules ul{margin:5px 0 9px;padding-left:18px;color:var(--muted)}
.checkout-rules .option{margin-bottom:0}
.confirmation-stay{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin:19px 0;text-align:left}
.confirmation-stay div{padding:10px;border:1px solid var(--line);border-radius:5px}
.confirmation-stay dt{font-size:.7rem;color:var(--muted)}
.confirmation-stay dd{margin:2px 0 0;font-size:.85rem;font-weight:650}
@media(max-width:760px){
 #photoDialog{padding:14px}
 .room-detail{grid-template-columns:1fr;gap:15px}
 .confirmation-stay{grid-template-columns:repeat(2,1fr)}
}
