/* EF content reskin (ef-redesign, 2026-07): brings the ~10k internal posts/pages
   (guide topics, articles, expat experiences, archives) in line with the redesign
   palette - teal #0e5a6e + amber #f0a202 on warm cream - WITHOUT touching page
   content. Scoped to GP structural classes so the namespaced redesign surfaces
   (.efd/.efh/.efg/.efw/.efvf) are unaffected except where they share the chrome.
   Overrides the customizer-emitted a{#1e73be} / button{#f98000} / h1-h3{#242c9d}. */

:root{
  --efc-teal:#0e5a6e;--efc-teal-dark:#093f4e;--efc-amber:#f0a202;--efc-amber-dark:#cf8a00;
  --efc-ink:#23303a;--efc-muted:#5b6b79;--efc-bg:#fbf7f2;--efc-card:#fff;--efc-line:#ece4da;
  --efc-radius:14px;--efc-shadow:0 8px 26px rgba(9,63,78,.07)
}

/* ---- canvas: WHITE on internal pages (posts, /move/, tools, archives) —
   cream clashed with the white header + content boxes there (Jamie, 2026-07-12).
   The warm cream canvas stays only on the redesigned homepage + destination
   pages, whose sections were designed around it. ---------------------------- */
body{background:#f7f6f4} /* whisper of warm grey: cards read as cards, no cream clash */
body.home,body.page-template-page-destination{background:var(--efc-bg)}

/* Header + nav share the page canvas (transparent), so header and page always
   match whichever background the page has. Submenus/slideout/sticky stay solid. */
.site-header,
.main-navigation:not(.slideout-navigation){background:transparent}
.main-navigation .menu-toggle,.main-navigation .menu-toggle:hover,
.main-navigation .menu-toggle:focus,.main-navigation.toggled .menu-toggle{background:transparent !important}
.main-navigation:not(.slideout-navigation) ul ul{background:#fff}
.main-navigation.is_stuck,.main-navigation.sticky-navigation-transition{background:#fff}

/* ---- headings: indigo -> teal (content areas only) ----------------------- */
.entry-header h1,.entry-title,
.entry-content h1,.entry-content h2,.entry-content h3,.entry-content h4,
.page-header h1,.archive-title{color:var(--efc-teal)}
.entry-content h2,.entry-content h3{letter-spacing:-.3px}

/* ---- text + links -------------------------------------------------------- */
.entry-content,.entry-summary{color:var(--efc-ink)}
.entry-content a:not(.efd-btn):not([class*="efvf"]):not([class*="efw"]):not(.wp-block-button__link),
.entry-summary a,
.inside-article .entry-meta a,
nav.breadcrumbs a,.breadcrumb a{color:var(--efc-teal)}
.entry-content a:not(.efd-btn):not([class*="efvf"]):not([class*="efw"]):not(.wp-block-button__link):hover{color:var(--efc-teal-dark)}

/* ---- card spacing: GP's separator is 2px, cards nearly touch ------------- */
.separate-containers .site-main{margin:2px 12px 14px} /* top stays at GP's original 2px (header gap); side gutters stop full-bleed cards on mobile */
.separate-containers .sidebar .widget{margin-bottom:14px}
/* ---- archive/search/blog listings: redesign card GRID (markup: content.php
   .efa-card branch). The grid gap spaces cards; header + pagination span full
   width. -------------------------------------------------------------------- */
/* archive title: straight on the canvas (GP boxes it white by default) */
.category .page-header,.tag .page-header,.date .page-header,.author .page-header,
.search .page-header,.blog .page-header{background:transparent;box-shadow:none;border:0;
  padding:16px 4px 2px;margin-bottom:0}
.category .page-header h1,.tag .page-header h1,.date .page-header h1,.author .page-header h1,
.search .page-header h1,.blog .page-header h1{font-size:34px;font-weight:800;letter-spacing:-.5px;margin:0}

/* positive scoping (NOT bare .archive): custom post-type archives like /move/
   (body.post-type-archive-move) bring their own layout and must not be gridded */
.category .site-main,.tag .site-main,.date .site-main,.author .site-main,
.blog .site-main,.search .site-main{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;align-items:stretch}
.category .site-main > :not(article),.tag .site-main > :not(article),.date .site-main > :not(article),
.author .site-main > :not(article),.blog .site-main > :not(article),.search .site-main > :not(article){grid-column:1 / -1}
.category .site-main article,.tag .site-main article,.date .site-main article,
.author .site-main article,.blog .site-main article,.search .site-main article{margin-bottom:0}
@media(max-width:700px){
  .category .site-main,.tag .site-main,.date .site-main,.author .site-main,
  .blog .site-main,.search .site-main{grid-template-columns:1fr}
}

.efa-card{background:var(--efc-card);border:1px solid var(--efc-line);border-radius:var(--efc-radius);
  box-shadow:var(--efc-shadow);overflow:hidden;display:flex;flex-direction:column;
  transition:transform .12s,box-shadow .15s}
.efa-card:hover{transform:translateY(-3px);box-shadow:0 20px 52px rgba(9,63,78,.16)}
.efa-card__thumb{display:block;height:180px;flex:0 0 auto;
  background:linear-gradient(135deg,#cfe3ea,#a9cbd6);background-size:cover;background-position:center}
.efa-card__body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:8px;flex:1}
.efa-card__title{margin:0;font-size:18px;line-height:1.35;font-weight:700}
.efa-card__title a{color:var(--efc-ink);text-decoration:none}
.efa-card__title a:hover{color:var(--efc-teal)}
.efa-card__excerpt{margin:0;font-size:14px;color:var(--efc-muted);line-height:1.5}
.efa-card__more{margin-top:auto;padding-top:4px;font-weight:700;font-size:13.5px;color:var(--efc-teal)}

/* pagination: quiet pills in the brand palette */
.paging-navigation .nav-links{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.paging-navigation .page-numbers{background:#fff;border:1.5px solid var(--efc-line);border-radius:10px;
  padding:8px 14px;font-weight:700;font-size:14px;color:var(--efc-teal);text-decoration:none}
.paging-navigation a.page-numbers:hover{border-color:var(--efc-teal);text-decoration:none}
.paging-navigation .page-numbers.current{background:var(--efc-teal);border-color:var(--efc-teal);color:#fff}
.paging-navigation .page-numbers.dots{border:0;background:none;color:var(--efc-muted)}
/* country listings (/{country}/articles|expat-experiences/ via expatcat) render many
   articles on a PAGE body class; sibling selector fires only on multi-article pages */
/* stacked page listings only; :not(.efd-card) keeps it out of the destination
   template's card grids, where the margin made card 1 look taller than its row */
.page .site-main article + article:not(.efd-card),
.page .content-area article + article:not(.efd-card){margin-top:20px}
@media(max-width:768px){
  /* !important: GP re-zeroes these margins on mobile with rules we can't cleanly outrank */
  .separate-containers main.site-main{margin:2px 12px 14px !important}
  .separate-containers .inside-right-sidebar,.separate-containers .inside-left-sidebar{margin:0 12px 14px !important}
}
@media(min-width:769px){
  .separate-containers .site-main{margin:2px 24px 24px 0}
  .separate-containers .inside-right-sidebar{margin-top:2px;margin-bottom:24px}
  .separate-containers .inside-left-sidebar{margin-top:2px;margin-bottom:24px}
  .separate-containers .sidebar .widget{margin-bottom:24px}
}

/* ---- article card: white panel, soft corners, breathing room ------------- */
.separate-containers .inside-article,
.one-container .inside-article{background:var(--efc-card)}
.inside-article{border-radius:var(--efc-radius);box-shadow:var(--efc-shadow)}
.entry-content img,.inside-article .post-image img,.entry-content figure img{border-radius:12px}

/* ---- buttons: GP orange -> brand amber (matches .efd-btn--primary) ------- */
button:not([class*="efw"]):not([class*="efvf"]):not(.menu-toggle):not([class*="cmplz"]):not(.slideout-exit):not(.search-item),
html input[type="button"],input[type="reset"],input[type="submit"],
a.button,a.wp-block-button__link:not(.has-background){
  background-color:var(--efc-amber);color:#3a2700;border-radius:999px;font-weight:700}
button:not([class*="efw"]):not([class*="efvf"]):not(.menu-toggle):not([class*="cmplz"]):not(.slideout-exit):not(.search-item):hover,
button:not([class*="efw"]):not([class*="efvf"]):not(.menu-toggle):not([class*="cmplz"]):not(.slideout-exit):not(.search-item):focus,
html input[type="button"]:hover,input[type="reset"]:hover,input[type="submit"]:hover,
html input[type="button"]:focus,input[type="reset"]:focus,input[type="submit"]:focus,
a.button:hover,a.button:focus,
a.wp-block-button__link:not(.has-background):hover,a.wp-block-button__link:not(.has-background):focus{
  background-color:var(--efc-amber-dark);color:#3a2700}

/* ---- FOOTER: deep teal bookend (Jamie approved Option A, 2026-07-12) ------- */
.footer-widgets{background:linear-gradient(120deg,#093f4e 0%,#0e5a6e 100%);color:#fff}
.footer-widgets p,.footer-widgets li,.footer-widgets label{color:rgba(255,255,255,.92)}
.footer-widgets .widget-title,.footer-widgets h2{color:#ffd166;font-size:14px;font-weight:800;
  letter-spacing:.07em;text-transform:uppercase}
.footer-widgets a{color:rgba(255,255,255,.92)}
.footer-widgets a:hover,.footer-widgets a:focus{color:#ffd166}
.footer-widgets input[type="email"],.footer-widgets input[type="text"]{border-radius:999px;border:0;
  padding:12px 16px;background:#fff;color:var(--efc-ink)}
/* white (light-variant) logo on the dark footer; social SVG icons unaffected */
.footer-widgets img{filter:brightness(0) invert(1)}
.site-info{background:#072f3b;color:rgba(255,255,255,.72)}
.site-info a{color:rgba(255,255,255,.85)}
.site-info a:hover{color:#ffd166}

/* ---- HEADER NAV: teal links, amber hover (desktop + dropdowns + slideout) -- */
.main-navigation:not(.slideout-navigation) .main-nav a{color:var(--efc-teal-dark,#093f4e)}
.main-navigation:not(.slideout-navigation) .main-nav a:hover,
.main-navigation:not(.slideout-navigation) .main-nav a:focus,
.main-navigation:not(.slideout-navigation) .current-menu-item > a{color:var(--efc-amber-dark)}
/* hover: compact centred pill instead of the theme's full-height white slab.
   Pill lives on a ::before behind the link text (z-index:0 on the anchor keeps
   the -1 pseudo inside it); the anchor itself stays transparent. */
.main-navigation:not(.slideout-navigation) .main-nav > ul > li > a{
  background:transparent !important;position:relative;z-index:0}
.main-navigation:not(.slideout-navigation) .main-nav > ul > li > a::before{
  content:"";position:absolute;left:2px;right:2px;top:50%;transform:translateY(-50%);
  height:46px;border-radius:12px;background:transparent;z-index:-1;
  transition:background .15s ease}
.main-navigation:not(.slideout-navigation) .main-nav > ul > li > a:hover::before,
.main-navigation:not(.slideout-navigation) .main-nav > ul > li > a:focus::before,
.main-navigation:not(.slideout-navigation) .main-nav > ul > li:hover > a::before,
.main-navigation:not(.slideout-navigation) .main-nav > ul > li.sfHover > a::before,
.main-navigation:not(.slideout-navigation) .main-nav > ul > li.current-menu-item > a::before{
  background:rgba(14,90,110,.08)}
/* dropdown panel: brand cream, not stark white */
.main-navigation:not(.slideout-navigation) ul ul{background:var(--efc-cream,#fbf7f2);
  box-shadow:0 10px 26px rgba(9,63,78,.12);border-radius:0 0 10px 10px}
.main-navigation:not(.slideout-navigation) ul ul a{color:var(--efc-teal-dark,#093f4e)}
.main-navigation:not(.slideout-navigation) ul ul li > a:hover,
.main-navigation:not(.slideout-navigation) ul ul li:hover > a,
.main-navigation:not(.slideout-navigation) ul ul li.sfHover > a{
  background:rgba(14,90,110,.08) !important}
/* search icon (menu-bar-item, outside the menu ul): no white hover slab */
.main-navigation .menu-bar-item a,
.main-navigation .menu-bar-item a:hover,
.main-navigation .menu-bar-item a:focus,
.main-navigation .menu-bar-item:hover > a{background:transparent !important}
nav.slideout-navigation .main-nav li > a{color:var(--efc-teal) !important;
  font-size:17px !important;line-height:1.4 !important;padding:11px 0 11px 11px !important}
nav.slideout-navigation .main-nav li > a:hover,
nav.slideout-navigation .main-nav li > a:focus{color:var(--efc-amber-dark) !important}

/* ---- nav slideout / search controls: quiet icon buttons, never orange ----- */
nav.main-navigation button.slideout-exit,
nav.main-navigation button.slideout-exit:hover,
nav.main-navigation button.slideout-exit:focus,
nav.main-navigation .search-item,
nav.main-navigation .search-item:hover{
  background:transparent;color:var(--efc-teal);border-radius:0;box-shadow:none}
nav.main-navigation button.slideout-exit{width:auto;padding:10px 14px;text-align:left}

/* ---- mobile slide-out search box ------------------------------------------ */
.slideout-navigation .ef-slideout-search{margin:4px 14px 14px;padding:0}
.slideout-navigation .ef-slideout-search input[type="search"]{width:100%;padding:11px 16px;
  border:1.5px solid var(--efc-line);border-radius:999px;font-size:15px;background:#fff;
  color:var(--efc-ink);-webkit-appearance:none;appearance:none}
.slideout-navigation .ef-slideout-search input[type="search"]:focus{border-color:var(--efc-teal);outline:none}

/* ---- tool widgets embedded in page content: breathing room below ---------- */
.entry-content .efvf,.entry-content .efw{margin-bottom:48px}

/* ---- blockquotes + tables ------------------------------------------------ */
.entry-content blockquote{border-left:4px solid var(--efc-amber);background:var(--efc-bg);
  border-radius:0 10px 10px 0;padding:14px 18px;color:var(--efc-ink)}
.entry-content table{border-collapse:collapse;border-radius:10px;overflow:hidden}
.entry-content th{background:var(--efc-teal);color:#fff}
.entry-content tr:nth-child(even) td{background:var(--efc-bg)}

/* ---- sidebar widgets: card language -------------------------------------- */
.sidebar .widget{background:var(--efc-card);border:1px solid var(--efc-line);
  border-radius:var(--efc-radius);box-shadow:var(--efc-shadow)}
/* the widget IS the card: neutralise card styling baked into widget content
   (e.g. div.card.service-feature) so we never render cards within cards */
.sidebar .widget .card,.sidebar .widget .service-feature{background:transparent;
  border:0;box-shadow:none;border-radius:0}
/* spacer-only widgets were air for the OLD layout; the card margins space the
   sidebar now, so remove them from the flow entirely (they otherwise leave an
   oversized gap where the thin blank card used to render) */
.sidebar .widget:has(> .wp-block-spacer:only-child){display:none}
.sidebar .widget-title,.sidebar .widget h2{color:var(--efc-teal)}
.sidebar .widget a{color:var(--efc-teal)}
.sidebar .widget a:hover{color:var(--efc-teal-dark)}

/* ---- sidebar buttons: white text + the site's original orange (Jamie, 2026-07-12) */
.sidebar .widget input[type="submit"],.sidebar .widget input[type="button"],
.sidebar .widget a.button,.sidebar .widget button{color:#fff;background-color:#f98000}
.sidebar .widget input[type="submit"]:hover,.sidebar .widget input[type="button"]:hover,
.sidebar .widget a.button:hover,.sidebar .widget button:hover,
.sidebar .widget input[type="submit"]:focus,.sidebar .widget input[type="button"]:focus,
.sidebar .widget a.button:focus,.sidebar .widget button:focus{color:#fff;background-color:rgba(249,128,0,.83)}

/* ---- share-your-story CTA (after expat-experience interviews) ------------- */
.ef-share-cta{background:linear-gradient(120deg,var(--efc-teal) 0%,#14708a 100%);color:#fff;
  border-radius:16px;padding:26px 26px 24px;text-align:center;margin:32px 0 8px}
.ef-share-cta h2{color:#fff !important;font-size:22px;margin:0 0 8px}
.ef-share-cta p{color:rgba(255,255,255,.92);max-width:520px;margin:0 auto 16px}
.ef-share-cta a{display:inline-block;background:var(--efc-amber);color:#3a2700 !important;font-weight:700;
  border-radius:999px;padding:12px 24px;text-decoration:none}
.ef-share-cta a:hover,.ef-share-cta a:focus{background:var(--efc-amber-dark);color:#3a2700 !important}

/* ---- comments / meta ------------------------------------------------------ */
.entry-meta,.cat-links,.tags-links{color:var(--efc-muted)}
.comment-body{background:var(--efc-card);border:1px solid var(--efc-line);border-radius:var(--efc-radius)}

/* ---- "Keep reading" related cards on single posts (inc/ef-related-posts.php) --- */
.ef-related{margin-top:36px;padding-top:26px;border-top:1px solid var(--efc-line)}
.ef-related__t{font-size:22px;font-weight:800;letter-spacing:-.3px;margin:0 0 16px}
.ef-related__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ef-related .efa-card__thumb{height:130px}
.ef-related .efa-card__title{font-size:15.5px}
@media(max-width:700px){.ef-related__grid{grid-template-columns:1fr}}

/* ---- helpful dead-end (404 + empty search): content-404.php / no-results.php --- */
.ef-deadend{background:var(--efc-card);border:1px solid var(--efc-line);border-radius:var(--efc-radius);
  box-shadow:var(--efc-shadow);padding:44px 34px;text-align:center}
.ef-deadend h1{font-size:34px;font-weight:800;letter-spacing:-.5px;margin:0 0 10px;color:var(--efc-teal)}
.ef-deadend__lede{color:var(--efc-muted);font-size:16px;margin:0 auto 22px;max-width:520px}
.ef-deadend form{max-width:440px;margin:0 auto 30px;display:flex;gap:10px;align-items:stretch;justify-content:center}
.ef-deadend input[type="search"],.ef-deadend .search-field{flex:1;background:#fff;
  border:1.5px solid var(--efc-line);border-radius:10px;padding:12px 14px;color:var(--efc-ink);font:inherit}
.ef-deadend input[type="search"]:focus{border-color:var(--efc-teal);outline:none}
.ef-deadend .ef-deadend__links{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:12px;text-align:left}
.ef-deadend__links a{display:flex;flex-direction:column;gap:3px;padding:14px;border:1px solid var(--efc-line);
  border-radius:12px;background:#fff;text-decoration:none;color:inherit;transition:border-color .12s}
.ef-deadend__links a:hover{border-color:var(--efc-teal);text-decoration:none}
.ef-deadend__links b{font-size:15px;color:var(--efc-teal)}
.ef-deadend__links small{font-size:12.5px;color:var(--efc-muted);line-height:1.35}