/* =========================================================
   AWESOME KRABI — style.css
   Design tokens derived from the site logo (limestone teal,
   sunrise gold, longtail-boat coral).
   ========================================================= */

:root{
  /* ---- Brand palette ---- */
  --teal-900:#0A3E49;
  --teal-800:#0B4F5C;
  --teal-700:#0E7A8C;
  --teal-600:#128A9E;
  --teal-500:#14A6BB;
  --teal-300:#7FD4DE;
  --teal-100:#E3F6F7;
  --teal-50:#F2FBFB;

  --coral-600:#D85A2A;
  --coral-500:#F2733C;
  --coral-100:#FDE3D5;

  --gold-600:#C9880A;
  --gold-500:#F7A801;
  --gold-300:#FFCF4E;
  --gold-100:#FFF2D2;

  --green-600:#5D7A2C;
  --green-500:#7A9B3E;

  --sand-50:#FFFBF4;
  --sand-100:#FCF3E4;
  --ink-900:#102C33;
  --ink-700:#26454C;
  --ink-500:#4C6B71;
  --ink-300:#8AA3A7;
  --white:#FFFFFF;

  /* ---- Type ---- */
  --font-display:"Fraunces", "Iowan Old Style", Georgia, serif;
  --font-body:"Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, sans-serif;

  /* ---- Layout ---- */
  --max-w: 1180px;
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --shadow-card: 0 10px 30px -12px rgba(10,62,73,.25);
  --shadow-pop: 0 18px 40px -14px rgba(10,62,73,.35);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink-900);
  background:var(--sand-50);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:var(--teal-700);text-decoration:none;}
a:hover{color:var(--coral-600);}
h1,h2,h3,h4{
  font-family:var(--font-display);
  color:var(--teal-900);
  line-height:1.12;
  margin:0 0 .5em;
  font-weight:600;
}
h1{font-size:clamp(2.1rem,4.4vw,3.4rem);font-weight:600;}
h2{font-size:clamp(1.5rem,2.6vw,2.15rem);}
h3{font-size:1.28rem;}
p{margin:0 0 1.1em;}
ul,ol{padding-left:1.3em;}
.container{max-width:var(--max-w);margin:0 auto;padding:0 24px;}

/* Focus visibility */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{
  outline:3px solid var(--gold-500);
  outline-offset:2px;
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}
}

/* ---------------- Skip link ---------------- */
.skip-link{
  position:absolute;left:-999px;top:auto;background:var(--teal-900);color:#fff;
  padding:12px 18px;border-radius:0 0 8px 0;z-index:999;
}
.skip-link:focus{left:0;top:0;}

/* ---------------- Top bar ---------------- */
.topbar{
  background:var(--teal-900);
  color:var(--teal-100);
  font-size:.82rem;
}
.topbar .container{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:7px;padding-bottom:7px;gap:12px;flex-wrap:wrap;
}
.topbar a{color:var(--teal-100);}
.topbar a:hover{color:var(--gold-300);}
.lang-strip{display:flex;gap:14px;align-items:center;}
.lang-strip .current{color:#fff;font-weight:600;}

/* ---------------- Header / nav ---------------- */
.site-header{
  background:var(--white);
  border-bottom:1px solid #EAE3D3;
  position:sticky;top:0;z-index:100;
}
.site-header .container{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:12px;padding-bottom:12px;gap:20px;
}
.brand{display:flex;align-items:center;gap:10px;}
.brand img{height:46px;width:auto;}
.brand-fallback{
  font-family:var(--font-display);font-weight:700;font-size:1.4rem;color:var(--teal-800);
}

.main-nav{display:flex;align-items:center;gap:6px;}
.main-nav ul{list-style:none;display:flex;gap:2px;margin:0;padding:0;align-items:center;}
.main-nav a{
  display:inline-block;padding:10px 14px;border-radius:99px;
  font-weight:600;font-size:.96rem;color:var(--ink-700);
}
.main-nav a:hover, .main-nav a[aria-current="page"]{
  background:var(--teal-100);color:var(--teal-800);
}
.nav-cta{
  background:var(--coral-500)!important;color:#fff!important;padding:10px 18px!important;
  box-shadow:var(--shadow-card);
}
.nav-cta:hover{background:var(--coral-600)!important;color:#fff!important;}

.nav-toggle{
  display:none;background:var(--teal-100);border:0;border-radius:10px;
  padding:9px 12px;font-weight:700;color:var(--teal-800);cursor:pointer;font-size:.9rem;
}

@media (max-width: 900px){
  .nav-toggle{display:inline-flex;align-items:center;gap:6px;}
  .main-nav{
    position:absolute;left:0;right:0;top:100%;background:#fff;
    border-bottom:1px solid #EAE3D3;box-shadow:var(--shadow-card);
    display:none;padding:10px 18px 18px;
  }
  .main-nav.open{display:block;}
  .main-nav ul{flex-direction:column;align-items:stretch;gap:2px;}
  .main-nav a{display:block;padding:12px 14px;}
}

/* ---------------- Breadcrumbs ---------------- */
.breadcrumbs{font-size:.85rem;color:var(--ink-500);padding:16px 0 0;}
.breadcrumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;}
.breadcrumbs li:not(:last-child)::after{content:"/";margin-left:6px;color:var(--ink-300);}
.breadcrumbs a{color:var(--ink-500);}
.breadcrumbs a:hover{color:var(--coral-600);}

/* ---------------- Hero ---------------- */
.hero{
  position:relative;overflow:hidden;
  background:linear-gradient(160deg,var(--teal-800) 0%,var(--teal-600) 62%,var(--teal-500) 100%);
  color:#fff;padding:64px 0 110px;
}
.hero .container{position:relative;z-index:2;}
.hero-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);
  padding:6px 14px;border-radius:99px;font-size:.82rem;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;margin-bottom:18px;color:var(--gold-300);
}
.hero h1{color:#fff;max-width:16ch;}
.hero p.lead{max-width:56ch;font-size:1.15rem;color:var(--teal-100);}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px;}

