@charset "UTF-8";
/*
 * Talitha Header & Footer — v12 parity CSS.
 * Ported directly from talitha-homepage-redesign-v12 July.23.html's <style> block (topbar, header/nav,
 * mega menu, hamburger + mobile off-canvas menu, and footer sections only). Shared primitives the
 * design already relies on — .wrap, .btn/.btn-primary/.btn-dark, CSS variables (--terracotta, --sand,
 * --ink, --muted, --line, --brown-deep, --serif, --sans) — are defined once in the theme's style.css
 * and are NOT redeclared here, so this file only contains selectors unique to the header and footer.
 */

/* Top contact bar */
.topbar{background:#1c130b;color:#cdbfae;font-size:.82rem;letter-spacing:.02em}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:44px}
.topbar a{color:#d9cdbd}
.topbar a:hover{color:#e6a34c}
.topbar .left{display:flex;gap:1.8rem;align-items:center}
.topbar .left span{display:flex;align-items:center;gap:.4rem}
.topbar .right{display:flex;gap:.7rem;align-items:center}
.lang-wrap{position:relative;margin-right:.5rem}
.topbar .lang{border:1px solid rgba(255,255,255,.25);border-radius:6px;padding:.3rem .6rem;font-size:.76rem;cursor:pointer;display:inline-flex;align-items:center;gap:.35rem}
.topbar .lang .car{font-size:.6rem;transition:.2s}
.lang-wrap:hover .lang .car{transform:rotate(180deg)}
.lang-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:210px;background:#1c130b;border:1px solid rgba(230,163,76,.3);border-radius:12px;padding:8px;box-shadow:0 24px 44px rgba(0,0,0,.5);z-index:70;opacity:0;visibility:hidden;transform:translateY(6px);transition:.2s}
.lang-wrap:hover .lang-menu{opacity:1;visibility:visible;transform:none}
.lang-menu a{display:flex;align-items:center;gap:.7rem;padding:.6rem .7rem;border-radius:8px;color:#d9cdbd;font-size:.9rem}
.lang-menu a:hover{background:rgba(255,255,255,.06);color:#fff}
.lang-menu a.active{color:#e6a34c}
.lang-menu a .flag{font-size:1rem}
.lang-menu a .ck{margin-left:auto;color:#e6a34c}
.lang-wrap::after{content:"";position:absolute;top:100%;right:0;width:210px;height:10px}
.topbar .soc{width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;font-size:.72rem;color:#e7ddd0}
.topbar .soc:hover{background:var(--terracotta);border-color:var(--terracotta);color:#fff}

/* Header (solid terracotta bar) */
header.nav{position:sticky;top:0;z-index:60;background:var(--terracotta);box-shadow:0 4px 18px rgba(56,36,22,.18)}
header.nav > .wrap{display:flex;align-items:center;justify-content:space-between;height:88px;gap:1rem}
.brand{display:flex;align-items:center;gap:.7rem;flex-shrink:0}
.brand img{height:56px;width:auto;display:block;flex-shrink:0}
nav.main{display:flex;gap:1.5rem;align-items:center;position:relative}
/* Bug fix (July.31) — this was position:static, so the mega panel's `position:absolute;left:0` (below)
   had no positioned ancestor to anchor to except nav.main itself (which IS position:relative, spanning
   the whole nav bar). Every mega menu was therefore left-aligning to the start of the entire nav instead
   of its own trigger link — most visible on items further right (e.g. Zanzibar Island), where the panel
   opened far to the left of the link that triggered it instead of flush beneath it. */
nav.main > .item{position:relative}
nav.main > .item > a{font-size:.84rem;letter-spacing:.08em;text-transform:uppercase;color:#fbeee6;font-weight:500;padding:1.4rem .1rem;display:inline-flex;align-items:center;gap:.32rem;cursor:pointer;white-space:nowrap}
nav.main > .item > a:hover{color:#fff}
nav.main > .item > a .car{font-size:.6rem;transition:.25s}
nav.main > .item:hover > a .car{transform:rotate(180deg)}
.nav-cta{display:flex;align-items:center;gap:1.1rem;flex:0 0 auto}
.nav-cta .phone{color:#fff;font-size:.92rem;display:flex;align-items:center;gap:.4rem;white-space:nowrap}
.nav-cta .btn{white-space:nowrap;flex-shrink:0}
.nav-cta .btn-dark{background:#2a1b10}
.nav-cta .btn-dark:hover{background:#000}

/* Mega menu */
.mega{position:absolute;left:0;top:calc(100% + 2px);background:#fff;border-radius:0 0 12px 12px;box-shadow:0 24px 44px rgba(56,36,22,.24);border-top:3px solid var(--terracotta);opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s;z-index:59;overflow:hidden;max-width:calc(100vw - 32px)}
.mega.right{left:auto;right:0}
nav.main > .item:hover .mega{opacity:1;visibility:visible;transform:none}
.mega-inner{padding:22px 22px;display:flex;gap:22px}
.mega-inner > div{min-width:140px}
.mega h5{font-family:var(--sans);font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:.7rem;color:var(--terracotta);margin-bottom:.8rem;padding-bottom:.5rem;border-bottom:1px solid var(--line);white-space:nowrap}
.mega-inner.guides{gap:30px;align-items:stretch}
.feat-lg{position:relative;width:220px;flex:0 0 auto;border-radius:10px;overflow:hidden;align-self:stretch;min-height:290px}
.feat-lg img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.feat-lg .ov{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,12,6,0) 38%,rgba(20,12,6,.86))}
.feat-lg .cap{position:absolute;left:18px;right:18px;bottom:18px;color:#fff}
.feat-lg .cap .st{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:#e6a34c;font-weight:600}
.feat-lg .cap h6{font-family:var(--serif);font-size:1.6rem;color:#fff;margin:.15rem 0 .7rem;line-height:1.05}
.feat-lg .cap .go{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;border-top:1px solid rgba(230,163,76,.75);padding-top:.55rem;display:inline-flex;gap:.4rem}
.feat-lg:hover .cap .go{gap:.7rem}
.mega .glist a{display:flex;align-items:center;gap:.55rem;padding:.44rem .6rem;margin-left:-.6rem;border-radius:8px;color:var(--ink);font-size:.96rem;white-space:nowrap;transition:background .18s,color .18s}
.mega .glist a::before{content:"›";color:var(--terracotta);font-size:1.15rem;font-weight:600;line-height:1;transition:transform .18s}
.mega .glist a:hover{background:var(--sand-2);color:var(--terracotta)}
.mega .glist a:hover::before{transform:translateX(3px)}

/* Hamburger + mobile off-canvas menu */
.hamburger{display:none;flex-direction:column;gap:5px;width:46px;height:46px;align-items:center;justify-content:center;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);border-radius:10px;cursor:pointer;flex:0 0 auto}
.hamburger span{width:22px;height:2px;background:#fff;border-radius:2px;transition:.25s}
.mobile-nav{position:fixed;top:0;right:0;height:100dvh;width:min(340px,86vw);background:var(--brown-deep);color:#f0e7db;z-index:100;transform:translateX(100%);transition:transform .3s;padding:22px 22px 40px;overflow-y:auto;box-shadow:-20px 0 50px rgba(0,0,0,.45)}
.mobile-nav.open{transform:none}
.mobile-nav .mn-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.mobile-nav .mn-close{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:#e7ddd0;cursor:pointer}
.mobile-nav a.mn-link{display:flex;justify-content:space-between;align-items:center;color:#efe6da;padding:.9rem 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:1.02rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500}
.mobile-nav a.mn-link:hover{color:#e6a34c}
.mobile-nav .mn-cta{margin-top:20px}
.mobile-nav .mn-cta .btn{width:100%;justify-content:center;background:var(--terracotta)}
.mobile-nav .mn-contact{margin-top:18px;font-size:.88rem;color:#c7b9a9;line-height:1.8}
.mobile-nav .mn-contact a{color:#c7b9a9}
.mobile-nav .mn-social{display:flex;gap:.6rem;margin-top:14px}
.mobile-nav .mn-social a{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:#e7ddd0}
.mn-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:99;opacity:0;visibility:hidden;transition:.25s}
.mn-overlay.open{opacity:1;visibility:visible}
body.mn-lock{overflow:hidden}
/* mobile accordion sub-menus */
.mobile-nav .mn-toggle{display:flex;justify-content:space-between;align-items:center;width:100%;background:none;border:none;border-bottom:1px solid rgba(255,255,255,.12);color:#efe6da;padding:.9rem 0;font-family:var(--sans);font-size:1.02rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;cursor:pointer}
.mobile-nav .mn-toggle .mn-caret{color:#e6a34c;transition:.25s;font-size:.72rem}
.mobile-nav .mn-acc.open .mn-toggle .mn-caret{transform:rotate(180deg)}
.mobile-nav .mn-acc.open .mn-toggle{color:#e6a34c}
.mobile-nav .mn-sub{max-height:0;overflow:hidden;transition:max-height .32s ease}
.mobile-nav .mn-acc.open .mn-sub{max-height:1100px}
.mobile-nav .mn-sub h6{font-family:var(--sans);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:#e6a34c;margin:.95rem 0 .15rem}
.mobile-nav .mn-sub a{display:block;color:#d3c6b7;padding:.42rem 0 .42rem .2rem;font-size:.92rem;border:none}
.mobile-nav .mn-sub a:hover{color:#e6a34c;padding-left:.4rem}
.mobile-nav .mn-sub .mn-subpad{padding-bottom:.6rem;border-bottom:1px solid rgba(255,255,255,.12)}

/* Footer */
footer{background:var(--brown-deep);color:#c7b9a9}
.foot-rate{border-bottom:1px solid rgba(255,255,255,.1)}
.foot-rate .wrap{display:flex;align-items:center;justify-content:center;gap:1rem;height:56px;flex-wrap:wrap;font-size:.86rem;color:#e7ddd0}
.foot-rate b{color:#fff}
.foot-rate .stars{color:#e6a34c}
.foot-main{padding:64px 0 30px}
.foot-cols{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1.15fr;gap:38px}
footer h4{color:#e6a34c;font-family:var(--sans);font-weight:600;letter-spacing:.16em;text-transform:uppercase;font-size:.74rem;margin-bottom:1.2rem;padding-bottom:.7rem;border-bottom:1px solid rgba(255,255,255,.12)}
footer .flink{display:flex;align-items:center;gap:.5rem;color:#c7b9a9;padding:.34rem 0;font-size:.9rem}
footer .flink:hover{color:#e6a34c}
footer .flink .ar{color:var(--terracotta)}
.foot-about p{font-size:.9rem;color:#b4a596;margin-bottom:1.2rem;max-width:340px}
.foot-badge{display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:8px;padding:.5rem .8rem;font-size:.78rem;margin:0 .4rem .5rem 0}
.foot-contact .office{font-size:.9rem;color:#c7b9a9;margin-bottom:1rem;line-height:1.5}
.foot-md{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:.8rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.foot-md small{display:block;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:#9c8d7d}
.foot-md b{color:#fff;font-size:1.02rem}
.foot-md .msg{background:rgba(230,163,76,.18);color:#e6a34c;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;padding:.3rem .5rem;border-radius:5px}
.foot-contact .email{font-size:.9rem;color:#c7b9a9;margin-bottom:1.1rem}
.foot-contact .btn-primary{width:100%;justify-content:center}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:44px;padding-top:22px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;font-size:.8rem;color:#9c8d7d}
.foot-social{display:flex;gap:.6rem}
.foot-social a{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:#e7ddd0;font-size:.8rem}
.foot-social a:hover{background:var(--terracotta);color:#fff}
.foot-links a{margin-left:1.2rem;color:#9c8d7d}
.foot-links a:hover{color:#e6a34c}

/* Free Consultation floating widget — compact, appears after ~65% scroll */
.fc-widget{position:fixed;right:22px;bottom:22px;z-index:80;width:236px;background:rgba(30,19,10,.95);backdrop-filter:blur(6px);border:1px solid rgba(230,163,76,.35);border-radius:12px;padding:15px 16px 16px;box-shadow:0 16px 36px rgba(0,0,0,.4);color:#fff;transition:.35s}
.fc-widget.hidden{opacity:0;visibility:hidden;transform:translateY(16px)}
.fc-widget .fc-x{position:absolute;top:8px;right:10px;color:#b9a893;cursor:pointer;font-size:.85rem;line-height:1}
.fc-widget .fc-x:hover{color:#fff}
.fc-widget .fc-eye{font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:#e6a34c;font-weight:600}
.fc-widget h4{font-family:var(--serif);color:#fff;font-size:1.12rem;line-height:1.2;margin:.35rem 0 .8rem;font-weight:600}
.fc-widget .btn{width:100%;justify-content:center;background:var(--terracotta);padding:.62rem 1rem;font-size:.72rem}
.fc-widget .btn:hover{background:var(--terracotta-dark,#9c4a2b)}
/* Consultation modal */
.fc-overlay{position:fixed;inset:0;z-index:90;background:rgba(20,12,6,.72);backdrop-filter:blur(3px);display:flex;align-items:flex-start;justify-content:center;padding:32px 24px;opacity:0;visibility:hidden;transition:.25s;overflow:auto}
.fc-overlay.open{opacity:1;visibility:visible}
.fc-modal{background:var(--cream,#fbf8f4);border-radius:16px;max-width:620px;width:100%;box-shadow:0 40px 80px rgba(0,0,0,.4);position:relative;transform:translateY(12px);transition:.25s;overflow:hidden;margin:auto}
.fc-overlay.open .fc-modal{transform:none}
.fc-head{position:relative;padding:32px 34px 28px;color:#fff}
.fc-head .eyebrow{color:#e6a34c}
.fc-head h3{color:#fff;font-size:2.1rem;margin:.35rem 0 .5rem}
.fc-head p{color:#f0e7db;font-size:.94rem;max-width:470px}
.fc-close{position:absolute;top:16px;right:16px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.45);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.05rem}
.fc-close:hover{background:rgba(255,255,255,.32)}
.fc-body{padding:26px 34px 30px}
.fc-body label{display:block;font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:.35rem;font-weight:600}
.fc-body .req{color:var(--terracotta)}
.fc-body input,.fc-body select,.fc-body textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:.72rem .85rem;font-family:var(--sans);font-size:.92rem;background:#fff;color:var(--ink)}
.fc-body input:focus,.fc-body select:focus,.fc-body textarea:focus{outline:none;border-color:var(--terracotta)}
.fc-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.1rem}
.fc-chips .chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:.5rem 1rem;font-size:.76rem;letter-spacing:.03em;text-transform:uppercase;color:var(--brown);cursor:pointer;transition:.2s;font-weight:500}
.fc-chips .chip:hover,.fc-chips .chip.active{border-color:var(--terracotta);background:var(--terracotta);color:#fff}
.fc-body .btn-dark{width:100%;justify-content:center;margin-top:.5rem;letter-spacing:.1em}
.fc-body .privacy{text-align:center;color:var(--muted);font-size:.76rem;margin-top:.9rem}
.fc-success{color:var(--brown);text-align:center;padding:1.5rem 0 .5rem}
.fc-success-icon{font-size:2rem;line-height:1}
.fc-success h3{color:var(--brown);font-size:1.55rem;margin:.6rem 0 .4rem}
.fc-success p{color:var(--muted);margin:0;font-size:.92rem;line-height:1.6}
.fc-success-close{display:inline-flex!important;width:auto!important;margin-top:1.25rem!important;cursor:pointer}

/* Responsive — header/footer-relevant rules only, same breakpoints as v12 */
@media(max-width:1460px){
  header.nav > .wrap{gap:.6rem}
  nav.main{gap:1rem}
  nav.main > .item > a{font-size:.76rem;letter-spacing:.05em;padding:1.4rem .05rem}
  .nav-cta{gap:.7rem}
  .nav-cta .phone{display:none}
}
@media(max-width:1240px){
  nav.main{gap:.7rem}
  nav.main > .item > a{font-size:.72rem}
  .brand img{height:46px;width:auto}
  .nav-cta .btn{padding:.75rem 1.1rem;font-size:.74rem}
}
@media(max-width:1080px){
  nav.main{display:none}
  .hamburger{display:flex}
  .nav-cta{display:none}
}
@media(max-width:720px){
  .foot-cols{grid-template-columns:1fr 1fr}
  .topbar .wrap{height:auto;flex-wrap:wrap;gap:.2rem .9rem;padding-top:7px;padding-bottom:7px}
  .topbar .left span{white-space:nowrap}
  .topbar .left span:nth-child(2){display:none}
  header.nav > .wrap{height:72px}
  .brand img{height:42px;width:auto}
}
@media(max-width:480px){
  .foot-cols{grid-template-columns:1fr}
  .topbar .soc{display:none}
}
@media(prefers-reduced-motion:reduce){
  .mega,.mobile-nav{transition:none}
}