*{box-sizing:border-box;margin:0;padding:0} :root{ --olive:#5a6e2e;--olive-l:#8a9e50;--olive-p:#f0f3e8; --cream:#faf8f3;--bark:#3d2e1a;--sand:#e8e0d0;--sand2:#f2ede4; --blocked:#c0392b;--blocked-bg:#fce8e6; --range:#e8f0d8;--info-bg:#e8f4fd;--info-c:#1a6fa8; --warn-bg:#fff8e1;--warn-c:#7a5c00; --success-bg:#eaf3de;--success-c:#3b6d11; --txt:#2a2218;--txt2:#6b5e4a;--txt3:#9a8a78; --border:#ddd6c8;--white:#fff; } body{font-family:'DM Sans',sans-serif;background:var(--cream);color:var(--txt);min-height:100vh} .serif{font-family:'Cormorant Garamond',serif} .engine{max-width:960px;margin:0 auto;padding:1.5rem 1rem 4rem} /* ── Header ── */ .hdr{text-align:center;padding:2rem 0 1.5rem;border-bottom:1px solid var(--border);margin-bottom:1.5rem} .hdr h1{font-family:'Cormorant Garamond',serif;font-size:clamp(1.8rem,4vw,2.6rem);font-weight:400;color:var(--bark);letter-spacing:.02em} .hdr .sub{font-size:.82rem;color:var(--txt3);margin-top:.25rem;letter-spacing:.07em;text-transform:uppercase} /* ── Tabs ── */ .tabs{display:flex;background:var(--sand);border-radius:8px;padding:3px;margin-bottom:1.5rem} .tab-btn{flex:1;padding:.45rem;border:none;background:none;cursor:pointer;font-family:'DM Sans',sans-serif;font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;color:var(--txt2);transition:.2s;border-radius:6px} .tab-btn.on{background:var(--white);color:var(--bark);font-weight:500;box-shadow:0 1px 4px rgba(0,0,0,.1)} /* ── Cards ── */ .card{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:1.25rem;margin-bottom:1rem} .card-title{font-family:'Cormorant Garamond',serif;font-size:1.1rem;color:var(--bark);margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)} /* ── Packages ── */ .pkg-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:.7rem;margin-bottom:1.25rem} .pkg{border:1.5px solid var(--border);border-radius:10px;padding:.9rem;cursor:pointer;transition:all .2s;background:var(--white)} .pkg:hover{border-color:var(--olive-l);transform:translateY(-1px)} .pkg.on{border-color:var(--olive);background:var(--olive-p)} .pkg-name{font-family:'Cormorant Garamond',serif;font-size:1rem;font-weight:600;color:var(--bark);margin-bottom:.15rem} .pkg-season{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--txt3);margin-bottom:.4rem} .pkg-price{font-size:.82rem;font-weight:500;color:var(--olive)} .pkg-desc{font-size:.74rem;color:var(--txt2);margin-top:.35rem;line-height:1.5} /* ── Calendar ── */ .cal-wrap{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:1.25rem;margin-bottom:1rem} .cal-nav-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;flex-wrap:wrap;gap:.5rem} .cal-nav{display:flex;align-items:center;gap:.75rem} .nav-btn{width:28px;height:28px;border:1px solid var(--border);background:none;border-radius:6px;cursor:pointer;color:var(--txt2);font-size:.9rem;transition:.15s;display:flex;align-items:center;justify-content:center} .nav-btn:hover{background:var(--sand)} .cal-months-title{font-family:'Cormorant Garamond',serif;font-size:1rem;font-weight:500;color:var(--bark);min-width:200px;text-align:center} .legend{display:flex;gap:.9rem;flex-wrap:wrap} .leg{display:flex;align-items:center;gap:.35rem;font-size:.7rem;color:var(--txt3)} .leg-dot{width:9px;height:9px;border-radius:50%} .months{display:grid;grid-template-columns:1fr 1fr;gap:2rem} @media(max-width:580px){.months{grid-template-columns:1fr}} .month-name{font-family:'Cormorant Garamond',serif;font-size:.95rem;font-weight:500;text-align:center;color:var(--bark);margin-bottom:.65rem} .dgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px} .dh{text-align:center;font-size:.65rem;color:var(--txt3);padding:3px 0;text-transform:uppercase;letter-spacing:.04em} .d{text-align:center;font-size:.8rem;padding:6px 2px;border-radius:5px;cursor:pointer;transition:background .1s;color:var(--txt);line-height:1;position:relative} .d.past{color:var(--txt3);cursor:default} .d.bl{background:var(--blocked-bg);color:var(--blocked);cursor:not-allowed;font-size:.72rem} .d.s1,.d.s2{background:var(--olive);color:#fff;font-weight:500} .d.rng{background:var(--range)} .d.tod{outline:1.5px solid var(--olive-l);outline-offset:-1px} .d:not(.past):not(.bl):hover{background:var(--olive-p)} .d.emp{cursor:default} /* ── Selection + Price bar ── */ .sel-bar{background:var(--olive-p);border:1px solid var(--olive-l);border-radius:8px;padding:.75rem 1rem;margin-bottom:1rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem} .sel-txt{font-size:.85rem;color:var(--bark)} .price-box{font-size:.85rem;color:var(--olive);font-weight:500} .clr-btn{font-size:.72rem;color:var(--txt3);background:none;border:none;cursor:pointer;text-decoration:underline} /* ── Price breakdown ── */ .price-breakdown{background:var(--sand2);border-radius:8px;padding:.75rem 1rem;margin-bottom:.75rem;font-size:.82rem} .pb-row{display:flex;justify-content:space-between;padding:3px 0;color:var(--txt2)} .pb-row.total{font-weight:500;color:var(--bark);border-top:1px solid var(--border);padding-top:6px;margin-top:4px} /* ── Forms ── */ .fg{display:grid;grid-template-columns:1fr 1fr;gap:.7rem} @media(max-width:500px){.fg{grid-template-columns:1fr}} .field{display:flex;flex-direction:column;gap:.3rem} .field.full{grid-column:1/-1} label{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--txt3)} input,select,textarea{font-family:'DM Sans',sans-serif;font-size:.88rem;padding:.52rem .72rem;border:1px solid var(--border);border-radius:6px;background:var(--cream);color:var(--txt);outline:none;transition:.15s;width:100%} input:focus,select:focus,textarea:focus{border-color:var(--olive-l);background:var(--white)} textarea{resize:vertical;min-height:75px} .btn{padding:.5rem 1rem;border:1px solid var(--border);border-radius:6px;background:var(--cream);cursor:pointer;font-family:'DM Sans',sans-serif;font-size:.8rem;color:var(--txt);transition:.15s} .btn:hover{background:var(--sand)} .btn.primary{background:var(--olive);color:#fff;border-color:var(--olive)} .btn.primary:hover{background:#4a5c22} .btn.danger{background:var(--blocked-bg);color:var(--blocked);border-color:#f5c0bc} .btn.success{background:var(--success-bg);color:var(--success-c);border-color:#9ecf7a} .btn.sm{padding:.3rem .7rem;font-size:.75rem} .submit{width:100%;padding:.8rem;background:var(--olive);color:#fff;border:none;border-radius:8px;font-family:'Cormorant Garamond',serif;font-size:1.1rem;cursor:pointer;margin-top:.75rem;transition:.2s;letter-spacing:.03em} .submit:hover{background:#4a5c22} .submit:disabled{background:var(--txt3);cursor:default} /* ── Notice boxes ── */ .notice{border-radius:8px;padding:.7rem 1rem;font-size:.78rem;line-height:1.65;margin-bottom:.75rem} .notice.info{background:var(--info-bg);color:var(--info-c)} .notice.warn{background:var(--warn-bg);color:var(--warn-c)} .notice.success{background:var(--success-bg);color:var(--success-c)} /* ── Success ── */ .success-screen{text-align:center;padding:2.5rem 1rem} .success-screen h2{font-family:'Cormorant Garamond',serif;font-size:1.9rem;color:var(--olive);margin-bottom:.75rem} .success-screen p{color:var(--txt2);font-size:.9rem;line-height:1.7} /* ── Admin sub-tabs ── */ .atabs{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:1rem} .atab{padding:.35rem .85rem;border:1px solid var(--border);border-radius:20px;cursor:pointer;font-size:.78rem;color:var(--txt2);background:none;transition:.15s} .atab.on{background:var(--bark);color:#fff;border-color:var(--bark)} /* ── Booking cards ── */ .bk-card{border:1px solid var(--border);border-radius:9px;padding:.85rem 1rem;margin-bottom:.6rem} .bk-name{font-weight:500;font-size:.92rem;color:var(--bark)} .bk-dates{color:var(--olive);font-size:.8rem;margin:.2rem 0} .bk-meta{color:var(--txt3);font-size:.76rem} .badge{display:inline-block;padding:2px 9px;border-radius:10px;font-size:.68rem;font-weight:500} .b-pending{background:#fff3cd;color:#856404} .b-confirmed{background:var(--success-bg);color:var(--success-c)} .b-paid{background:#d0e8ff;color:#0c447c} .b-cancelled{background:var(--blocked-bg);color:var(--blocked)} .bk-actions{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.6rem} /* ── Season row ── */ .season-row{display:grid;grid-template-columns:1fr 1fr 80px 80px 28px;gap:.4rem;align-items:center;margin-bottom:.4rem} @media(max-width:560px){.season-row{grid-template-columns:1fr 1fr;}} /* ── Admin calendar ── */ .admin-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-top:.75rem} .ac-head{text-align:center;font-size:.65rem;color:var(--txt3);padding:3px 0;text-transform:uppercase} .ac-day{text-align:center;font-size:.76rem;padding:5px 2px;border-radius:4px;cursor:pointer;transition:.1s} .ac-day.ac-bl{background:var(--blocked-bg);color:var(--blocked)} .ac-day.ac-bk{background:var(--olive-p);color:var(--olive);font-weight:500} .ac-day.ac-past{color:var(--txt3);cursor:default} .ac-day:not(.ac-past):hover{background:var(--sand)} .ac-day.ac-emp{cursor:default} /* ── Misc ── */ .chip{display:inline-flex;align-items:center;gap:.35rem;padding:3px 9px;border:1px solid var(--border);border-radius:12px;font-size:.72rem;color:var(--txt2);margin:.2rem .2rem 0 0} .sep{height:1px;background:var(--border);margin:.75rem 0} .login-wrap{max-width:300px;margin:2rem auto;text-align:center} .login-wrap h3{font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:var(--bark);margin-bottom:1rem} .prompt-txt{text-align:center;padding:.75rem;color:var(--txt3);font-size:.84rem} .stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin-bottom:1rem} .stat{background:var(--sand2);border-radius:8px;padding:.8rem;text-align:center} .stat-n{font-size:1.5rem;font-weight:500;color:var(--bark)} .stat-l{font-size:.7rem;color:var(--txt3);margin-top:.15rem}
| About Montanello Nestled in the picturesque hills of Marche, Villa Montanello offers a serene escape surrounded by the enchanting beauty of Italy's countryside. This beautifully restored villa blends timeless charm with modern comforts, providing an ideal retreat for families, couples, or friends . With panoramic views of rolling vineyards, olive groves, and lush greenery, the villa invites you to unwind in its tranquil setting. Guests can enjoy spacious bedrooms, a fully equipped kitchen, and elegant living areas designed for relaxation. Outdoors, a private pool, expansive terraces, and manicured gardens create the perfect space to soak up the Italian sun. Whether you're seeking a peaceful getaway or a base to explore Marche's rich culture and cuisine, Villa Montanello is a destination that will leave you inspired. |