.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-weight:700;padding:13px 24px;border-radius:99px;font-size:.98rem;
  border:2px solid transparent;cursor:pointer;
}
.btn-primary{background:var(--coral-500);color:#fff;}
.btn-primary:hover{background:var(--coral-600);color:#fff;}
.btn-ghost{border-color:rgba(255,255,255,.55);color:#fff;}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.12);color:#fff;}
.btn-outline{border-color:var(--teal-600);color:var(--teal-700);}
.btn-outline:hover{background:var(--teal-100);}

.hero-wave{
  position:absolute;left:0;right:0;bottom:-2px;line-height:0;z-index:1;
}
.hero-wave svg{width:100%;height:auto;display:block;}

/* simple hero (interior pages) */
.hero-simple{padding:46px 0 76px;}
.hero-simple p.lead{font-size:1.05rem;}

/* ---------------- Wave divider (signature element) ---------------- */
.wave-divider{line-height:0;margin-top:-2px;}
.wave-divider svg{width:100%;height:auto;display:block;}

/* ---------------- Sections ---------------- */
section{padding:64px 0;}
.section-tight{padding:40px 0;}
.section-head{max-width:64ch;margin-bottom:36px;}
.section-head .kicker{
  display:block;color:var(--coral-600);font-weight:800;letter-spacing:.06em;
  text-transform:uppercase;font-size:.8rem;margin-bottom:8px;
}
.bg-teal{background:var(--teal-900);color:var(--teal-100);}
.bg-teal h2{color:#fff;}
.bg-sand{background:var(--sand-100);}
.bg-white{background:var(--white);}

/* ---------------- Cards / grids ---------------- */
.grid{display:grid;gap:26px;}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
.grid-2{grid-template-columns:repeat(2,1fr);}
@media (max-width:960px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.grid-3,.grid-4,.grid-2{grid-template-columns:1fr;}}

.card{
  background:#fff;border-radius:var(--radius-md);overflow:hidden;
  box-shadow:var(--shadow-card);border:1px solid #F0E9D8;
  display:flex;flex-direction:column;height:100%;
  transition:transform .18s ease, box-shadow .18s ease;
}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-pop);}
.card-media{
  aspect-ratio:4/3;background:linear-gradient(135deg,var(--teal-300),var(--teal-600));
  display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--font-display);
  font-size:1.1rem;text-align:center;padding:14px;position:relative;
}
.card-body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:8px;flex:1;}
.card-body h3{margin-bottom:2px;font-size:1.15rem;}
.card-body h3 a{color:var(--teal-900);}
.card-tag{
  display:inline-block;background:var(--gold-100);color:var(--gold-600);
  font-size:.72rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;
  padding:4px 10px;border-radius:99px;align-self:flex-start;
}
.card-meta{font-size:.85rem;color:var(--ink-500);margin-top:auto;padding-top:6px;}
.card-link{font-weight:700;color:var(--coral-600);}

/* "Stamp" postcard motif — used sparingly for signature moments */
.stamp{
  border:2px dashed rgba(255,255,255,.55);
  border-radius:16px;padding:22px;
}

/* Icon bullet list */
.check-list{list-style:none;padding:0;margin:0;display:grid;gap:12px;}
.check-list li{display:flex;gap:10px;align-items:flex-start;}
.check-list li::before{
  content:"";flex:0 0 20px;width:20px;height:20px;margin-top:3px;border-radius:50%;
  background:var(--teal-500);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/14px no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/14px no-repeat;
}

