/*
Theme Name: MGM Holiday Home
Theme URI: https://marketinggroupmalaga.com/holiday-home-websites/
Author: Marketing Group Málaga
Author URI: https://marketinggroupmalaga.com
Description: Website for one or more holiday homes in Spain. Works with the plugin MGM Holiday Booking (calendar, prices, booking requests, iCal sync).
Version: 1.1.0
Requires at least: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: mgm-holiday-home
*/

:root{--mgmh-ink:#12343B;--sand:#FFF7EC;--sea-l:#E2F4F3;--muted:#4C6C73;--line:#E6EDEE;--r:22px;--serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,ui-serif,serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--sand);color:var(--mgmh-ink);font:400 17px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--mgmh-accent2)}
h1,h2,h3{font-family:var(--serif);font-weight:700;line-height:1.12;letter-spacing:-.01em;margin:0 0 .5em}
h2{font-size:clamp(30px,4vw,44px)}
h3{font-size:22px}
p{margin:0 0 1em}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.narrow{max-width:780px}
.center{text-align:center}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:16px;z-index:100;background:#fff;padding:10px 14px;border-radius:10px}
.ic{flex:none}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--mgmh-accent);color:#fff;border-radius:999px;padding:15px 26px;font-weight:700;text-decoration:none;font-size:16px;transition:transform .15s,filter .2s;border:0;cursor:pointer}
.btn:hover{filter:brightness(.94);transform:translateY(-1px)}
.btn-sm{padding:10px 18px;font-size:14px}
.btn-line{background:#fff;color:var(--mgmh-ink);box-shadow:inset 0 0 0 2px var(--line)}
.btn-wa{background:#1FAF5A}

/* Header */
.site-head{position:sticky;top:0;z-index:50;background:rgba(255,247,236,.92);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);transition:box-shadow .2s}
.site-head.is-scrolled{box-shadow:0 6px 24px rgba(18,52,59,.08)}
.admin-bar .site-head{top:32px}
.head-in{display:flex;align-items:center;gap:24px;height:72px}
.brand{text-decoration:none;color:var(--mgmh-ink);display:flex;flex-direction:column;line-height:1.1}
.brand-name{font-family:var(--serif);font-weight:700;font-size:23px}
.brand-town{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mgmh-accent)}
.menu{display:flex;gap:22px;margin-left:auto}
.menu a{color:var(--mgmh-ink);text-decoration:none;font-weight:600;font-size:15px}
.menu a:hover{color:var(--mgmh-accent)}
.head-right{display:flex;align-items:center;gap:14px}
.lang{display:flex;gap:4px}
.lang a{font-size:13px;font-weight:700;color:var(--muted);text-decoration:none;padding:5px 8px;border-radius:8px}
.lang a.is-cur{background:var(--mgmh-ink);color:#fff}
.lang-mobile{display:none}
.burger{display:none;background:none;border:0;width:40px;height:40px;padding:8px;cursor:pointer}
.burger span{display:block;height:2px;background:var(--mgmh-ink);margin:5px 0;border-radius:2px}

/* Hero */
.hero{position:relative;min-height:min(82vh,760px);display:flex;align-items:flex-end;color:#fff;overflow:hidden;background:linear-gradient(165deg,#BDE8EF 0%,#E6F6F4 48%,#FFF0D9 100%)}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,30,36,.05) 30%,rgba(10,30,36,.62) 100%)}
.hero-noimg{color:var(--mgmh-ink)}
.hero-noimg .hero-shade{display:none}
.hero-in{position:relative;z-index:2;padding-top:120px;padding-bottom:120px;width:100%}
.hero h1{font-size:clamp(46px,7vw,86px);margin:0 0 10px;text-shadow:0 2px 24px rgba(0,0,0,.18)}
.hero-place{display:flex;align-items:center;gap:6px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:13px;margin-bottom:12px}
.hero-tag{font-size:clamp(19px,2.2vw,24px);max-width:640px;margin-bottom:20px}
.facts{list-style:none;display:flex;flex-wrap:wrap;gap:10px;padding:0;margin:0 0 26px}
.facts li{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.18);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.35);padding:8px 14px;border-radius:999px;font-weight:600;font-size:15px}
.hero-noimg .facts li{background:#fff;border-color:var(--line)}
.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.lic-badge{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;background:rgba(255,255,255,.92);color:var(--mgmh-ink);padding:9px 14px;border-radius:999px}
.wave{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:70px;z-index:3;fill:var(--sand)}

/* Sections */
.sec{padding:88px 0}
.intro{padding:20px 0 10px;text-align:center;font-family:var(--serif);font-size:clamp(21px,2.4vw,27px);line-height:1.5}
.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:13px;font-weight:800;color:var(--mgmh-accent);margin-bottom:10px}
.lead{font-size:19px;color:var(--muted);max-width:720px;margin-bottom:34px}
.center .lead{margin-left:auto;margin-right:auto}
.two{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:54px;align-items:start}
.prose p{color:#24474F}
.card{background:#fff;border-radius:var(--r);padding:30px;box-shadow:0 12px 34px rgba(14,90,102,.08)}
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.ticks li{display:flex;gap:10px;align-items:flex-start}
.ticks .ic{color:var(--mgmh-accent2);margin-top:3px}
.ticks.small{font-size:16px}

/* Photos */
.photos{padding-top:46px;padding-bottom:20px}
.pgrid{position:relative;display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:240px 240px;gap:10px;border-radius:var(--r);overflow:hidden}
.pcell{padding:0;border:0;cursor:zoom-in;background:#ddd;overflow:hidden}
.pcell img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.pcell:hover img{transform:scale(1.04)}
.pcell-0{grid-row:1 / span 2}
.pall{position:absolute;right:16px;bottom:16px;display:inline-flex;gap:8px;align-items:center;background:#fff;border:0;border-radius:999px;padding:10px 16px;font-weight:700;cursor:pointer;color:var(--mgmh-ink);box-shadow:0 6px 18px rgba(0,0,0,.18)}

/* Availability, prices */
.avail{background:var(--sea-l)}
.prices .mgmh-prices{max-width:900px}
.area .map{padding:0;overflow:hidden;min-height:380px}
.map iframe{width:100%;height:420px;border:0;display:block}
.area h3{margin-top:30px}
.contact{background:linear-gradient(135deg,#0E8A94 0%,#0B5866 100%);color:#fff}
.contact .eyebrow{color:#FFD66E}
.contact .lead{color:#D7EEF0}
.cbtns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.page{min-height:60vh}

/* Footer */
.site-foot{background:#0F2B31;color:#BFD3D6;padding:44px 0;font-size:14px}
.foot-in{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.foot-name{font-family:var(--serif);font-size:22px;color:#fff;font-weight:700}
.foot-lic{display:flex;align-items:center;gap:6px;margin-top:8px}
.foot-right{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.site-foot a{color:#fff}
.lang-foot a{color:#BFD3D6}
.lang-foot a.is-cur{background:#fff;color:#0F2B31}
.by{opacity:.8}

/* Lightbox */
.lb{position:fixed;inset:0;z-index:200;background:rgba(8,20,24,.94);display:flex;align-items:center;justify-content:center}
.lb[hidden]{display:none}
.lb img{max-width:92vw;max-height:86vh;object-fit:contain;border-radius:8px}
.lb-x{position:absolute;top:14px;right:18px;background:none;border:0;color:#fff;font-size:42px;cursor:pointer;line-height:1}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.14);border:0;color:#fff;width:52px;height:52px;border-radius:50%;font-size:32px;cursor:pointer}
.lb-prev{left:18px}.lb-next{right:18px}
.lb-count{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:#fff;font-size:14px}

@media (max-width:1080px){.menu{gap:14px}.menu a{font-size:14px}}
@media (max-width:960px){
	.menu{display:none;position:absolute;top:72px;left:0;right:0;flex-direction:column;gap:0;background:#fff;padding:8px 24px 18px;box-shadow:0 14px 30px rgba(0,0,0,.1)}
	.menu.is-open{display:flex}
	.menu a{padding:12px 0;border-bottom:1px solid var(--line);font-size:17px}
	.lang-mobile{display:flex;padding-top:12px}
	.lang-desk{display:none}
	.burger{display:block}
	.two{grid-template-columns:1fr;gap:30px}
	.head-right{margin-left:auto}
}
@media (max-width:760px){
	body{font-size:16px}
	.sec{padding:64px 0}
	.wrap{padding:0 16px}
	.head-in{height:64px;gap:12px}
	.menu{top:64px}
	.brand-name{font-size:20px}
	.head-right .btn-sm{display:none}
	.hero{min-height:78vh}
	.hero-in{padding-top:90px;padding-bottom:96px}
	.pgrid{grid-template-columns:1fr 1fr;grid-template-rows:230px 120px 120px}
	.pcell-0{grid-column:1 / span 2;grid-row:auto}
	.pcell-3,.pcell-4{display:none}
	.pgrid{grid-template-rows:240px 150px}
	.card{padding:22px}
	.map iframe{height:320px}
	.foot-right{align-items:flex-start}
	.admin-bar .site-head{top:0}
}

/* Overview: several homes */
.ov-hero{position:relative;min-height:56vh;display:flex;align-items:flex-end;color:#fff;background:var(--mgmh-accent2);overflow:hidden}
.ov-hero .hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ov-hero .wrap{position:relative;z-index:2;padding-top:120px;padding-bottom:70px}
.ov-hero h1{font-size:clamp(38px,6vw,68px);color:#fff;margin:0 0 .25em}
.ov-hero p{font-size:20px;max-width:640px}
.homes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:26px}
.hcard{background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:0 14px 40px rgba(18,52,59,.08);display:flex;flex-direction:column;text-decoration:none;color:inherit;transition:transform .2s,box-shadow .2s}
.hcard:hover{transform:translateY(-4px);box-shadow:0 20px 48px rgba(18,52,59,.14)}
.hcard-img{aspect-ratio:4/3;background:var(--sea-l);overflow:hidden}
.hcard-img img{width:100%;height:100%;object-fit:cover}
.hcard-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
.hcard h3{margin:0}
.hcard .hcard-place{color:var(--muted);font-size:15px;display:flex;gap:6px;align-items:center}
.hcard .facts{margin:4px 0 0;gap:6px 14px;font-size:14px;color:var(--muted)}
.hcard .facts li{background:none;padding:0;color:var(--muted)}
.hcard-foot{margin-top:auto;padding-top:12px;display:flex;justify-content:space-between;align-items:center;gap:10px;border-top:1px solid var(--line)}
.hcard-price{font-weight:700}
.hcard .btn{padding:10px 18px;font-size:15px}
