/*
 * TWD native presentation. Ported from the approved static design
 * (assets/css/style.css + inner-pages.css). No Elementor dependency.
 */

:root { --cream:#fff9f2; --paper:#fffdf9; --ink:#252527; --teal:#167a78; --coral:#f2765d; --line:#efe4d9; --serif: Georgia, "Times New Roman", serif; --script:"Segoe Script","Brush Script MT",cursive; --sans:Arial,Helvetica,sans-serif; --ease-premium:cubic-bezier(.16,.84,.44,1); --ease-smooth:cubic-bezier(.4,0,.2,1); }

@keyframes twd-fade-up { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
@keyframes twd-scale-in { from { opacity:0; transform:scale(1.045); } to { opacity:1; transform:scale(1); } }

/* Baseline reset scoped so it does not fight the admin bar or block editor. */
body.twd-native { margin:0; color:var(--ink); background:var(--cream); font-family:var(--sans); }
body.twd-native * { box-sizing:border-box; }
body.twd-native a { color:inherit; text-decoration:none; }
body.twd-native button,body.twd-native input { font:inherit; }
body.twd-native button { cursor:pointer; }
body.twd-native img { display:block; max-width:100%; }
body.twd-native h1,body.twd-native h2,body.twd-native h3,body.twd-native p { margin-top:0; }
.twd-native .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.twd-native .skip-link { position:fixed; z-index:10; top:8px; inset-inline-start:8px; padding:8px 12px; color:#fff; background:var(--teal); transform:translateY(-140%); }
.twd-native .skip-link:focus { transform:translateY(0); }

/* Header */
.twd-native .site-header { position:relative; z-index:20; background:var(--cream); }
.twd-native .header-shell { position:relative; display:flex; width:calc(100% - 128px); margin:auto; padding:20px 0; align-items:center; justify-content:space-between; gap:32px; }
.twd-native .brand { display:flex; flex:0 0 auto; align-items:center; width:var(--twd-logo-width,140px); }
.twd-native .brand img { display:block; width:100%; height:auto; aspect-ratio:1155/925; object-fit:contain; }
.twd-native .primary-nav { display:flex; flex:0 0 auto; gap:48px; align-items:center; color:#242526; font-size:13px; }
.twd-native .primary-nav a { position:relative; white-space:nowrap; }
.twd-native .primary-nav a::after { position:absolute; right:0; bottom:-12px; left:0; height:1px; content:""; background:var(--coral); transform:scaleX(0); transform-origin:right; transition:transform .22s ease; }
.twd-native .primary-nav a.is-active,.twd-native .primary-nav .current-menu-item > a { color:#db715c; }
.twd-native .primary-nav a.is-active::after,.twd-native .primary-nav a:hover::after,.twd-native .primary-nav .current-menu-item > a::after { transform:scaleX(1); transform-origin:left; }
.twd-native .menu-toggle { display:none; }
.twd-native .menu-close { display:none; }
.twd-native .menu-overlay { opacity:0; pointer-events:none; transition:opacity .28s var(--ease-smooth); }
.twd-native .menu-overlay.is-open { opacity:1; pointer-events:auto; }
.twd-native .wishlist-link { position:relative; display:grid; width:40px; height:40px; margin-inline-start:2px; padding:0; color:var(--teal); background:#fffdf9; border:1px solid var(--line); border-radius:50%; place-items:center; transition:color .2s ease,background .2s ease,transform .2s ease; }
.twd-native .wishlist-link::after { display:none; }
.twd-native .wishlist-link:hover { color:var(--coral); background:#fff4ed; transform:translateY(-2px); }
.twd-native .wishlist-link svg { width:19px; fill:none; stroke:currentColor; stroke-width:1.8; }
.twd-native .wishlist-text { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.twd-native .wishlist-count { position:absolute; top:-5px; inset-inline-end:-6px; display:grid; min-width:18px; height:18px; padding:0 4px; color:#fff; background:var(--coral); border:2px solid var(--cream); border-radius:999px; font:700 10px/1 var(--sans); place-items:center; }
.twd-native .wishlist-count[hidden] { display:none; }
body.twd-native.menu-open { overflow:hidden; }

/* Hero */
.twd-native .hero { height:352px; overflow:hidden; background:var(--cream); }
.twd-native .hero-shell { position:relative; width:calc(100% - 128px); height:100%; margin:auto; }
.twd-native .hero-copy { position:absolute; z-index:1; top:13px; left:0; width:445px; }
.twd-native h1 { margin:0 0 15px; color:#222426; font:500 56px/.99 var(--serif); letter-spacing:-.037em; }
.twd-native .hero-copy h1 span { color:var(--teal); }
.twd-native .hero-copy h1 em { color:var(--coral); font:400 61px/.8 var(--script); letter-spacing:-.06em; font-style:normal; }
.twd-native .hero-copy > p:not(.search-status) { width:360px; margin-bottom:17px; color:#34363a; font-size:15px; line-height:1.62; }
.twd-native .hero-art-wrap { position:absolute; top:-66px; right:-70px; width:1020px; height:428px; isolation:isolate; }
.twd-native .hero-art-wrap::after { position:absolute; z-index:1; inset:-1px; content:""; pointer-events:none; background:linear-gradient(to right,var(--cream) 0%,transparent 9%,transparent 91%,var(--cream) 100%),linear-gradient(to bottom,var(--cream) 0%,transparent 14%,transparent 84%,var(--cream) 100%); }
.twd-native .hero-art { position:relative; z-index:0; width:100%; height:100%; object-fit:cover; mix-blend-mode:multiply; }
.twd-native .search-area { position:relative; width:445px; }
.twd-native .search-form { display:flex; align-items:center; width:100%; height:43px; padding:4px 5px 4px 16px; background:#fff; border:1px solid #efe8e0; border-radius:23px; box-shadow:0 3px 12px rgba(65,55,45,.12); transition:border-color .2s ease,box-shadow .2s ease; }
.twd-native .search-form:focus-within { border-color:#efb1a1; box-shadow:0 0 0 3px rgba(242,118,93,.11),0 3px 12px rgba(65,55,45,.12); }
.twd-native .search-form svg { width:18px; flex:0 0 auto; fill:none; stroke:#a6a6a3; stroke-width:2; }
.twd-native .search-form input { width:100%; min-width:0; padding:8px 12px; color:#444; background:transparent; border:0; outline:0; font-size:12px; }
.twd-native .search-form input::placeholder { color:#aaa8a4; }
.twd-native .search-form button { width:98px; height:34px; flex:0 0 auto; color:white; background:var(--coral); border:0; border-radius:18px; font-size:12px; box-shadow:0 2px 7px rgba(223,104,80,.24); }
.twd-native .search-form button:hover { background:#df684f; }
.twd-native .search-suggestions { position:absolute; z-index:4; top:49px; left:12px; width:calc(100% - 24px); overflow:hidden; background:#fffdf9; border:1px solid var(--line); border-radius:12px; box-shadow:0 10px 24px rgba(65,55,45,.13); }
.twd-native .search-suggestions a,.twd-native .search-suggestions button { display:block; width:100%; padding:8px 13px; color:#34363a; text-align:left; background:transparent; border:0; font-size:12px; }
.twd-native .search-suggestions a:hover,.twd-native .search-suggestions button:hover,.twd-native .search-suggestions button:focus-visible { color:var(--teal); background:#fff5ee; outline:0; }
.twd-native .search-status { min-height:16px; margin:5px 0 0; color:var(--teal); font-size:11px; }

/* Hero entrance: headline, supporting copy, and search stagger in on load; artwork gets a slight scale reveal. Skipped entirely under prefers-reduced-motion (final state is the default, unanimated layout above). */
@media (prefers-reduced-motion:no-preference) {
  .twd-native .hero-copy h1,.twd-native .hero-copy>p:not(.search-status),.twd-native .hero-copy .search-area { opacity:0; animation:twd-fade-up .8s var(--ease-premium) forwards; }
  .twd-native .hero-copy h1 { animation-delay:.05s; }
  .twd-native .hero-copy>p:not(.search-status) { animation-delay:.2s; }
  .twd-native .hero-copy .search-area { animation-delay:.34s; }
  .twd-native .hero-art-wrap { opacity:0; animation:twd-scale-in 1s var(--ease-premium) forwards; animation-delay:.15s; }
}

/* Country cards */
.twd-native .countries-section { padding:5px 52px 16px; background:var(--cream); }
.twd-native .countries-section > h2 { margin:0 0 10px 12px; color:#242426; font:500 26px/1.1 var(--serif); letter-spacing:-.03em; }
.twd-native .country-grid { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:12px; }
.twd-native .country-card { display:flex; min-width:0; height:343px; flex-direction:column; align-items:center; overflow:hidden; padding:10px 12px 14px; cursor:pointer; text-align:center; background:rgba(255,253,249,.88); border:1px solid #f1e7dd; border-radius:20px; box-shadow:0 5px 13px rgba(85,75,65,.035); transition:transform .34s var(--ease-premium),box-shadow .34s var(--ease-premium),border-color .34s var(--ease-premium); }
.twd-native .country-card > img { width:100%; height:159px; margin-bottom:5px; object-fit:cover; mix-blend-mode:multiply; transition:transform .5s var(--ease-smooth); }
.twd-native .country-card:hover { border-color:#ecd8cb; box-shadow:0 20px 34px rgba(85,75,65,.15); transform:translateY(-6px); }
.twd-native .country-card:hover > img { transform:scale(1.045); }
.twd-native .country-card.is-match { border-color:rgba(242,118,93,.72); box-shadow:0 0 0 3px rgba(242,118,93,.13),0 13px 24px rgba(85,75,65,.10); }
.twd-native .country-card h3 { min-height:38px; margin:0 0 5px; color:#242426; font:500 21px/1.05 var(--serif); letter-spacing:-.035em; }
.twd-native .country-card p { min-height:59px; margin:0; color:#45464a; font-size:11px; line-height:1.55; }
.twd-native .country-card a { display:flex; align-items:center; justify-content:space-between; width:116px; min-height:31px; margin-top:auto; padding:0 13px 0 15px; color:#fff; background:var(--coral); border-radius:17px; font-size:11px; transition:background .28s var(--ease-smooth),box-shadow .28s var(--ease-smooth),transform .28s var(--ease-smooth); }
.twd-native .country-card a span { font-size:20px; font-weight:300; line-height:1; transition:transform .28s var(--ease-smooth); }
.twd-native .country-card a:hover { background:#df684f; box-shadow:0 6px 14px rgba(223,104,80,.26); transform:translateY(-1px); }
.twd-native .country-card a:hover span { transform:translateX(5px); }

/*
 * Directory landing ( /directory/ ) country grid — visually identical to the
 * homepage grid above by default, but a distinct class/ruleset entirely so
 * it can be resized independently (Appearance -> TWD Design Settings) without
 * ever touching the approved homepage layout in .country-grid/.country-card.
 */
.twd-native .directory-country-grid { display:grid; grid-template-columns:repeat(var(--twd-directory-cols-desktop,4),minmax(0,1fr)); gap:var(--twd-grid-gap,12px); }
.twd-native .about-steps-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.twd-native .directory-country-card { display:flex; min-width:0; height:343px; flex-direction:column; align-items:center; overflow:hidden; padding:10px 12px 14px; cursor:pointer; text-align:center; background:rgba(255,253,249,.88); border:1px solid #f1e7dd; border-radius:var(--twd-card-radius,20px); box-shadow:0 5px 13px rgba(85,75,65,.035); transition:transform .34s var(--ease-premium),box-shadow .34s var(--ease-premium),border-color .34s var(--ease-premium); }
.twd-native .directory-country-card > img { width:100%; height:var(--twd-card-image-height,159px); margin-bottom:5px; object-fit:cover; mix-blend-mode:multiply; transition:transform .5s var(--ease-smooth); }
.twd-native .directory-country-card:hover { border-color:#ecd8cb; box-shadow:0 20px 34px rgba(85,75,65,.15); transform:translateY(-6px); }
.twd-native .directory-country-card:hover > img { transform:scale(1.045); }
.twd-native .directory-country-card h3 { min-height:38px; margin:0 0 5px; color:#242426; font:500 21px/1.05 var(--serif); letter-spacing:-.035em; }
.twd-native .directory-country-card p { min-height:59px; margin:0; color:#45464a; font-size:11px; line-height:1.55; }
.twd-native .directory-country-card a { display:flex; align-items:center; justify-content:space-between; width:116px; min-height:31px; margin-top:auto; padding:0 13px 0 15px; color:#fff; background:var(--coral); border-radius:17px; font-size:11px; transition:background .28s var(--ease-smooth),box-shadow .28s var(--ease-smooth),transform .28s var(--ease-smooth); }
.twd-native .directory-country-card a span { font-size:20px; font-weight:300; line-height:1; transition:transform .28s var(--ease-smooth); }
.twd-native .directory-country-card a:hover { background:#df684f; box-shadow:0 6px 14px rgba(223,104,80,.26); transform:translateY(-1px); }
.twd-native .directory-country-card a:hover span { transform:translateX(5px); }
.twd-native .directory-country-card a:active { transform:translateY(0) scale(.97); }
@media (max-width:1100px) { .twd-native .directory-country-grid { grid-template-columns:repeat(var(--twd-directory-cols-tablet,3),minmax(0,1fr)); } }
@media (max-width:700px) { .twd-native .directory-country-grid { grid-template-columns:repeat(var(--twd-directory-cols-mobile,2),minmax(0,1fr)); } }

/* Category cards + featured places (ported from inner-pages.css) */
.twd-native .home-section { width:min(var(--twd-container-width,1180px),calc(100% - 104px)); margin:0 auto; padding:34px 0 4px; }
.twd-native .home-section > h2 { margin:0 0 20px; color:#283535; font:500 clamp(30px,3.4vw,42px)/1 var(--serif); letter-spacing:-.04em; }
.twd-native .category-directory-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; }
.twd-native .directory-category-card { display:flex; min-height:230px; padding:0 0 22px; flex-direction:column; overflow:hidden; background:#fffdf9; border:1px solid var(--line); border-radius:20px; box-shadow:0 8px 22px rgba(74,71,60,.04); transition:transform .34s var(--ease-premium),box-shadow .34s var(--ease-premium),border-color .34s var(--ease-premium); }
.twd-native .directory-category-card:hover { border-color:#ead4c6; box-shadow:0 20px 36px rgba(74,71,60,.13); transform:translateY(-6px); }
.twd-native .directory-category-card > img { width:100%; height:120px; margin-bottom:16px; object-fit:cover; mix-blend-mode:multiply; transition:transform .5s var(--ease-smooth); }
.twd-native .directory-category-card:hover > img { transform:scale(1.04); }
.twd-native .directory-category-card h3 { margin:0 22px 7px; color:var(--teal); font:500 25px/1.05 var(--serif); }
.twd-native .directory-category-card p { margin:0 22px 16px; color:#71807d; font-size:12px; line-height:1.55; }
.twd-native .directory-category-card b { margin:auto 22px 0; color:var(--coral); font-size:11px; }

.twd-native .featured-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.twd-native .place-card { overflow:hidden; background:#fffdf9; border:1px solid var(--line); border-radius:22px; box-shadow:0 10px 26px rgba(70,68,58,.07); transition:transform .34s var(--ease-premium),box-shadow .34s var(--ease-premium); }
.twd-native .place-card:hover { box-shadow:0 24px 40px rgba(70,68,58,.16); transform:translateY(-6px); }
.twd-native .place-image { position:relative; height:228px; overflow:hidden; background:#eee9df; }
.twd-native .place-image > img { width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease-smooth); }
.twd-native .place-card:hover .place-image > img { transform:scale(1.055); }
.twd-native .place-image > span { position:absolute; top:13px; inset-inline-start:13px; padding:5px 9px; color:var(--teal); background:rgba(255,253,249,.94); border-radius:999px; font-size:10px; font-weight:800; }
.twd-native .favorite-button { position:absolute; top:11px; inset-inline-end:11px; display:grid; width:40px; height:40px; padding:0; color:var(--teal); background:rgba(255,255,255,.95); border:1px solid rgba(255,255,255,.9); border-radius:50%; box-shadow:0 5px 13px rgba(36,45,42,.13); place-items:center; transition:color .24s var(--ease-smooth),background .24s var(--ease-smooth),transform .24s var(--ease-smooth); }
.twd-native .favorite-button:hover { color:var(--coral); transform:translateY(-2px) scale(1.05); }
.twd-native .favorite-button svg { width:19px; fill:none; stroke:currentColor; stroke-width:1.8; }
.twd-native .favorite-button.is-saved { color:var(--coral); background:#fff0eb; }
.twd-native .favorite-button.is-saved svg { fill:currentColor; }
.twd-native .place-content { position:relative; min-height:150px; padding:18px 19px 20px; }
.twd-native .place-content > p { margin:0 0 4px; color:var(--teal); font-size:10px; font-weight:800; }
.twd-native .place-content h2 { margin:0 0 4px; color:#283433; font:500 25px/1.08 var(--serif); letter-spacing:-.035em; }
.twd-native .place-city { color:#87918f; font-size:11px; }

/* Scroll entrance for cards (JS toggles .is-visible via IntersectionObserver; skipped entirely under prefers-reduced-motion). Soft fade + rise + scale, premium easing. */
.twd-native .twd-entrance { opacity:0; transform:translateY(22px) scale(.97); transition:opacity .65s var(--ease-premium),transform .65s var(--ease-premium); }
.twd-native .twd-entrance.is-visible { opacity:1; transform:translateY(0) scale(1); }

/* Directory-page intro: breadcrumb + title fade up on load, ahead of the card stagger below. */
@media (prefers-reduced-motion:no-preference) {
  .twd-native .breadcrumbs,.twd-native .inner-title,.twd-native .inner-hero,.twd-native .inner-heading { opacity:0; animation:twd-fade-up .6s var(--ease-premium) forwards; }
  .twd-native .breadcrumbs { animation-delay:0s; }
  .twd-native .inner-title,.twd-native .inner-hero { animation-delay:.08s; }
  .twd-native .inner-heading { animation-delay:.05s; }
}

/* Subtle button-press feedback, layered on top of the existing hover states. */
.twd-native .country-card a,.twd-native .search-form button,.twd-native .wishlist-link,.twd-native .favorite-button { transition:background .24s var(--ease-smooth),box-shadow .24s var(--ease-smooth),transform .24s var(--ease-smooth),color .24s var(--ease-smooth); }
.twd-native .country-card a:active,.twd-native .search-form button:active { transform:translateY(0) scale(.97); }

/* Footer */
.twd-native .site-footer { margin-top:46px; padding:40px 0 34px; background:#fff5ec; border-top:1px solid var(--line); }
.twd-native .footer-shell { display:flex; width:min(var(--twd-container-width,1180px),calc(100% - 104px)); margin:0 auto; gap:24px; align-items:center; justify-content:space-between; flex-wrap:wrap; }
.twd-native .footer-shell img { width:150px; height:auto; }
.twd-native .footer-nav { display:flex; gap:26px; color:#5c6a68; font-size:13px; }
.twd-native .footer-nav a:hover { color:var(--coral); }
.twd-native .site-footer small { display:block; width:100%; margin-top:18px; color:#8a9491; font-size:11px; text-align:center; }

.twd-native :focus-visible { outline:3px solid #f1a56e; outline-offset:3px; }

@media (max-width:1100px) {
  .twd-native .header-shell,.twd-native .hero-shell{width:calc(100% - 64px)}
  .twd-native .brand{width:112px}
  .twd-native .primary-nav{gap:28px}
  .twd-native .hero{height:auto;min-height:360px}
  .twd-native .hero-copy{top:30px;width:42%}
  .twd-native h1{font-size:44px}
  .twd-native .hero-art-wrap{top:4px;right:-18px;width:60%;height:auto;aspect-ratio:934/403}
  .twd-native .countries-section{padding-inline:32px}
  .twd-native .country-grid{grid-template-columns:repeat(4,1fr);gap:16px}
  .twd-native .country-card{height:330px}
  .twd-native .country-card>img{height:175px}
  .twd-native .category-directory-grid{grid-template-columns:repeat(3,1fr)}
  .twd-native .featured-grid{grid-template-columns:repeat(2,1fr)}
  .twd-native .about-steps-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:700px) {
  .twd-native .header-shell{padding:14px 0}
  .twd-native .header-shell,.twd-native .hero-shell{width:calc(100% - 30px)}
  .twd-native .brand{width:var(--twd-logo-width-mobile,100px)}
  .twd-native .menu-toggle{position:absolute;z-index:41;top:34px;inset-inline-end:0;display:block;width:41px;height:41px;padding:8px;background:transparent;border:1px solid #eadfd4;border-radius:12px}
  .twd-native .menu-toggle span:not(.sr-only){display:block;width:19px;height:2px;margin:4px auto;background:var(--teal)}
  .twd-native .menu-overlay{position:fixed;z-index:38;inset:0;background:rgba(21,42,41,.28);backdrop-filter:blur(2px)}
  .twd-native .primary-nav{position:fixed;z-index:42;top:0;inset-inline-end:0;inset-inline-start:auto;display:flex;width:min(320px,calc(100% - 48px));height:100dvh;padding:82px 24px 28px;gap:0;align-items:stretch;flex-direction:column;background:#fffaf3;border:0;border-radius:0;box-shadow:-18px 0 40px rgba(40,50,46,.16);opacity:0;transform:translateX(24px);visibility:hidden;pointer-events:none;transition:transform .32s var(--ease-premium),opacity .28s var(--ease-premium),visibility .32s var(--ease-premium)}
  .twd-native .primary-nav.is-open{opacity:1;transform:translateX(0);visibility:visible;pointer-events:auto}
  .twd-native .menu-close{position:absolute;top:24px;inset-inline-end:22px;display:grid;width:42px;height:42px;padding:0;color:var(--teal);background:#fff;border:1px solid var(--line);border-radius:50%;font:300 28px/1 var(--sans);place-items:center}
  .twd-native .primary-nav > a{display:flex;min-height:52px;padding:13px 4px;align-items:center;border-bottom:1px solid #eee2d5;font-size:16px}
  .twd-native .primary-nav a::after{bottom:8px}
  .twd-native .primary-nav .wishlist-link{width:100%;height:56px;margin:12px 0 0;padding:0 15px;justify-content:flex-start;grid-template-columns:24px 1fr auto;gap:10px;background:#fff3eb;border-radius:14px;border:1px solid #f0d9cc}
  .twd-native .wishlist-link svg{width:21px}
  .twd-native .wishlist-text{position:static;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal;font-weight:700}
  .twd-native .wishlist-count{position:static;border:0}
  .twd-native .hero{min-height:0;height:auto;padding:35px 0 22px}
  .twd-native .hero-shell{display:flex;flex-direction:column}
  .twd-native .hero-copy{position:relative;top:auto;width:100%}
  .twd-native h1{font-size:44px}
  .twd-native .hero-copy>p:not(.search-status){width:auto;font-size:14px}
  .twd-native .hero-art-wrap{position:relative;top:auto;right:auto;width:100%;height:auto;aspect-ratio:934/403;margin-top:13px}
  .twd-native .search-area{width:100%}
  .twd-native .search-form{width:100%;height:48px}
  .twd-native .search-form button{width:76px;height:37px}
  .twd-native .countries-section{padding:20px 15px 28px}
  .twd-native .countries-section>h2{margin-inline-start:0;font-size:27px}
  .twd-native .country-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .twd-native .country-card{height:300px;padding:9px 10px 12px;border-radius:17px}
  .twd-native .country-card>img{height:140px}
  .twd-native .country-card h3{font-size:19px}
  .twd-native .country-card p{font-size:10px}
  .twd-native .country-card a{width:104px;min-height:29px;font-size:10px}
  .twd-native .home-section{width:calc(100% - 30px);padding-top:24px}
  .twd-native .category-directory-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .twd-native .about-steps-grid{grid-template-columns:1fr;gap:14px}
  .twd-native .about-cta-button{width:100%;justify-content:center}
  .twd-native .directory-category-card{min-height:200px}
  .twd-native .directory-category-card > img{height:96px;margin-bottom:12px}
  .twd-native .directory-category-card h3{margin:0 14px 6px;font-size:18px}
  .twd-native .directory-category-card p{margin:0 14px 14px}
  .twd-native .directory-category-card b{margin:auto 14px 0}
  .twd-native .featured-grid{grid-template-columns:1fr;gap:16px}
  .twd-native .footer-shell{flex-direction:column;text-align:center}
}
@media (max-width:390px) {
  .twd-native h1{font-size:41px}
  .twd-native .country-card>img{height:128px}
  .twd-native .country-card{height:291px}
  .twd-native .country-card h3{font-size:18px}
}
/* Inner pages: directory, place detail, favorites, about (ported from inner-pages.css) */
.twd-native.twd-inner .site-header { border-bottom:1px solid rgba(239,228,217,.78); }
.twd-native .inner-main { width:min(var(--twd-container-width,1180px),calc(100% - 48px)); margin:0 auto; padding:28px 0 70px; }
.twd-native .breadcrumbs { display:flex; min-height:32px; margin-bottom:24px; gap:9px; align-items:center; color:#758280; font-size:12px; flex-wrap:wrap; }
.twd-native .breadcrumbs a { color:var(--teal); font-weight:700; }
.twd-native .breadcrumbs strong { color:#4c5b59; font-weight:600; }
.twd-native .section-kicker { margin:0 0 8px; color:var(--teal); font-size:10px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.twd-native .inner-hero { display:grid; min-height:300px; padding:42px 50px; overflow:hidden; grid-template-columns:minmax(0,.9fr) minmax(300px,1.1fr); gap:44px; align-items:center; background:#fff5ec; border:1px solid var(--line); border-radius:28px; box-shadow:0 15px 34px rgba(74,71,60,.07); }
.twd-native .inner-hero h1,.twd-native .inner-title h1 { margin:0 0 14px; color:#253332; font:500 clamp(38px,4.6vw,60px)/1.02 var(--serif); letter-spacing:-.04em; }
.twd-native .inner-hero p:not(.section-kicker),.twd-native .inner-title>p:not(.section-kicker) { max-width:570px; margin-bottom:0; color:#687875; font-size:15px; line-height:1.7; }
.twd-native .inner-hero img { width:100%; max-height:260px; object-fit:contain; mix-blend-mode:multiply; }
.twd-native .about-hero { grid-template-columns:minmax(0,1fr) minmax(360px,.9fr); }
.twd-native .about-hero img { max-height:280px; }
.twd-native .directory-section { padding-top:var(--twd-section-space,48px); }
.twd-native .term-long-content { max-width:720px; color:#4c5b59; font-size:15px; line-height:1.75; }
.twd-native .term-long-content p { margin:0 0 16px; }
.twd-native .inner-heading { margin-bottom:22px; }
.twd-native .inner-heading h2 { margin:0; color:#283535; font:500 clamp(28px,3.6vw,42px)/1 var(--serif); letter-spacing:-.04em; }
.twd-native .inner-title { margin:4px 0 30px; }
.twd-native .twd-404 { padding:60px 0 40px; text-align:center; }
.twd-native .twd-404 p:not(.section-kicker) { margin:0 auto 26px; }
.twd-native .twd-404 .about-cta-button { display:inline-flex; }

/* About Us: how-it-works steps + closing CTA (grid-template-columns lives earlier in this file, alongside every other responsive grid, so the max-width:700px/1100px overrides below win the cascade instead of being overridden back by this later block). */
.twd-native .about-step { padding:28px 24px; background:#fffdf9; border:1px solid var(--line); border-radius:20px; box-shadow:0 8px 22px rgba(74,71,60,.04); transition:transform .34s var(--ease-premium),box-shadow .34s var(--ease-premium),border-color .34s var(--ease-premium); }
.twd-native .about-step:hover { border-color:#ead4c6; box-shadow:0 18px 32px rgba(74,71,60,.1); transform:translateY(-5px); }
.twd-native .about-step-number { display:block; margin-bottom:10px; color:var(--coral); font:500 20px/1 var(--serif); letter-spacing:.02em; }
.twd-native .about-step h3 { margin:0 0 8px; color:var(--teal); font:500 22px/1.1 var(--serif); }
.twd-native .about-step p { margin:0; color:#71807d; font-size:13px; line-height:1.6; }
.twd-native .about-cta { display:flex; margin-top:36px; justify-content:center; }
.twd-native .about-cta-button { display:inline-flex; align-items:center; gap:8px; padding:15px 30px; color:#fff; background:var(--coral); border-radius:999px; font-size:13px; font-weight:700; letter-spacing:.02em; transition:background .28s var(--ease-smooth),box-shadow .28s var(--ease-smooth),transform .28s var(--ease-smooth); }
.twd-native .about-cta-button span { transition:transform .28s var(--ease-smooth); }
.twd-native .about-cta-button:hover { background:#df684f; box-shadow:0 8px 18px rgba(223,104,80,.28); transform:translateY(-2px); }
.twd-native .about-cta-button:hover span { transform:translateX(5px); }

.twd-native .places-directory-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.twd-native .place-card .place-content h2 { font-size:23px; }
.twd-native .place-card .place-content h2 a { color:inherit; }
.twd-native .place-card .place-content h2 a:hover { color:var(--teal); }
.twd-native .place-actions { display:flex; margin-top:16px; gap:10px; align-items:center; }
.twd-native .place-actions a { display:grid; width:44px; height:44px; color:var(--coral); background:#fff6f0; border:1px solid #eedbd0; border-radius:50%; place-items:center; transition:color .2s ease,background .2s ease,transform .2s ease; }
.twd-native .place-actions a:hover { color:#fff; background:var(--teal); border-color:var(--teal); transform:translateY(-2px); }
.twd-native .place-actions svg { width:19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.twd-native .place-actions .twd-action-label { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.twd-native .favorite-button.is-inline { position:static; margin-inline-start:auto; }

/* Place-detail actions row, rendered by twd-core's [twd_place_actions] shortcode (Maps/Call/Save, plain text markup). */
.twd-native .twd-place-actions { display:flex; margin:18px 0; gap:10px; flex-wrap:wrap; align-items:center; }
.twd-native .twd-place-actions a,
.twd-native .twd-place-actions button.twd-wishlist-toggle { display:inline-flex; align-items:center; padding:11px 22px; color:var(--teal); background:#fff; border:1px solid var(--line); border-radius:999px; font-size:12px; font-weight:800; letter-spacing:.02em; cursor:pointer; transition:color .2s ease,background .2s ease,border-color .2s ease; }
.twd-native .twd-place-actions a:hover,
.twd-native .twd-place-actions button.twd-wishlist-toggle:hover { color:#fff; background:var(--teal); border-color:var(--teal); }
.twd-native .twd-place-actions button.twd-wishlist-toggle.is-saved { color:#fff; background:var(--coral); border-color:var(--coral); }

.twd-native .twd-empty-state { max-width:620px; margin:30px auto; padding:40px 28px; text-align:center; color:#687875; background:#fff9f3; border:1px solid var(--line); border-radius:20px; }
.twd-native .wishlist-empty { max-width:620px; margin:40px auto; padding:55px 30px; text-align:center; background:#fff9f3; border:1px solid var(--line); border-radius:24px; }
.twd-native .wishlist-empty>span { display:block; margin-bottom:8px; color:var(--coral); font:300 56px/1 var(--serif); }
.twd-native .wishlist-empty h2 { margin:0 0 8px; color:#283433; font:500 34px/1.1 var(--serif); }
.twd-native .wishlist-empty p { margin:0 0 22px; color:#71807d; }
.twd-native .wishlist-empty a { display:inline-flex; padding:10px 18px; color:#fff; background:var(--coral); border-radius:999px; font-size:12px; font-weight:800; }

/* Place-detail gallery */
.twd-native .twd-gallery { position:relative; margin-bottom:26px; overflow:hidden; border-radius:22px; background:#eee9df; }
.twd-native .twd-gallery-track { position:relative; height:min(60vh,480px); }
.twd-native .twd-gallery-track figure { position:absolute; inset:0; margin:0; }
.twd-native [data-twd-gallery] .twd-gallery-track figure { opacity:0; transition:opacity .5s var(--ease-smooth); pointer-events:none; }
.twd-native [data-twd-gallery] .twd-gallery-track figure.is-active { z-index:1; opacity:1; pointer-events:auto; }
.twd-native .twd-gallery-track img { width:100%; height:100%; object-fit:cover; }
.twd-native .twd-gallery button[data-twd-gallery-prev],.twd-native .twd-gallery button[data-twd-gallery-next] { position:absolute; top:50%; z-index:2; display:grid; width:42px; height:42px; padding:0; color:var(--teal); background:rgba(255,255,255,.92); border:1px solid var(--line); border-radius:50%; transform:translateY(-50%); place-items:center; font-size:20px; }
.twd-native .twd-gallery button[data-twd-gallery-prev] { left:14px; }
.twd-native .twd-gallery button[data-twd-gallery-next] { right:14px; }
.twd-native .twd-gallery button[hidden] { display:none; }
.twd-native .twd-place-excerpt { max-width:640px; color:#45464a; font-size:15px; line-height:1.65; }
.twd-native .twd-place-content { max-width:720px; margin:14px 0; color:#45464a; font-size:15px; line-height:1.7; }
.twd-native .twd-place-taxonomy-meta { display:flex; flex-wrap:wrap; gap:18px 28px; margin:18px 0; padding:16px 20px; background:#fff5ec; border:1px solid var(--line); border-radius:16px; }
.twd-native .twd-place-taxonomy-meta div { display:flex; gap:6px; align-items:baseline; }
.twd-native .twd-place-taxonomy-meta dt { margin:0; color:var(--teal); font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.twd-native .twd-place-taxonomy-meta dd { margin:0; color:#283433; font-size:13px; font-weight:600; }
.twd-native .twd-place-address { color:#45464a; font-size:14px; }
.twd-native .twd-place-external-links { display:flex; margin-top:18px; gap:12px; }
.twd-native .twd-place-external-links a { display:inline-flex; padding:10px 18px; color:var(--teal); background:#fff; border:1px solid var(--line); border-radius:999px; font-size:12px; font-weight:800; transition:color .2s ease,background .2s ease; }
.twd-native .twd-place-external-links a:hover { color:#fff; background:var(--teal); }

/* Directory selection grids reuse .category-directory-grid / .directory-category-card */
.twd-native .region-directory-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }

/* Universal search results (data-twd-search contract from twd-core) */
.twd-native .twd-search-results { position:absolute; z-index:60; top:49px; inset-inline-start:12px; width:calc(100% - 24px); max-height:340px; overflow-y:auto; background:#fffdf9; border:1px solid var(--line); border-radius:12px; box-shadow:0 10px 24px rgba(65,55,45,.13); }
.twd-native .twd-search-results a { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 13px; color:#34363a; text-align:start; background:transparent; border:0; border-bottom:1px solid #f4ece2; font-size:12px; }
.twd-native .twd-search-results a:last-of-type { border-bottom:0; }
.twd-native .twd-search-results a[hidden] { display:none; }
.twd-native .twd-search-results a:hover,.twd-native .twd-search-results a:focus-visible { color:var(--teal); background:#fff5ee; outline:0; }
.twd-native .twd-search-results a small { flex:0 0 auto; padding:2px 8px; color:#8a9491; background:#f4ece2; border-radius:999px; font-size:9px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.twd-native .twd-search-empty { margin:0; padding:12px 13px; color:#8a9491; font-size:12px; }

@media (max-width:950px) {
  .twd-native .inner-hero,.twd-native .about-hero { grid-template-columns:1fr 1fr; padding:35px; }
  .twd-native .category-directory-grid,.twd-native .region-directory-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .twd-native .places-directory-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:700px) {
  .twd-native .inner-main { width:calc(100% - 30px); padding-top:18px; }
  .twd-native .breadcrumbs { margin-bottom:15px; }
  .twd-native .inner-hero,.twd-native .about-hero { min-height:0; padding:26px 22px; grid-template-columns:1fr; gap:20px; border-radius:21px; }
  .twd-native .inner-hero h1,.twd-native .inner-title h1 { font-size:38px; }
  .twd-native .inner-hero img { max-height:210px; }
  .twd-native .directory-section { padding-top:34px; }
  .twd-native .category-directory-grid,.twd-native .region-directory-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .twd-native .places-directory-grid { grid-template-columns:1fr; gap:16px; }
  .twd-native .wishlist-empty { margin:20px auto; padding:40px 20px; }
  .twd-native .twd-gallery-track { height:60vw; }
}
@media (prefers-reduced-motion:reduce) { .twd-native *,.twd-native *::before,.twd-native *::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important} }

/* TWD Design Settings -> Motion level: "Off" mirrors the reduced-motion override unconditionally (independent of the visitor's own OS preference). "Subtle" keeps motion but shortens distance/stagger via the JS-read twdMotion.level global (see twd-native.js) rather than duplicating every transition here. */
body.twd-motion-off.twd-native *,body.twd-motion-off.twd-native *::before,body.twd-motion-off.twd-native *::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; }

/* "Subtle": keep motion, but collapse the stagger — everything settles together, quickly, rather than in a staggered sequence. Per-card scroll-entrance stagger is reduced in JS (see initScrollEntrance). */
body.twd-motion-subtle.twd-native .hero-copy h1,body.twd-motion-subtle.twd-native .hero-copy>p:not(.search-status),body.twd-motion-subtle.twd-native .hero-copy .search-area,body.twd-motion-subtle.twd-native .hero-art-wrap,body.twd-motion-subtle.twd-native .breadcrumbs,body.twd-motion-subtle.twd-native .inner-title,body.twd-motion-subtle.twd-native .inner-hero,body.twd-motion-subtle.twd-native .inner-heading { animation-duration:.3s!important; animation-delay:0s!important; }