/* Info / tip callouts */
.callout{
  border-radius:var(--radius-md);padding:22px 24px;margin:26px 0;
  border-left:5px solid var(--teal-500);background:var(--teal-50);
}
.callout.gold{border-color:var(--gold-500);background:var(--gold-100);}
.callout.coral{border-color:var(--coral-500);background:var(--coral-100);}
.callout h3{margin-bottom:6px;font-size:1.05rem;color:var(--teal-800);}

/* Stat strip */
.stats{display:flex;flex-wrap:wrap;gap:34px;margin-top:10px;}
.stat b{display:block;font-family:var(--font-display);font-size:2rem;color:var(--gold-300);}
.stat span{font-size:.86rem;color:var(--teal-100);}

/* Table */
.table-wrap{overflow-x:auto;margin:24px 0;border-radius:var(--radius-md);box-shadow:var(--shadow-card);}
table{border-collapse:collapse;width:100%;background:#fff;min-width:520px;}
th,td{padding:13px 16px;text-align:left;border-bottom:1px solid #EFE7D6;font-size:.94rem;}
thead th{background:var(--teal-800);color:#fff;font-family:var(--font-display);font-weight:600;}
tbody tr:last-child td{border-bottom:0;}
tbody tr:nth-child(even){background:var(--sand-100);}

/* FAQ */
.faq-item{border-bottom:1px solid #EFE3CC;padding:18px 0;}
.faq-item summary{
  cursor:pointer;font-weight:700;color:var(--teal-900);font-size:1.02rem;
  list-style:none;display:flex;justify-content:space-between;gap:14px;align-items:center;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";font-size:1.4rem;color:var(--coral-500);flex:0 0 auto;}
.faq-item[open] summary::after{content:"–";}
.faq-item p{margin-top:12px;color:var(--ink-700);}

/* Prose (long-form content pages) */
.prose{max-width:74ch;}
.prose h2{margin-top:1.6em;}
.prose h2:first-child{margin-top:0;}
.prose ul{margin-bottom:1.2em;}
.prose li{margin-bottom:.4em;}
.prose figure{margin:28px 0;}
.prose figcaption{font-size:.85rem;color:var(--ink-500);margin-top:8px;}

.layout-with-aside{display:grid;grid-template-columns:2.1fr 1fr;gap:48px;align-items:start;}
@media (max-width:900px){.layout-with-aside{grid-template-columns:1fr;}}

.aside-box{
  background:#fff;border:1px solid #F0E9D8;border-radius:var(--radius-md);
  padding:22px;box-shadow:var(--shadow-card);position:sticky;top:90px;
}
.aside-box h3{font-size:1rem;text-transform:uppercase;letter-spacing:.04em;color:var(--teal-700);}
.aside-box ul{list-style:none;padding:0;margin:0;display:grid;gap:10px;}
.aside-box a{font-weight:600;color:var(--ink-700);}
.aside-box a:hover{color:var(--coral-600);}

/* Toc pill list */
.toc{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 30px;}
.toc a{
  background:var(--teal-100);color:var(--teal-800);font-size:.85rem;font-weight:700;
  padding:7px 13px;border-radius:99px;
}
.toc a:hover{background:var(--coral-100);color:var(--coral-600);}

/* CTA band */
.cta-band{
  background:linear-gradient(120deg,var(--coral-500),var(--gold-500));
  color:#fff;border-radius:var(--radius-lg);padding:44px;text-align:center;
  box-shadow:var(--shadow-pop);
}
.cta-band h2{color:#fff;}
.cta-band .btn-ghost{border-color:rgba(255,255,255,.7);}

/* ---------------- Footer ---------------- */
.site-footer{background:var(--teal-900);color:var(--teal-100);padding:56px 0 24px;margin-top:40px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:34px;}
@media (max-width:820px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.footer-grid{grid-template-columns:1fr;}}
.site-footer h4{color:#fff;font-family:var(--font-body);font-weight:800;font-size:.86rem;
  text-transform:uppercase;letter-spacing:.05em;margin-bottom:14px;}
.site-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:9px;}
.site-footer a{color:var(--teal-100);font-size:.94rem;}
.site-footer a:hover{color:var(--gold-300);}
.footer-brand p{color:var(--teal-300);font-size:.92rem;max-width:34ch;}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.14);margin-top:40px;padding-top:22px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.82rem;color:var(--teal-300);
}
.footer-lang{display:flex;flex-wrap:wrap;gap:10px;}

/* misc */
.tag-row{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 6px;}
.tag-pill{
  background:var(--teal-100);color:var(--teal-800);font-size:.78rem;font-weight:700;
  padding:5px 12px;border-radius:99px;
}
.center{text-align:center;}
.mt-0{margin-top:0;}
.small{font-size:.85rem;color:var(--ink-500);}