@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&display=swap');
:root{--navy:#0F172A;--gold:#D4AF37;--cream:#F7F5F0;--ink:#172033;--muted:#667085;--line:#e8e5de;--white:#fff}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;font-family:'DM Sans',sans-serif;color:var(--ink);background:#fff}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.topbar{height:34px;background:var(--navy);color:#e9e9ed;display:flex;align-items:center;justify-content:space-between;padding:0 6.5%;font-size:11px;letter-spacing:.04em}.topbar a{color:#e6c96e}.header{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 6.5%;background:#fff;position:sticky;top:0;z-index:20;border-bottom:1px solid #f0eee8}.brand{display:flex;align-items:center;gap:10px;min-width:185px}.logo{width:52px;height:52px;object-fit:contain}.brand-fallback{display:none;font-family:'Playfair Display',serif;font-size:24px;color:var(--navy)}.brand-fallback span,.footer-wordmark span{color:var(--gold)}.nav{display:flex;align-items:center;gap:30px}.nav a{font-size:13px;font-weight:600;color:#4b5565;transition:.2s}.nav a:hover{color:#b18a15}.header-actions{display:flex;align-items:center;gap:15px}.language-label{display:flex;gap:5px;align-items:center;color:var(--navy)}select{font:inherit}.language-label select{border:0;background:transparent;color:var(--navy);font-size:12px;font-weight:700;outline:none;cursor:pointer}.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:15px 21px;background:var(--gold);color:var(--navy);border:1px solid var(--gold);font-size:12px;font-weight:700;letter-spacing:.015em;transition:transform .2s,background .2s;cursor:pointer}.button:hover{transform:translateY(-2px);background:#e4c65e}.button-small{padding:12px 17px}.button-ghost{background:transparent;color:#fff;border-color:#ffffff8a}.button-ghost:hover{color:var(--navy)}.menu-toggle{display:none;border:0;background:transparent;font-size:24px;color:var(--navy)}
.hero{min-height:625px;position:relative;display:flex;align-items:center;padding:75px 9%;color:#fff;background:#25364a url('assets/agadir-sunrise-clean-background.jpg') center 53%/cover no-repeat;overflow:hidden}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,17,34,.88) 0%,rgba(8,17,34,.66) 43%,rgba(8,17,34,.1) 100%),linear-gradient(0deg,rgba(8,17,34,.25),transparent 50%)}.hero-content{position:relative;max-width:620px;z-index:1}.eyebrow{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.22em;font-weight:700;color:#e6c75c;margin:0 0 22px}.eyebrow>span:first-child{display:inline-block;width:25px;height:1px;background:var(--gold)}h1,h2{font-family:'Playfair Display',serif;font-weight:500;letter-spacing:-.035em}h1{font-size:clamp(48px,6.3vw,78px);line-height:1.05;margin:0 0 22px}h1 em,h2 em{color:var(--gold);font-weight:500}.hero-copy{max-width:490px;color:#e1e5eb;line-height:1.8;font-size:15px;margin-bottom:30px}.hero-buttons{display:flex;gap:12px;flex-wrap:wrap}.hero-note{display:flex;align-items:center;gap:10px;margin-top:42px;color:#e0e4eb;font-size:11px;letter-spacing:.02em}.avatars{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--gold);color:var(--gold)}.hero-stamp{position:absolute;right:7%;bottom:45px;border:1px solid #ffffff70;padding:16px 20px;display:flex;flex-direction:column;gap:5px;text-align:center;color:#fff;background:#0f172a35;backdrop-filter:blur(5px);font-size:9px;letter-spacing:.2em}.hero-stamp b{font-family:'Playfair Display',serif;font-size:23px;letter-spacing:.04em;font-weight:500;color:#e6c75c}.trust-strip{display:grid;grid-template-columns:repeat(4,1fr);padding:23px 8%;background:var(--cream);border-bottom:1px solid #ece8df}.trust-strip div{display:flex;align-items:center;justify-content:center;gap:12px;font-size:12px;font-weight:600;color:#3d4655}.trust-strip strong{color:#b28e1d;font-size:20px;font-weight:400}
.section{padding:100px 7%}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:32px}.eyebrow.dark{color:#a17b10}.section-heading h2,.center-heading h2,.story h2,.booking-intro h2{font-size:clamp(36px,4vw,53px);line-height:1.12;margin:0}.section-heading>p{max-width:360px;line-height:1.8;font-size:13px;color:var(--muted);margin:0 0 5px}.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}.filter{border:1px solid var(--line);background:#fff;padding:10px 15px;font-size:11px;font-weight:600;color:#687080;cursor:pointer}.filter.active,.filter:hover{background:var(--navy);border-color:var(--navy);color:#fff}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.tour-card{border:1px solid #eeece6;background:#fff;transition:transform .25s,box-shadow .25s;min-width:0}.tour-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px #15213b12}.tour-card.hidden{display:none}.tour-image{height:225px;position:relative;overflow:hidden;background:#e9e4d8}.tour-image img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.tour-card:hover .tour-image img{transform:scale(1.05)}.tag{position:absolute;top:15px;left:15px;background:#fff;padding:7px 10px;font-size:10px;font-weight:700;color:var(--navy)}.heart{position:absolute;right:14px;top:13px;width:31px;height:31px;border:0;border-radius:50%;background:#ffffffeb;color:var(--navy);font-size:19px;cursor:pointer}.heart.saved{color:#c74d4d}.tour-info{padding:18px 19px 17px}.tour-meta{display:flex;justify-content:space-between;color:#737b87;font-size:10px}.tour-meta span:last-child{color:#b48e20}.tour-info h3{font-family:'Playfair Display',serif;font-weight:600;font-size:22px;margin:13px 0 8px;color:var(--navy)}.tour-info>p{font-size:12px;line-height:1.7;color:var(--muted);min-height:42px;margin:0 0 18px}.tour-bottom{border-top:1px solid #eeeae2;padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:10px}.price{color:var(--navy);font-size:12px}.price small{display:block;color:#858b95;font-size:10px;margin-bottom:2px}.price b{font-size:23px;font-family:'Playfair Display',serif;font-weight:600}.text-link{font-size:10px;font-weight:700;color:#9a7510}.text-link:hover{text-decoration:underline}.price-note{font-size:10px;color:#8b9099;margin:20px 0 0}
.story{display:grid;grid-template-columns:1fr 1fr;background:var(--navy);color:#fff}.story-photo{position:relative;min-height:530px}.story-photo img{position:absolute;width:100%;height:100%;object-fit:cover;inset:0}.story-photo:after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#0b1223b8)}.photo-caption{position:absolute;bottom:30px;left:8%;z-index:1;display:flex;flex-direction:column;gap:6px}.photo-caption span{font-size:9px;letter-spacing:.2em;color:#e6c75c}.photo-caption b{font-family:'Playfair Display',serif;font-size:25px;font-weight:500}.story-content{padding:85px 10%;align-self:center}.story-content h2{margin:0 0 23px}.story-content>p:not(.eyebrow){font-size:13px;line-height:1.9;color:#cbd0da;margin-bottom:28px}.story-signature{margin-top:35px;font-family:'Playfair Display',serif;font-size:22px;color:#e4c45b}.story-signature span{display:block;margin-top:5px;font-family:'DM Sans',sans-serif;font-size:10px;color:#aab1bf;letter-spacing:.04em}
.why{background:#fbfaf7}.center-heading{text-align:center;max-width:650px;margin:0 auto 50px}.center-heading .eyebrow{justify-content:center}.center-heading>p:last-child{color:var(--muted);font-size:13px;line-height:1.7}.center-heading h2{margin-bottom:14px}.benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.benefit{text-align:center;padding:8px 14px}.benefit-icon{width:52px;height:52px;display:grid;place-items:center;margin:0 auto 18px;border:1px solid #e6d8a6;border-radius:50%;color:#a17b10;font-size:23px}.benefit h3{font-family:'Playfair Display',serif;font-size:19px;font-weight:600;color:var(--navy);margin:0 0 9px}.benefit p{font-size:12px;color:var(--muted);line-height:1.8;margin:0}
.booking-section{padding:95px 8%;background:#f1eee6;display:grid;grid-template-columns:.8fr 1.2fr;gap:8%;align-items:start}.booking-intro{padding-top:20px}.booking-intro h2{margin-bottom:22px}.booking-intro>p:not(.eyebrow){font-size:13px;line-height:1.9;color:#657080;max-width:380px}.contact-line{display:flex;gap:12px;align-items:center;margin-top:18px;font-size:12px;color:#5d6675}.contact-line:first-of-type{margin-top:30px}.contact-line:first-letter{color:#a17b10}.booking-form{background:#fff;padding:30px;box-shadow:0 16px 45px #14203a0b}.form-heading{margin-bottom:25px}.form-heading h3{font-family:'Playfair Display',serif;font-size:25px;color:var(--navy);font-weight:600;margin:0 0 6px}.form-heading>span{font-size:10px;color:#8a909a}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px 14px}.form-grid label{display:flex;flex-direction:column;gap:8px;font-size:11px;font-weight:700;color:#343e50}.form-grid input,.form-grid select,.form-grid textarea{width:100%;border:1px solid #e4e2dc;background:#fff;padding:12px 11px;font:400 12px 'DM Sans',sans-serif;color:#263044;border-radius:0;outline:none}.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{border-color:#c3a13d}.form-grid input::placeholder,.form-grid textarea::placeholder{color:#a0a4ac}.form-grid .full{grid-column:1/-1}.form-grid textarea{resize:vertical}.submit-button{width:100%;margin-top:20px}.form-note{font-size:10px;line-height:1.6;color:#858b95;margin:12px 0 0}
.footer{background:#0a1120;color:#fff;padding:55px 7% 0}.footer-main{display:grid;grid-template-columns:1.5fr 1fr 1.3fr 1fr;gap:40px;padding-bottom:45px}.footer-wordmark{font-family:'Playfair Display',serif;font-size:30px}.footer-brand p{font-size:11px;line-height:1.8;color:#aeb5c2;max-width:240px}.footer-main h4{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:#e2c35d;margin:5px 0 20px}.footer-main>div:not(.footer-brand):not(.footer-cta){display:flex;flex-direction:column;align-items:flex-start}.footer-main a:not(.button),.footer-main span{font-size:11px;color:#b6bdc9;margin-bottom:13px}.footer-main a:hover{color:#e2c35d}.footer-cta p{font-family:'Playfair Display',serif;font-size:22px;margin:0 0 18px}.button-outline{border-color:#8d762d;background:transparent;color:#e3c35c}.button-outline:hover{color:var(--navy)}.footer-bottom{min-height:57px;border-top:1px solid #ffffff20;display:flex;align-items:center;justify-content:space-between;gap:15px;color:#9ca5b5;font-size:10px}.footer-bottom>span:last-child{letter-spacing:.18em;color:#d8bd5e}
[dir="rtl"] body{text-align:right}[dir="rtl"] .eyebrow,[dir="rtl"] .hero-note{flex-direction:row-reverse}[dir="rtl"] .section-heading,[dir="rtl"] .tour-meta,[dir="rtl"] .tour-bottom{direction:rtl}[dir="rtl"] .tag{left:auto;right:15px}[dir="rtl"] .heart{right:auto;left:14px}
@media(max-width:1000px){.header{padding:0 4%}.nav{gap:16px}.nav a{font-size:12px}.brand{min-width:140px}.logo{width:44px;height:44px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.booking-section{gap:4%;padding:75px 5%}.footer-main{gap:25px}.hero{padding-left:7%}}
@media(max-width:760px){.topbar{padding:0 5%;font-size:9px}.header{height:70px;padding:0 5%;gap:10px}.brand{min-width:0}.logo{width:43px;height:43px}.brand-fallback{font-size:20px}.menu-toggle{display:block;margin-left:auto}.nav{display:none;position:absolute;left:0;right:0;top:70px;background:#fff;padding:20px 6%;border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start;gap:20px}.nav.open{display:flex}.header-actions{gap:8px}.header-actions .button{display:none}.language-label{font-size:12px}.hero{min-height:600px;padding:75px 7%;background-position:58% center}.hero-shade{background:linear-gradient(90deg,#081122e8,#0811229e 65%,#08112250)}.hero-stamp{right:6%;bottom:20px;padding:10px 13px}.hero-stamp b{font-size:17px}.trust-strip{grid-template-columns:1fr 1fr;gap:18px;padding:22px 6%}.trust-strip div{justify-content:flex-start;font-size:10px}.section{padding:70px 5%}.section-heading{display:block}.section-heading>p{margin-top:17px}.cards{grid-template-columns:1fr;gap:18px}.tour-image{height:240px}.tour-info>p{min-height:0}.story{grid-template-columns:1fr}.story-photo{min-height:350px}.story-content{padding:60px 7%}.benefits{grid-template-columns:1fr 1fr;gap:30px 12px}.booking-section{grid-template-columns:1fr;padding:65px 5%;gap:28px}.booking-form{padding:22px 18px}.footer{padding:45px 6% 0}.footer-main{grid-template-columns:1fr 1fr;gap:28px 20px}.footer-brand{grid-column:1/-1}.footer-bottom{padding:17px 0;align-items:flex-start;flex-direction:column}.form-grid{gap:14px 10px}}
@media(max-width:420px){.topbar a{font-size:9px}.hero h1{font-size:47px}.hero-copy{font-size:13px}.hero-buttons .button{padding:13px 15px}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.footer-main{grid-template-columns:1fr}.footer-brand{grid-column:auto}.section-heading h2,.center-heading h2{font-size:36px}}

/* AgadirQuest usability additions */
.contact-line a{color:var(--navy);font-weight:700;text-decoration:underline;text-decoration-color:#d4af37;text-underline-offset:3px}
.floating-whatsapp{position:fixed;right:22px;bottom:22px;z-index:50;display:flex;align-items:center;gap:9px;padding:13px 17px;background:#0f172a;color:#fff;border:1px solid #d4af37;box-shadow:0 8px 28px #0f172a30;font-size:12px;font-weight:700;transition:transform .2s,background .2s}
.floating-whatsapp span:first-child{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#d4af37;color:#0f172a;font-size:14px}
.floating-whatsapp:hover{transform:translateY(-3px);background:#1c2a47}
@media(max-width:600px){.floating-whatsapp{right:14px;bottom:14px;padding:11px 13px}.floating-whatsapp span:last-child{display:none}.floating-whatsapp span:first-child{width:27px;height:27px}}


/* Accessibility fix: keep text readable during hover, focus and selection */
button,
.button,
.filter,
.menu-toggle,
.heart,
select,
input,
textarea {
  -webkit-text-fill-color: currentColor;
}

.button,
.button:visited,
.button:hover,
.button:focus,
.button:focus-visible,
.button:active,
.button-small,
.button-ghost,
.button-ghost:hover,
.button-ghost:focus,
.button-ghost:active,
.submit-button,
.floating-whatsapp,
.floating-whatsapp:hover,
.floating-whatsapp:focus,
.floating-whatsapp:active {
  color: var(--navy);
}

.button-ghost,
.button-ghost:visited {
  color: #fff;
}

.filter,
.filter:visited,
.filter:hover,
.filter:focus,
.filter:focus-visible,
.filter:active {
  color: #263044;
}

.filter.active,
.filter.active:hover,
.filter.active:focus,
.filter.active:active {
  color: #fff;
}

input,
textarea,
select,
input:focus,
textarea:focus,
select:focus,
input:active,
textarea:active,
select:active {
  color: #263044;
  background-color: #fff;
  -webkit-text-fill-color: #263044;
}

select option {
  color: #263044;
  background-color: #fff;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
}


/* Magazine preview section */
.magazine-section{background:#fffdf8}
.magazine-categories{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 30px}
.magazine-categories a{display:inline-flex;align-items:center;padding:10px 15px;border:1px solid #e7dfcf;border-radius:999px;background:#fff;color:#263044;text-decoration:none;font-size:13px;font-weight:700;transition:background .2s,border-color .2s}
.magazine-categories a:hover,.magazine-categories a:focus-visible{background:#f7f0df;border-color:#d4af37;color:#263044}
.magazine-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.magazine-card{overflow:hidden;background:#fff;border:1px solid #eee7dc;border-radius:12px;box-shadow:0 8px 26px #1720330a;scroll-margin-top:100px}
.magazine-card>img{display:block;width:100%;height:180px;object-fit:cover}
.magazine-card-body{padding:19px}
.magazine-category{display:inline-block;color:#8a6815;font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.magazine-card h3{margin:10px 0;color:#172033;font-size:18px;line-height:1.35}
.magazine-card p{margin:0 0 16px;color:#5d6470;font-size:13px;line-height:1.65}
.magazine-note{display:block;padding-top:12px;border-top:1px solid #eee7dc;color:#727784;font-size:11px}
.magazine-disclaimer{margin:20px 0 0;color:#6c7280;font-size:12px;line-height:1.6}
@media(max-width:1000px){.magazine-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.magazine-grid{grid-template-columns:1fr}.magazine-card>img{height:210px}.magazine-categories a{font-size:12px}}


/* Magazine article link polish */
.magazine-card > a { display:block; }
.magazine-card > a img { display:block; width:100%; }
.magazine-title-link { color:inherit; text-decoration:none; }
.magazine-title-link:hover, .magazine-title-link:focus-visible { color:#9a7420; text-decoration:underline; }
.article-page { background:#fbfaf7; color:#263238; min-height:100vh; }
.article-topbar { padding:18px max(5vw, 20px); background:#fff; border-bottom:1px solid #e8e2d5; }
.article-topbar a { color:#25364a; text-decoration:none; font-weight:700; }
.article-wrap { max-width:900px; margin:0 auto; padding:36px 22px 70px; }
.article-kicker { text-transform:uppercase; letter-spacing:.12em; font-size:.78rem; font-weight:700; color:#98731c; }
.article-wrap h1 { font-size:clamp(2.1rem,5vw,4rem); line-height:1.08; color:#15263a; margin:.5rem 0 1rem; }
.article-lead { font-size:1.18rem; line-height:1.75; color:#53616c; }
.article-hero { width:100%; max-height:460px; object-fit:cover; border-radius:18px; margin:22px 0; }
.article-wrap h2 { margin:2rem 0 .6rem; color:#15263a; font-size:1.55rem; }
.article-wrap p, .article-wrap li { line-height:1.8; }
.article-wrap a { color:#765812; }
.article-tip { padding:18px 20px; background:#f3efe4; border-left:4px solid #d4af37; border-radius:8px; margin:24px 0; }
.article-cta { display:inline-block; margin:12px 0 22px; padding:13px 20px; background:#d4af37; color:#17283a !important; border-radius:999px; text-decoration:none; font-weight:700; }
.article-sources { font-size:.95rem; border-top:1px solid #e5dfd2; margin-top:32px; padding-top:18px; }
@media(max-width:600px){.article-wrap{padding:26px 17px 50px}.article-lead{font-size:1.05rem}}

/* Request-to-book consent: accessible, high-contrast styling */
.privacy-consent{display:flex;align-items:flex-start;gap:10px;margin:14px 0 8px;color:#263247;font-size:12px;line-height:1.6;cursor:pointer}
.privacy-consent input{flex:0 0 auto;width:17px;height:17px;margin:2px 0 0;accent-color:#9b7710;cursor:pointer}
.privacy-consent span{color:#263247}
.privacy-consent input:focus-visible{outline:3px solid #b18a15;outline-offset:3px}
.form-note{color:#475467}


/* Targeted fixes: footer CTA contrast, WhatsApp button, and clearer logo */
.footer-cta .button-outline,
.footer-cta .button-outline:visited {
  color: #f5d76e !important;
  -webkit-text-fill-color: #f5d76e;
  background: transparent;
  border-color: #d4af37;
}
.footer-cta .button-outline:hover,
.footer-cta .button-outline:focus-visible,
.footer-cta .button-outline:active {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a;
  background: #e4c65e;
  border-color: #e4c65e;
}
.logo {
  width: 76px;
  height: 58px;
  object-fit: contain;
  object-position: center;
  flex: 0 0 auto;
}
.brand { gap: 12px; }
.floating-whatsapp,
.floating-whatsapp:visited,
.floating-whatsapp:hover,
.floating-whatsapp:focus,
.floating-whatsapp:active {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff;
}
@media (max-width: 1000px) {
  .logo { width: 68px; height: 54px; }
}
@media (max-width: 760px) {
  .logo { width: 64px; height: 50px; }
}
@media (max-width: 420px) {
  .logo { width: 58px; height: 46px; }
}


/* Hybrid editorial + booking refresh (preview) */
:root{--navy:#183044;--gold:#d59b48;--cream:#f7f4ed;--ink:#243442;--muted:#667580;--line:#e5e0d6}
body{background:#fffdf9;color:var(--ink)}
.topbar{background:#17394a}
.header{box-shadow:0 6px 24px rgba(22,48,64,.045)}
.logo{width:70px;height:62px;object-fit:contain}
.hero{min-height:660px;background-position:center 48%;border-radius:0 0 28px 28px}
.hero-shade{background:linear-gradient(90deg,rgba(10,35,48,.82) 0%,rgba(10,35,48,.52) 46%,rgba(10,35,48,.06) 100%),linear-gradient(0deg,rgba(10,35,48,.20),transparent 55%)}
.button{border-radius:8px;background:var(--gold);border-color:var(--gold);color:#183044}
.button:hover{background:#e5b568;color:#183044}
.button-ghost,.button-ghost:visited{color:#fff;border-color:#ffffffb5;background:rgba(255,255,255,.08)}
.button-ghost:hover,.button-ghost:focus{background:#fff;color:#183044}
.trust-strip{background:#f8f4eb;border-bottom:1px solid #eee5d5}
.section{padding-top:88px;padding-bottom:88px}
.filter{border-radius:999px;padding:11px 17px}
.filter.active,.filter:hover{background:#17394a;border-color:#17394a;color:#fff}
.tour-card,.magazine-card{border-radius:14px;overflow:hidden;box-shadow:0 8px 28px rgba(23,57,74,.045)}
.tour-card:hover,.magazine-card:hover{box-shadow:0 18px 44px rgba(23,57,74,.12)}
.tour-image{height:245px}
.tour-info h3,.magazine-card h3{color:#17394a}
.text-link,.magazine-title-link{color:#94611f}
.story{background:#17394a}
.why{background:#fbf8f1}
.booking-section{background:#f4efe5}
.booking-form{border-radius:16px;box-shadow:0 18px 48px rgba(23,57,74,.09)}
.form-grid input,.form-grid select,.form-grid textarea{border-radius:8px;min-height:46px}
.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{outline:3px solid rgba(213,155,72,.18);border-color:#bd8435}
.submit-button{border-radius:8px}
.footer{background:#122d3b}
.floating-whatsapp{border-radius:999px;background:#1e6d59;border-color:#1e6d59;color:#fff!important}
.floating-whatsapp span:first-child{background:#fff;color:#1e6d59}
.article-page{background:#fffdf9}
.article-topbar{background:#17394a}
.article-wrap{max-width:860px;padding:44px 28px 90px}
.article-wrap h1{color:#17394a;font-size:clamp(38px,5vw,60px);line-height:1.08}
.article-wrap h2{color:#17394a;font-size:clamp(25px,3vw,34px);margin-top:38px}
.article-hero{border-radius:18px;max-height:460px;object-fit:cover}
.article-cta{display:inline-flex;padding:14px 20px;border-radius:8px;background:var(--gold);color:#183044;font-weight:700}
.article-tip{background:#f8f2e5;border-left:4px solid var(--gold);border-radius:0 10px 10px 0;padding:18px 20px;line-height:1.8}
.article-sources{display:none}
@media(max-width:760px){.logo{width:62px;height:56px}.hero{min-height:590px;border-radius:0 0 18px 18px}.hero-shade{background:linear-gradient(90deg,rgba(10,35,48,.84),rgba(10,35,48,.55) 70%,rgba(10,35,48,.25))}.section{padding-top:65px;padding-bottom:65px}.tour-image{height:230px}.article-wrap{padding:32px 20px 70px}}


/* Mobile Magazine visibility and navigation fix */
@media (max-width: 760px) {
  .header { position: sticky; top: 0; z-index: 1000; }
  .menu-toggle { position: relative; z-index: 1002; min-width: 44px; min-height: 44px; }
  .nav {
    z-index: 1001;
    max-height: calc(100dvh - 70px);
    overflow-y: auto;
    box-shadow: 0 14px 24px rgba(20,40,55,.12);
  }
  .nav.open { display: flex !important; }
  .nav a { display: block; width: 100%; padding: 8px 0; font-size: 15px; color: #17394a; }
  #magazine { scroll-margin-top: 82px; }
  .magazine-section { display: block !important; visibility: visible !important; padding-left: 5%; padding-right: 5%; }
  .magazine-grid { display: grid !important; grid-template-columns: minmax(0,1fr) !important; gap: 16px; }
  .magazine-card { display: block !important; width: 100%; min-width: 0; }
  .magazine-card img { width: 100%; height: 210px; object-fit: cover; }
  .magazine-card-body { padding: 17px; }
  .magazine-card h3 { font-size: 20px; }
  .magazine-categories { overflow: visible; }
  .magazine-categories a { min-height: 40px; }
}

/* Destination activity sections */
.destination-experiences{background:#fbfaf7}.timlaline-section{background:#f3f6f4}.destination-cards .tour-card{height:100%}.destination-cards .price{font-size:12px}.featured-pack{border:1px solid #d8c48a}



/* AgadirQuest official palette preview: #08172E, #15253F, #2B3D5B, #CC7D51, #B09060 */
:root {
  --aq-navy-deep: #08172E;
  --aq-navy: #15253F;
  --aq-slate: #2B3D5B;
  --aq-terracotta: #CC7D51;
  --aq-sand-gold: #B09060;
}

/* Keep the site light and readable, using navy for structure and terracotta for actions. */
body { color: var(--aq-navy-deep); }
header, .site-header, .navbar, nav[aria-label="Main navigation"] {
  border-color: rgba(176, 144, 96, .28);
}
footer, .site-footer, .footer, .newsletter-section {
  background-color: var(--aq-navy-deep);
  color: #fff;
}
footer a, .site-footer a, .footer a { color: #f7eee4; }
button, .button, .btn, .cta-button, .primary-button, a.button, a.btn {
  background-color: var(--aq-terracotta);
  border-color: var(--aq-terracotta);
  color: #fff;
}
button:hover, .button:hover, .btn:hover, .cta-button:hover, .primary-button:hover, a.button:hover, a.btn:hover {
  background-color: var(--aq-navy);
  border-color: var(--aq-navy);
  color: #fff;
}
.tag, .badge, .eyebrow span:last-child, .section-kicker {
  color: var(--aq-terracotta);
}
.tour-card, .magazine-card, .article-card {
  border-color: rgba(43, 61, 91, .14);
}
.tour-card .tag, .magazine-card .tag, .article-card .tag {
  background: #f4e9df;
  color: var(--aq-navy);
}
.text-link, .tour-bottom a, .magazine-title-link {
  color: var(--aq-navy);
}
.text-link:hover, .tour-bottom a:hover, .magazine-title-link:hover {
  color: var(--aq-terracotta);
}
.destination-experiences { color: var(--aq-navy-deep); }
.destination-experiences .section-heading h2 em { color: var(--aq-terracotta); }
.destination-experiences .tour-card { background: #fff; }
.destination-experiences .price { color: var(--aq-navy); }
.destination-experiences .price small { color: var(--aq-slate); }
.featured-pack { border-color: var(--aq-sand-gold); }

/* Magazine: one card per category */
.magazine-grid-four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.magazine-grid-four .magazine-card { min-width: 0; }
@media (max-width: 680px) {
  .magazine-grid-four { grid-template-columns: minmax(0, 1fr); }
}

.guide-highlight{background:#f7f5f0;border-left:4px solid #CC7D51;padding:16px 18px;border-radius:8px;margin:18px 0}

/* Clear, high-contrast WhatsApp CTA in the hero */
.button-whatsapp-hero {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 48px;
  padding: 13px 20px !important;
  background: #167A52 !important;
  color: #fff !important;
  border: 2px solid #167A52 !important;
  border-radius: 9px;
  text-decoration: none !important;
  font-weight: 800;
  box-shadow: 0 5px 16px rgba(8, 23, 46, .18);
  opacity: 1 !important;
  visibility: visible !important;
}
.button-whatsapp-hero:hover, .button-whatsapp-hero:focus-visible {
  background: #116541 !important;
  border-color: #116541 !important;
  color: #fff !important;
}
.wa-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 23px;
  height: 23px;
  border: 2px solid currentColor;
  border-radius: 50%;
  font-size: 13px;
  line-height: 1;
  font-weight: 900;
  flex: 0 0 auto;
}


.button-whatsapp-hero { display:inline-flex !important; align-items:center; justify-content:center; gap:9px; min-height:48px; padding:13px 20px !important; background:#167A52 !important; color:#fff !important; border:2px solid #167A52 !important; border-radius:9px; text-decoration:none !important; font-weight:800; box-shadow:0 5px 16px rgba(8,23,46,.18); opacity:1 !important; visibility:visible !important; }
.button-whatsapp-hero:hover,.button-whatsapp-hero:focus-visible { background:#116541 !important; border-color:#116541 !important; color:#fff !important; }
.button-ghost { opacity:1; visibility:visible; }
.wa-icon { display:inline-flex; align-items:center; justify-content:center; width:23px; height:23px; border:2px solid currentColor; border-radius:50%; font-size:13px; line-height:1; font-weight:900; flex:0 0 auto; }
@media (max-width:600px) { .button-whatsapp-hero { margin-top:10px; } }


/* AgadirQuest premium redesign preview — inspired by the supplied visual reference */
:root{--navy:#10243a;--gold:#d9a45e;--cream:#f6f2eb;--ink:#172a3a;--muted:#65717c;--line:#e5ded3;--white:#fff}
body{background:#f7f4ee;color:var(--ink)}
.topbar{background:#10243a;color:#f4eee5;padding-inline:5%;height:32px}
.topbar a{color:#f0bd79}
.header{position:absolute;top:32px;left:0;right:0;height:88px;padding:0 5%;background:linear-gradient(180deg,rgba(10,25,40,.48),transparent);border:0;color:white}
.header .nav a,.language-label,.language-label select{color:#fff}
.header .nav a:hover{color:#ffd39b}
.logo{width:62px;height:62px;filter:drop-shadow(0 2px 8px #0004)}
.brand-fallback{color:#fff}
.button{background:#e4ad63;border-color:#e4ad63;color:#172a3a;border-radius:999px;padding:15px 23px}
.button:hover{background:#f1c17e}
.button-ghost{border-radius:999px;background:rgba(255,255,255,.09);border-color:#ffffff88;color:white;backdrop-filter:blur(10px)}
.button-small{padding:12px 22px}
.hero{min-height:660px;padding:132px 5% 155px;background-image:url('https://images.unsplash.com/photo-1518548419970-58e3b4079ab2?auto=format&fit=crop&w=2200&q=90');background-position:center 48%;border-radius:0 0 28px 28px}
.hero-shade{background:linear-gradient(90deg,rgba(8,22,35,.78),rgba(8,22,35,.32) 55%,rgba(8,22,35,.06)),linear-gradient(0deg,rgba(8,22,35,.66),transparent 55%)}
.hero-content{max-width:660px}
.eyebrow{color:#f3c88f}
h1{font-size:clamp(48px,5.4vw,82px);line-height:1.0;letter-spacing:-.045em}
h1 em,h2 em{color:#f0bd79}
.hero-copy{font-size:16px;line-height:1.85;color:#f3eee8;max-width:520px}
.hero-note{margin-top:28px}
.hero-stamp{border:1px solid #ffffff75;border-radius:100px;padding:13px 18px;background:#ffffff12;backdrop-filter:blur(10px);right:5%;bottom:155px}
.trust-strip{margin:-1px auto 0;background:#fff;max-width:1180px;padding:24px 34px;border:1px solid #eee7dc;border-radius:20px;box-shadow:0 16px 45px #2434470d;position:relative;z-index:2}
.section{padding:90px 5%}
.section-heading h2,.center-heading h2{font-size:clamp(36px,4.4vw,58px);line-height:1.1}
.experiences,.why,.magazine-section{background:#f7f4ee}
.experiences .card,.experience-card,.tour-card,.magazine-card,.destination-card{border-radius:20px;overflow:hidden;border:1px solid #e8e0d4;box-shadow:0 12px 32px #2032480b;transition:transform .25s,box-shadow .25s}
.experiences .card:hover,.experience-card:hover,.tour-card:hover,.magazine-card:hover,.destination-card:hover{transform:translateY(-5px);box-shadow:0 18px 38px #20324818}
.story{margin:0 5% 45px;border-radius:28px;overflow:hidden;background:#10243a;color:#fff}
.story-photo img{height:100%;object-fit:cover}
.story .eyebrow{color:#f0bd79}
.story h2,.booking-intro h2{font-size:clamp(38px,4.5vw,58px)}
.why .center-heading{text-align:center}
.destination-experiences{background:#fff}
.timlaline-section{background:#f7f4ee}
.magazine-section .magazine-card img{aspect-ratio:4/3;object-fit:cover}
.booking-section{margin:30px 5% 60px;border-radius:28px;overflow:hidden;background:linear-gradient(125deg,#10243a,#1b3c53);color:#fff}
.booking-section .eyebrow{color:#f0bd79}
input,select,textarea{border-radius:12px}
footer,.footer{background:#0c1d2e;color:#f5eee4}
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #e4ad63;outline-offset:3px}
@media(max-width:900px){
 .header{top:32px;height:74px;padding:0 5%}
 .nav{background:#10243a;border-radius:18px;padding:18px;box-shadow:0 12px 28px #0002}
 .hero{min-height:620px;padding:125px 6% 150px;background-position:center}
 .hero-stamp{bottom:145px}
 .trust-strip{margin-inline:5%;padding:20px;gap:14px}
 .section{padding:65px 5%}
 .story{margin-inline:5%;border-radius:22px}
}
@media(max-width:600px){
 .topbar{font-size:10px;padding-inline:4%}
 .header{padding-inline:4%}
 .logo{width:48px;height:48px}
 .hero{min-height:650px;padding:125px 5% 175px;border-radius:0 0 24px 24px}
 h1{font-size:clamp(50px,14vw,76px)}
 .hero-copy{font-size:14px}
 .hero-buttons{gap:9px}
 .hero-buttons .button{padding:13px 16px;font-size:11px}
 .hero-stamp{right:5%;bottom:215px;font-size:10px}
 .trust-strip{margin-inline:4%;border-radius:16px}
 .section{padding:52px 5%}
 .booking-section{margin:18px 4% 35px;border-radius:20px}
}


/* AgadirQuest premium sunset homepage redesign */
.header{position:absolute;top:0;left:0;right:0;z-index:20;background:linear-gradient(180deg,rgba(12,30,45,.42),transparent);color:#fff;border-bottom:1px solid rgba(255,255,255,.12);backdrop-filter:blur(3px)}
.header .nav a,.header .brand-fallback,.header .language-label{color:#fff}.header .nav a:after{background:#f2bd65}.topbar{display:none}
.hero{min-height:790px;padding:155px 5% 275px;background-image:url('https://images.unsplash.com/photo-1518548419970-58e3b4079ab2?auto=format&fit=crop&w=2200&q=90');background-position:center 48%;border-radius:0 0 34px 34px;align-items:flex-start}
.hero-shade{background:linear-gradient(90deg,rgba(8,22,35,.76),rgba(8,22,35,.28) 57%,rgba(8,22,35,.03)),linear-gradient(0deg,rgba(16,16,19,.72),transparent 62%)}
.hero-content{max-width:520px;padding-top:75px}.eyebrow{color:#f8d79b}.hero h1{font-size:clamp(70px,8vw,120px);line-height:.96;letter-spacing:-.045em;margin-bottom:15px}.hero h1 em{color:#fff;font-style:normal}.hero-copy{color:#fff;font-size:16px;line-height:1.6}.hero .button:not(.button-ghost){background:#fff;color:#111827;border-radius:999px;padding:15px 24px}.hero .button-ghost{border:1px solid #ffffff80;border-radius:999px;background:#ffffff15;color:#fff}.hero-note{display:none}.hero-stamp{right:5%;bottom:255px;border-radius:16px;backdrop-filter:blur(12px)}
.hero-category-cards{position:absolute;z-index:3;right:4.5%;bottom:155px;width:min(66%,950px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.hero-category-card{position:relative;display:block;min-width:0;height:235px;border:1px solid #ffffff50;border-radius:14px;overflow:hidden;color:#fff;text-decoration:none;background:#111;box-shadow:0 12px 28px #0004;transition:transform .25s,border-color .25s}
.hero-category-card:hover{transform:translateY(-5px);border-color:#f5c36a}.hero-category-card:before{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(5,10,15,.95));z-index:1}.hero-category-card img{width:100%;height:100%;object-fit:cover;display:block}.hero-category-card span{position:absolute;z-index:2;left:13px;right:28px;bottom:14px;display:flex;flex-direction:column;gap:7px}.hero-category-card b{font-size:13px;font-weight:650}.hero-category-card small{font-size:10px;line-height:1.4;color:#f0e9df}.hero-category-card i{position:absolute;z-index:2;right:10px;bottom:13px;width:28px;height:28px;border:1px solid #ffffffb5;border-radius:50%;display:grid;place-items:center;font-style:normal}
.hero-booking-bar{position:absolute;z-index:4;left:4%;right:4%;bottom:28px;display:grid;grid-template-columns:1fr 1fr 1fr auto;align-items:center;gap:0;padding:14px 16px;border:1px solid #ffffff85;border-radius:999px;background:rgba(30,24,22,.7);backdrop-filter:blur(18px);box-shadow:0 15px 40px #0004;color:#fff}.hero-booking-bar div{display:flex;flex-direction:column;gap:5px;padding:0 22px;border-right:1px solid #ffffff30}.hero-booking-bar small{font-size:11px;color:#dfd2c5}.hero-booking-bar strong{font-size:14px;font-weight:550}.hero-booking-bar>a{display:block;padding:16px 28px;border-radius:999px;background:#f1b85e;color:#17130d;text-align:center;text-decoration:none;font-size:13px;font-weight:750;white-space:nowrap}
.trust-strip{background:#fffaf2;padding:25px 7%;}.trust-strip strong{color:#c18a36}
@media(max-width:1000px){.hero{min-height:900px;padding:135px 5% 340px}.hero-category-cards{left:5%;right:5%;width:auto;bottom:145px}.hero-category-card{height:190px}.hero-booking-bar{bottom:20px}.hero-stamp{display:none}}
@media(max-width:760px){.header{position:absolute;height:74px}.header .nav{background:#172b38;color:#fff}.header .nav a{color:#fff}.hero{min-height:1050px;padding:115px 6% 0;background-position:58% center;border-radius:0 0 22px 22px}.hero-content{padding-top:45px}.hero h1{font-size:68px}.hero-copy{font-size:14px}.hero-category-cards{grid-template-columns:repeat(2,minmax(0,1fr));bottom:205px;gap:10px}.hero-category-card{height:170px}.hero-category-card b{font-size:12px}.hero-booking-bar{left:5%;right:5%;bottom:15px;border-radius:22px;grid-template-columns:1fr 1fr;padding:13px;gap:12px}.hero-booking-bar div{padding:8px 10px;border-right:0;border-bottom:1px solid #ffffff30}.hero-booking-bar>a{grid-column:1/-1;padding:14px}.trust-strip{grid-template-columns:1fr 1fr}}
@media(max-width:420px){.hero{min-height:1080px}.hero h1{font-size:58px}.hero-category-card{height:155px}.hero-category-card span{left:9px;bottom:10px}.hero-category-card small{font-size:9px}.hero-booking-bar strong{font-size:12px}}

/* Destination discovery layout: one strong photo per destination, followed by its discoveries. */
.destination-discovery { padding-top: 70px; padding-bottom: 78px; }
.destination-feature { display:grid; grid-template-columns:minmax(0,1.02fr) minmax(0,1fr); gap:clamp(24px,4vw,56px); align-items:stretch; margin-top:32px; }
.destination-feature-reverse { grid-template-columns:minmax(0,1.02fr) minmax(0,1fr); }
.destination-feature-image { display:block; width:100%; height:100%; min-height:570px; max-height:720px; object-fit:cover; border-radius:22px; box-shadow:0 18px 50px rgba(8,23,46,.13); }
.destination-feature-copy { padding:10px 0; align-self:center; }
.destination-feature-kicker { margin:0 0 10px; color:var(--aq-terracotta,#CC7D51); font-size:11px; font-weight:800; letter-spacing:.16em; }
.destination-feature-copy h3 { margin:0 0 12px; color:var(--aq-navy-deep,#08172E); font-size:clamp(26px,3vw,38px); line-height:1.15; }
.destination-feature-copy>p:not(.destination-feature-kicker) { margin:0 0 22px; max-width:600px; color:#596579; line-height:1.75; }
.discovery-list { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr; gap:0; }
.discovery-list li { display:flex; align-items:flex-start; gap:14px; padding:14px 0; border-top:1px solid rgba(8,23,46,.11); }
.discovery-icon { display:flex; flex:0 0 38px; width:38px; height:38px; align-items:center; justify-content:center; border-radius:50%; background:#f4e9df; color:var(--aq-terracotta,#CC7D51); font-size:19px; }
.discovery-list strong { display:block; margin:0 0 3px; color:var(--aq-navy-deep,#08172E); font-size:15px; }
.discovery-list p { margin:0; color:#657083; font-size:13px; line-height:1.55; }
@media (max-width:800px) { .destination-discovery{padding-top:48px;padding-bottom:52px}.destination-feature,.destination-feature-reverse{grid-template-columns:1fr;gap:24px}.destination-feature-image{min-height:260px;max-height:360px}.destination-feature-copy{padding:0}.discovery-list li{padding:12px 0} }

/* Accessibility fix: keep the WhatsApp contact link readable on the dark booking panel. */
.booking-intro .contact-line { color: #e8edf2; gap: 10px; line-height: 1.6; }
.booking-intro .contact-line a,
.booking-intro .contact-line a:visited { color: #ffffff !important; font-weight: 700; text-decoration: underline; text-decoration-color: #d4af37; text-underline-offset: 4px; overflow-wrap: anywhere; }
.booking-intro .contact-line a:hover,
.booking-intro .contact-line a:focus-visible { color: #f5d783 !important; text-decoration-color: #f5d783; }
.booking-intro .contact-line:first-of-type { margin-top: 30px; }

/* Desktop hero layout fix: keep the headline and category cards in separate columns. */
@media (min-width: 1001px) {
  .hero {
    min-height: 790px;
    padding: 150px 5% 275px;
    align-items: flex-start;
  }
  .hero-content {
    width: 34%;
    max-width: 450px;
    padding-top: 58px;
    flex: 0 0 34%;
  }
  .hero h1 {
    font-size: clamp(58px, 5.1vw, 78px);
    line-height: 1.02;
  }
  .hero-copy { max-width: 430px; font-size: 14px; }
  .hero-category-cards {
    right: 4%;
    bottom: 155px;
    width: 57%;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
  }
  .hero-category-card { height: 205px; }
  .hero-category-card span { left: 10px; right: 24px; bottom: 11px; }
  .hero-category-card b { font-size: 12px; }
  .hero-category-card small { font-size: 9px; }
  .hero-stamp { display: none; }
}

@media (min-width: 1001px) and (max-width: 1200px) {
  .hero-content { width: 32%; flex-basis: 32%; }
  .hero h1 { font-size: clamp(56px, 4.8vw, 68px); }
  .hero-category-cards { width: 59%; }
  .hero-category-card { height: 185px; }
}


/* v7: Agadir sunrise hero + original AgadirQuest logo clarity */
.header .brand { flex: 0 0 165px; min-width: 165px; display: flex; align-items: center; justify-content: flex-start; }
.header .logo { width: 142px; height: 88px; object-fit: contain; object-position: center; filter: drop-shadow(0 2px 5px rgba(0,0,0,.42)); }
.hero { background-image: url("assets/agadir-sunrise-hero.png"); background-position: center 48%; background-size: cover; }
.hero-shade { background: linear-gradient(90deg, rgba(8,25,40,.72) 0%, rgba(8,25,40,.38) 43%, rgba(8,25,40,.06) 100%), linear-gradient(0deg, rgba(8,20,30,.36), transparent 58%); }
@media (max-width: 1000px) { .header .brand { flex-basis: 132px; min-width: 132px; } .header .logo { width: 116px; height: 76px; } }
@media (max-width: 760px) { .header .brand { flex-basis: 104px; min-width: 104px; } .header .logo { width: 96px; height: 64px; } .hero { background-position: 58% center; } }
@media (max-width: 420px) { .header .brand { flex-basis: 88px; min-width: 88px; } .header .logo { width: 82px; height: 56px; } }


/* v8: match the approved Agadir sunrise homepage reference; preserve original logo file. */
.topbar { display: none !important; }
.header {
  position: absolute !important;
  top: 0; left: 0; right: 0;
  height: 118px;
  padding: 0 5.8%;
  background: linear-gradient(180deg, rgba(5,48,82,.56), rgba(5,48,82,.18)) !important;
  border-bottom: 1px solid rgba(255,255,255,.22) !important;
  z-index: 20;
  overflow: visible !important;
}
.header .brand {
  flex: 0 0 190px;
  min-width: 190px;
  height: 100%;
  align-items: center;
  overflow: visible !important;
}
.header .logo {
  display: block;
  width: 160px;
  height: 102px;
  max-height: none;
  object-fit: contain;
  object-position: center;
  filter: none;
}
.header .nav { gap: clamp(16px, 2.6vw, 42px); }
.header .nav a { color: #fff !important; font-size: 14px; font-weight: 650; }
.header .nav a:hover { color: #ffd05a !important; }
.header .header-actions { gap: 20px; }
.header .language-label {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 42px;
  padding: 0 12px;
  color: #fff;
  border: 1px solid rgba(255,255,255,.48);
  border-radius: 999px;
  background: rgba(7,42,73,.22);
  box-shadow: 0 4px 16px rgba(0,0,0,.08);
}
.header .language-label select {
  min-width: 82px;
  padding: 8px 16px 8px 0;
  color: #fff !important;
  background: transparent !important;
  font-size: 13px;
  font-weight: 700;
}
.header .language-label select option { color: #142b43; background: #fff; }
.header .button-small { border-radius: 999px; padding: 17px 25px; font-size: 14px; }
.hero {
  min-height: 900px;
  padding: 178px 5.8% 160px;
  align-items: flex-start;
  background-image: url("assets/agadir-sunrise-hero-approved.jpg") !important;
  background-position: center 48% !important;
  background-size: cover !important;
}
.hero-shade {
  background: linear-gradient(90deg, rgba(8,34,58,.58) 0%, rgba(8,34,58,.20) 46%, rgba(8,34,58,.02) 100%),
              linear-gradient(0deg, rgba(4,22,35,.28), transparent 58%) !important;
}
.hero-content {
  position: relative;
  z-index: 4;
  width: min(42%, 690px);
  max-width: 690px;
  flex: 0 0 42%;
  padding-top: 18px;
}
.hero .eyebrow { color: #ffd05a; }
.hero h1 {
  max-width: 660px;
  margin: 22px 0 22px;
  font-size: clamp(58px, 6vw, 100px);
  line-height: .98;
  letter-spacing: -.045em;
}
.hero h1 em { color: #ffc13b; }
.hero-copy { max-width: 610px; font-size: clamp(14px, 1.25vw, 18px); line-height: 1.6; }
.hero-buttons { margin-top: 26px; }
.hero-buttons .button { border-radius: 9px; padding: 18px 26px; font-size: 14px; }
.hero-category-cards { display: none !important; }
.hero-booking-bar {
  left: 5%; right: 5%; bottom: 28px;
  width: auto;
  z-index: 5;
  border-radius: 999px;
  padding: 12px 14px 12px 32px;
  background: rgba(18,19,22,.86);
  border: 1px solid rgba(255,255,255,.38);
  box-shadow: 0 12px 36px rgba(0,0,0,.28);
  backdrop-filter: blur(14px);
}
.hero-booking-bar > div { padding: 8px 22px; }
.hero-booking-bar > div small { color: rgba(255,255,255,.72); }
.hero-booking-bar > div strong { color: #fff; }
.hero-booking-bar > a { border-radius: 999px; padding: 17px 25px; white-space: nowrap; }

@media (max-width: 1000px) {
  .header { height: 88px; padding: 0 4%; }
  .header .brand { flex-basis: 135px; min-width: 135px; }
  .header .logo { width: 125px; height: 78px; }
  .header .nav { gap: 15px; }
  .header .nav a { font-size: 12px; }
  .header .header-actions { gap: 9px; }
  .header .language-label { padding: 0 8px; }
  .header .language-label select { min-width: 68px; }
  .hero { min-height: 800px; padding: 145px 5% 175px; }
  .hero-content { width: min(62%, 580px); flex-basis: 62%; }
  .hero h1 { font-size: clamp(54px, 7.5vw, 76px); }
  .hero-booking-bar { left: 4%; right: 4%; bottom: 20px; padding-left: 12px; }
  .hero-booking-bar > div { padding: 7px 10px; }
}
@media (max-width: 760px) {
  .header { height: 78px; padding: 0 4%; }
  .header .brand { flex-basis: 104px; min-width: 104px; }
  .header .logo { width: 100px; height: 68px; }
  .header .nav { background: rgba(255,255,255,.97); }
  .header .nav a { color: #142b43 !important; }
  .header .header-actions { gap: 6px; }
  .header .language-label { min-height: 36px; padding: 0 7px; gap: 4px; }
  .header .language-label select { min-width: 48px; padding-right: 2px; font-size: 11px; }
  .header .button-small { padding: 12px 13px; font-size: 11px; }
  .hero { min-height: 850px; padding: 128px 6% 255px; background-position: 56% center !important; }
  .hero-content { width: 100%; max-width: 560px; flex-basis: 100%; padding-top: 28px; }
  .hero h1 { font-size: clamp(52px, 12vw, 72px); line-height: .99; }
  .hero-copy { font-size: 14px; max-width: 430px; }
  .hero-buttons { flex-wrap: wrap; gap: 10px; }
  .hero-buttons .button { padding: 15px 18px; }
  .hero-booking-bar {
    display: grid; grid-template-columns: 1fr 1fr;
    left: 4%; right: 4%; bottom: 14px;
    border-radius: 20px; padding: 10px;
  }
  .hero-booking-bar > div { min-width: 0; padding: 8px 10px; }
  .hero-booking-bar > div strong { font-size: 12px; }
  .hero-booking-bar > a { grid-column: 1 / -1; justify-content: center; padding: 14px; }
}


/* v9 repair: use the clean panoramic photo, not the full reference mockup.
   This removes the ghosted duplicate text and search controls baked into the old background. */
.hero {
  background-image: url("assets/agadir-sunrise-clean-background.jpg") !important;
  background-position: center center !important;
  background-size: cover !important;
  overflow: hidden;
}
.hero-content {
  flex: 0 1 43%;
  width: min(43%, 620px);
  max-width: 620px;
  margin-left: 0;
}
.hero h1 { max-width: 610px; }
.hero-copy { max-width: 520px; }
@media (min-width: 1001px) {
  .hero { min-height: 860px; padding-top: 150px; padding-bottom: 150px; }
}
@media (max-width: 1000px) {
  .hero { background-position: 58% center !important; }
}


/* v10: final desktop hero layout based on the approved AgadirQuest reference */
@media (min-width: 1001px) {
  .header {
    position: absolute !important;
    height: 122px !important;
    padding: 0 5.8% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: linear-gradient(180deg, rgba(5,48,82,.68), rgba(5,48,82,.20)) !important;
    border-bottom: 1px solid rgba(255,255,255,.22) !important;
    overflow: visible !important;
  }
  .header .brand { flex: 0 0 200px !important; min-width: 200px !important; height: 100% !important; }
  .header .logo { width: 178px !important; height: 112px !important; object-fit: contain !important; object-position: center !important; }
  .header .nav { flex: 1 1 auto !important; justify-content: center !important; gap: clamp(20px, 2.8vw, 46px) !important; }
  .header .header-actions { flex: 0 0 auto !important; gap: 18px !important; }
  .header .language-label { min-height: 48px !important; padding: 0 15px !important; border: 1px solid rgba(255,255,255,.55) !important; border-radius: 999px !important; background: rgba(4,48,82,.25) !important; color: #fff !important; }
  .header .language-label select { color: #fff !important; min-width: 84px !important; font-size: 14px !important; }
  .header .button-small { border-radius: 999px !important; padding: 18px 27px !important; font-size: 14px !important; }
  .hero {
    min-height: max(900px, 100vh) !important;
    padding: 205px 5.8% 170px !important;
    display: flex !important;
    align-items: flex-start !important;
    background-image: url("assets/agadir-sunrise-clean-background.jpg") !important;
    background-position: center 48% !important;
    background-size: cover !important;
    overflow: hidden !important;
  }
  .hero-shade {
    background: linear-gradient(90deg, rgba(6,38,65,.48) 0%, rgba(6,38,65,.18) 42%, rgba(6,38,65,.02) 100%),
                linear-gradient(0deg, rgba(3,20,35,.25), transparent 55%) !important;
  }
  .hero-content {
    position: relative !important;
    z-index: 4 !important;
    display: block !important;
    width: min(38%, 620px) !important;
    max-width: 620px !important;
    flex: 0 0 min(38%, 620px) !important;
    margin: 0 !important;
    padding: 8px 0 0 !important;
    transform: none !important;
  }
  .hero .eyebrow { margin: 0 0 22px !important; font-size: 13px !important; letter-spacing: .18em !important; color: #ffd05a !important; }
  .hero h1 {
    display: block !important;
    max-width: 610px !important;
    margin: 0 0 22px !important;
    font-size: clamp(66px, 6.1vw, 102px) !important;
    line-height: .98 !important;
    letter-spacing: -.048em !important;
    color: #fff !important;
  }
  .hero h1 em { color: #ffc43d !important; font-style: italic !important; }
  .hero-copy { max-width: 620px !important; margin: 0 0 28px !important; font-size: clamp(15px, 1.2vw, 19px) !important; line-height: 1.55 !important; color: #fff !important; }
  .hero-buttons { display: flex !important; gap: 14px !important; margin-top: 0 !important; }
  .hero-buttons .button { border-radius: 10px !important; padding: 19px 27px !important; font-size: 14px !important; }
  .hero .button:not(.button-ghost) { background: #ffc43d !important; border-color: #ffc43d !important; color: #111827 !important; }
  .hero .button-ghost { background: rgba(8,44,75,.25) !important; color: #fff !important; border: 1px solid rgba(255,255,255,.8) !important; }
  .hero-note, .hero-stamp { display: none !important; }
  .hero-category-cards { display: none !important; }
  .hero-booking-bar {
    display: grid !important;
    grid-template-columns: 1.05fr 1.05fr .85fr auto !important;
    left: 5% !important; right: 5% !important; bottom: 28px !important;
    width: auto !important; padding: 12px 14px 12px 24px !important;
    border-radius: 999px !important; background: rgba(18,19,22,.88) !important;
    border: 1px solid rgba(255,255,255,.45) !important; z-index: 5 !important;
  }
  .hero-booking-bar > div { min-width: 0 !important; padding: 8px 22px !important; }
  .hero-booking-bar > div small { color: rgba(255,255,255,.75) !important; }
  .hero-booking-bar > div strong { color: #fff !important; }
  .hero-booking-bar > a { padding: 18px 28px !important; border-radius: 999px !important; background: #ffc43d !important; color: #111827 !important; }
}
@media (min-width: 1001px) and (max-width: 1250px) {
  .header { padding-left: 3.5% !important; padding-right: 3.5% !important; }
  .header .brand { flex-basis: 155px !important; min-width: 155px !important; }
  .header .logo { width: 150px !important; }
  .header .nav { gap: 17px !important; }
  .header .nav a { font-size: 12px !important; }
  .header .header-actions { gap: 8px !important; }
  .hero h1 { font-size: clamp(60px, 5.5vw, 76px) !important; }
}


/* v11: make the selected language readable on the dark transparent header */
@media (min-width: 1001px) {
  .header .language-label {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    min-width: 168px !important;
    color: #ffffff !important;
  }
  .header .language-label select,
  .header .language-label select:focus,
  .header .language-label select:active {
    display: inline-block !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    background-color: transparent !important;
    min-width: 94px !important;
    width: auto !important;
    padding: 8px 20px 8px 0 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    appearance: auto !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.25) !important;
  }
  .header .language-label select option {
    color: #10233b !important;
    background: #ffffff !important;
    -webkit-text-fill-color: #10233b !important;
  }
}
@media (max-width: 1000px) {
  .header .language-label select,
  .header .language-label select:focus {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
  }
  .header .language-label select option {
    color: #10233b !important;
    background: #ffffff !important;
  }
}


/* V12 approved desktop hero, readable language selector and WhatsApp button */
@media (min-width: 1001px) {
  .header {
    position: absolute !important; top: 0; left: 0; right: 0;
    z-index: 20 !important; min-height: 122px !important;
    padding: 14px 5.4% !important;
    background: linear-gradient(180deg, rgba(0,65,119,.78), rgba(0,65,119,.42)) !important;
    border-bottom: 1px solid rgba(255,255,255,.2) !important;
    backdrop-filter: blur(8px);
  }
  .header .brand { flex: 0 0 190px !important; min-width: 190px !important; }
  .header .logo { width: 178px !important; max-height: 102px !important; object-fit: contain !important; }
  .header .nav { gap: 0 !important; align-items: center !important; }
  .header .nav a { padding: 0 24px !important; font-size: 15px !important; color: #fff !important; border-right: 1px solid rgba(255,255,255,.17); }
  .header .nav a:last-child { border-right: 0; }
  .header .header-actions { gap: 18px !important; }
  .header .language-label {
    min-width: 168px !important; height: 54px !important; box-sizing: border-box;
    padding: 0 15px !important; gap: 10px !important;
    border: 1px solid #f6c34b !important; border-radius: 999px !important;
    background: rgba(0,55,105,.58) !important; color: #fff !important;
    box-shadow: 0 4px 16px rgba(0,0,0,.08);
  }
  .header .language-label select {
    min-width: 98px !important; max-width: 112px !important; height: 44px !important;
    color: #fff !important; -webkit-text-fill-color: #fff !important;
    background: transparent !important; border: 0 !important; font-size: 15px !important;
    font-weight: 700 !important; padding: 6px 2px !important; cursor: pointer;
  }
  .header .language-label select option { color: #10233b !important; background: #fff !important; }
  .header .button-small { min-height: 54px !important; padding: 0 30px !important; border-radius: 999px !important; background: #ffc844 !important; border-color: #ffc844 !important; color: #101828 !important; font-size: 15px !important; }
  .hero {
    min-height: 900px !important; height: min(100vh, 980px) !important;
    box-sizing: border-box !important; align-items: center !important;
    padding: 145px 5% 160px !important;
    background-image: url('assets/agadir-sunrise-hero-approved.jpg') !important;
    background-position: center center !important; background-size: cover !important;
  }
  .hero-shade {
    background: linear-gradient(90deg, rgba(0,40,78,.72) 0%, rgba(0,48,86,.36) 39%, rgba(0,36,67,.05) 72%), linear-gradient(180deg, rgba(0,51,93,.12), rgba(0,27,52,.12)) !important;
  }
  .hero-content { width: min(42%, 660px) !important; max-width: 660px !important; z-index: 3 !important; }
  .hero .eyebrow { color: #ffc844 !important; font-size: 13px !important; letter-spacing: .17em !important; margin-bottom: 22px !important; }
  .hero h1 { max-width: 650px !important; font-size: clamp(68px, 6vw, 100px) !important; line-height: .98 !important; margin-bottom: 22px !important; }
  .hero h1 em { color: #ffc844 !important; }
  .hero-copy { max-width: 610px !important; font-size: clamp(16px, 1.25vw, 20px) !important; line-height: 1.55 !important; }
  .hero-buttons .button { min-height: 64px !important; border-radius: 13px !important; padding: 0 32px !important; font-size: 15px !important; }
  .hero .button:not(.button-ghost) { background: #ffc844 !important; border-color: #ffc844 !important; color: #101828 !important; }
  .hero .button-ghost { background: rgba(0,48,86,.32) !important; border: 1px solid rgba(255,255,255,.9) !important; color: #fff !important; }
  .hero-note, .hero-stamp { display: none !important; }
  .hero-category-cards { display: none !important; }
  .hero-booking-bar {
    left: 4.5% !important; right: 13% !important; bottom: 32px !important;
    width: auto !important; grid-template-columns: 1.05fr 1.05fr .85fr auto !important;
    padding: 12px 14px 12px 24px !important; border-radius: 999px !important;
    background: rgba(17,20,25,.91) !important; border: 1px solid rgba(255,255,255,.55) !important;
    box-shadow: 0 14px 40px rgba(0,0,0,.25) !important; z-index: 6 !important;
  }
  .hero-booking-bar > div { min-width: 0 !important; padding: 8px 22px !important; }
  .hero-booking-bar > div small { color: rgba(255,255,255,.72) !important; }
  .hero-booking-bar > div strong { color: #fff !important; }
  .hero-booking-bar > a { border-radius: 999px !important; padding: 19px 30px !important; background: #ffc844 !important; color: #101828 !important; white-space: nowrap; }
}
.floating-whatsapp {
  position: fixed !important; right: 28px !important; bottom: 28px !important; z-index: 60 !important;
  display: inline-flex !important; flex-direction: row !important; align-items: center !important;
  justify-content: center !important; gap: 10px !important; min-height: 58px !important;
  padding: 0 23px !important; border: 0 !important; border-radius: 999px !important;
  background: #08b96b !important; color: #fff !important; box-shadow: 0 8px 24px rgba(0,0,0,.2) !important;
  font-size: 14px !important; font-weight: 700 !important; text-decoration: none !important;
}
.floating-whatsapp span:first-child {
  display: grid !important; place-items: center !important; width: 29px !important; height: 29px !important;
  border-radius: 50% !important; background: transparent !important; color: #fff !important; font-size: 0 !important;
}
.floating-whatsapp span:first-child svg { width: 28px; height: 28px; display: block; }
.floating-whatsapp span:last-child { display: inline !important; color: #fff !important; }
.floating-whatsapp:hover { background: #079957 !important; transform: translateY(-2px); }
@media (max-width: 1000px) {
  .floating-whatsapp { right: 14px !important; bottom: 14px !important; min-height: 50px !important; padding: 0 16px !important; }
  .floating-whatsapp span:last-child { display: inline !important; }
}

/* V13: custom language dropdown to avoid the browser's plain white native menu */
.language-picker{position:relative;display:flex;align-items:center;gap:10px;}
.language-picker #languageSelect{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;overflow:hidden!important;}
.language-picker .language-trigger{display:flex;align-items:center;justify-content:space-between;gap:14px;min-width:112px;height:42px;padding:0 4px;border:0;background:transparent;color:#fff;font:inherit;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap;}
.language-picker .language-current{display:inline-flex;align-items:center;gap:8px;}
.language-picker .language-chevron{font-size:18px;line-height:1;opacity:.9;margin-top:-5px;}
.language-picker .language-menu{display:none;position:absolute;top:calc(100% + 12px);right:0;min-width:130px;padding:6px;background:linear-gradient(145deg,#102c43,#071a2c);border:1px solid rgba(255,255,255,.14);border-radius:15px;box-shadow:0 16px 38px rgba(0,0,0,.3);z-index:1000;}
.language-picker .language-menu.open{display:block;animation:languageMenuIn .15s ease-out;}
.language-picker .language-menu button{display:flex;align-items:center;gap:9px;width:100%;min-height:30px;padding:6px 9px;border:0;border-radius:9px;background:transparent;color:#f7f9fc;font:inherit;font-size:13px;text-align:left;cursor:pointer;white-space:nowrap;}
.language-picker .language-menu button:hover,.language-picker .language-menu button.selected{background:rgba(255,196,68,.18);color:#ffd15c;}
.language-picker .language-globe{font-size:18px;flex:0 0 auto;}
@keyframes languageMenuIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.language-picker .language-trigger{min-width:86px;font-size:12px;gap:7px}.language-picker .language-menu{right:0;min-width:130px}.language-picker .language-menu button{font-size:13px}}

/* V17: match the supplied clean hero reference; use the clean photograph, never a screenshot with baked-in text. */
.topbar[hidden] { display: none !important; }
@media (min-width: 1001px) {
  .header { top: 0 !important; min-height: 123px !important; }
  .hero {
    min-height: 620px !important;
    height: min(78vh, 740px) !important;
    padding: 132px 5% 112px !important;
    background-image: url('assets/agadir-sunrise-clean-background.jpg') !important;
    background-position: center center !important;
    background-size: cover !important;
    align-items: flex-start !important;
  }
  .hero-shade {
    background: linear-gradient(90deg, rgba(0,48,91,.62) 0%, rgba(0,48,91,.26) 43%, rgba(0,30,58,.02) 75%), linear-gradient(180deg, rgba(0,54,100,.12), rgba(0,24,48,.12)) !important;
  }
  .hero-content { width: min(40%, 540px) !important; flex: 0 0 40% !important; padding-top: 8px !important; }
  .hero h1 { max-width: 460px !important; font-size: clamp(54px, 4.7vw, 78px) !important; line-height: .94 !important; margin: 16px 0 16px !important; }
  .hero-copy { max-width: 540px !important; font-size: clamp(14px, 1vw, 17px) !important; line-height: 1.45 !important; }
  .hero-booking-bar { left: 4.4% !important; right: 12.8% !important; bottom: 20px !important; }
}
@media (max-width: 1000px) {
  .hero { background-image: url('assets/agadir-sunrise-clean-background.jpg') !important; }
}

/* V19: reduce oversized desktop hero without changing other pages/content. */
@media (min-width: 1001px) and (max-height: 800px) {
  .hero { height: 680px !important; min-height: 600px !important; padding-top: 118px !important; padding-bottom: 92px !important; }
  .hero h1 { font-size: clamp(50px, 4.2vw, 68px) !important; }
  .hero-booking-bar { bottom: 16px !important; }
}
@media (max-width: 1000px) {
  .hero { min-height: 680px !important; height: auto !important; padding-top: 125px !important; padding-bottom: 150px !important; }
  .hero h1 { font-size: clamp(44px, 8vw, 66px) !important; line-height: .98 !important; }
}
