*{box-sizing:border-box}:root{--blue:#003b95;--blue2:#0057b8;--blue3:#0071c2;--soft:#eaf3ff;--yellow:#febb02;--ink:#1a1a1a;--muted:#595959;--line:#e7e7e7;--bg:#f5f7fb;--shadow:0 12px 32px rgba(0,53,128,.08);--font:"Inter","Noto Sans Thai","Segoe UI",Tahoma,sans-serif}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--bg);font-family:var(--font)}a{text-decoration:none;color:inherit}.container{width:min(1180px,calc(100% - 28px));margin:auto}.topbar{position:sticky;top:0;z-index:80;background:var(--blue);color:#fff;box-shadow:0 4px 18px rgba(0,53,128,.22)}.nav{min-height:70px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;align-items:center;gap:10px;font-weight:1000}.brand span{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#fff;color:var(--blue);font-size:14px}.brand strong{font-size:24px;letter-spacing:-.03em}.nav-toggle,.nav-menu{display:none}.nav-links{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.nav-links a{border:1px solid transparent;border-radius:999px;padding:9px 13px;font-size:14px;font-weight:850}.nav-outline{border-color:rgba(255,255,255,.42)!important;background:rgba(255,255,255,.1)}.nav-yellow{background:var(--yellow);color:#111827}.hero{background:linear-gradient(180deg,var(--blue) 0%,var(--blue) 82%,transparent 82%);color:#fff}.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:24px;align-items:center;min-height:560px;padding:42px 0 110px}.eyebrow{margin:0 0 10px;color:var(--yellow);font-size:12px;font-weight:1000;letter-spacing:.12em;text-transform:uppercase}.eyebrow.blue{color:var(--blue3)}h1,h2,h3,p{margin-top:0}h1{max-width:820px;margin-bottom:18px;font-size:clamp(34px,5vw,64px);line-height:1.03;letter-spacing:-.055em}.lead{max-width:790px;color:rgba(255,255,255,.86);font-size:18px;font-weight:650;line-height:1.75}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;border:1px solid transparent;border-radius:8px;padding:0 18px;font-weight:1000}.button.yellow{background:var(--yellow);color:#111827;box-shadow:0 12px 28px rgba(254,187,2,.28)}.button.white{background:#fff;color:var(--blue)}.button.blue{background:var(--blue3);color:#fff}.button.full{width:100%}.hero-card{border:4px solid var(--yellow);border-radius:16px;background:#fff;color:var(--ink);padding:20px;box-shadow:0 24px 70px rgba(0,53,128,.22)}.hero-card-top span{display:inline-flex;margin-bottom:8px;border-radius:999px;background:var(--soft);color:var(--blue);padding:5px 10px;font-size:12px;font-weight:1000}.hero-card-top strong{display:block;font-size:26px;line-height:1.15}.mini-dashboard{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:18px 0}.mini-dashboard div{border:1px solid #d8ebff;border-radius:12px;background:#f3f9ff;padding:12px}.mini-dashboard small{display:block;color:var(--muted);font-size:12px;font-weight:850}.mini-dashboard b{display:block;color:var(--blue);font-size:28px}.search-panel{position:relative;z-index:5;margin-top:-70px}.search-box{display:grid;grid-template-columns:1.5fr 1fr .75fr auto;gap:4px;border:4px solid var(--yellow);border-radius:14px;background:var(--yellow);box-shadow:0 18px 46px rgba(0,53,128,.13)}.search-box label{min-height:68px;display:grid;align-content:center;gap:3px;background:#fff;padding:10px 14px}.search-box label:first-child{border-radius:9px 0 0 9px}.search-box span{color:var(--muted);font-size:12px;font-weight:850}.search-box input,.search-box select{border:0;background:transparent;font-weight:1000}.search-box button{min-width:160px;border:0;border-radius:0 9px 9px 0;background:var(--blue3);color:#fff;padding:0 18px;font-weight:1000;cursor:pointer}.trust-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.trust-row span{border:1px solid #d8ebff;border-radius:999px;background:#fff;color:var(--blue);padding:8px 12px;font-size:13px;font-weight:900}.section{padding:40px 0}.section-head{max-width:820px;margin-bottom:22px}.section-head h2,.preview-copy h2,.cta-card h2{margin-bottom:10px;font-size:clamp(27px,3.6vw,46px);line-height:1.1;letter-spacing:-.045em}.section-head p:not(.eyebrow),.preview-copy p,.cta-card p{color:var(--muted);font-weight:700;line-height:1.7}.feature-grid,.theme-grid,.case-grid,.plan-grid{display:grid;gap:14px}.feature-grid{grid-template-columns:repeat(3,1fr)}.theme-grid{grid-template-columns:repeat(4,1fr)}.case-grid,.plan-grid{grid-template-columns:repeat(3,1fr)}.feature-grid article,.theme-card,.case-grid article,.plan-grid article,.preview-grid,.cta-card{border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--shadow)}.feature-grid article,.theme-card,.case-grid article,.plan-grid article{padding:22px}.feature-grid article>span{display:grid;place-items:center;width:50px;height:50px;border-radius:14px;background:var(--soft);font-size:24px}.feature-grid h3,.theme-card h3,.case-grid h3,.plan-grid h3{margin:16px 0 8px;font-size:22px}.feature-grid p,.theme-card p,.case-grid p,.plan-grid p{color:var(--muted);font-weight:700;line-height:1.65}.preview-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:24px;align-items:center;padding:28px}.mock-window{overflow:hidden;border:1px solid #d8ebff;border-radius:18px;background:#fff}.mock-bar{display:flex;align-items:center;gap:7px;border-bottom:1px solid var(--line);padding:12px}.mock-bar span{width:11px;height:11px;border-radius:50%;background:#cbd5e1}.mock-bar em{margin-left:auto;color:var(--muted);font-size:12px;font-style:normal;font-weight:800}.mock-body{display:grid;grid-template-columns:150px 1fr;min-height:320px}.mock-sidebar{display:grid;align-content:start;gap:8px;background:var(--blue);color:#fff;padding:16px}.mock-sidebar strong{margin-bottom:10px;font-size:20px}.mock-sidebar i{border-radius:10px;padding:9px;font-style:normal;font-size:13px;font-weight:850;opacity:.82}.mock-sidebar .active{background:rgba(255,255,255,.16);opacity:1}.mock-main{padding:16px}.mock-hero{display:flex;align-items:center;gap:10px;border-radius:16px;background:linear-gradient(135deg,var(--blue),var(--blue3));color:#fff;padding:18px}.mock-hero strong{font-size:22px}.mock-hero button{margin-left:auto;border:0;border-radius:8px;background:var(--yellow);color:#111827;padding:10px 12px;font-weight:1000}.mock-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}.mock-kpis span{border:1px solid var(--line);border-radius:12px;padding:12px;color:var(--muted);font-size:12px;font-weight:850}.mock-kpis b{display:block;color:var(--blue);font-size:24px}.mock-list{display:grid;gap:8px;margin-top:12px}.mock-list i{height:38px;border-radius:10px;background:linear-gradient(90deg,#f3f9ff,#fff,#fff7db)}.theme-card b,.case-grid b{display:inline-flex;margin-bottom:14px;border-radius:999px;background:var(--yellow);color:#111827;padding:7px 12px;font-size:13px}.theme-card span{display:inline-flex;margin-top:12px;color:var(--blue3);font-weight:1000}.plan-grid article{position:relative}.plan-grid article.popular{border:3px solid var(--yellow)}.plan-grid article em{position:absolute;top:14px;right:14px;border-radius:999px;background:var(--yellow);color:#111827;padding:6px 10px;font-style:normal;font-size:12px;font-weight:1000}.plan-grid strong{display:block;margin:14px 0;color:var(--blue);font-size:38px;line-height:1}.plan-grid small{color:var(--muted);font-size:14px}.plan-grid ul{display:grid;gap:9px;margin:0 0 18px;padding:0;list-style:none}.plan-grid li{color:var(--muted);font-weight:800}.plan-grid li:before{content:"✓";color:var(--blue3);margin-right:8px;font-weight:1000}.cta-section{padding:40px 0 24px}.cta-card{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:30px;background:var(--blue);color:#fff}.cta-card p{color:rgba(255,255,255,.82)}.footer{border-top:1px solid var(--line);background:#fff;padding:24px 0}.footer-inner{display:flex;justify-content:space-between;gap:16px;color:var(--muted);font-weight:850}.footer a{color:var(--blue3)}@media(max-width:1000px){.hero-grid,.preview-grid{grid-template-columns:1fr}.search-box{grid-template-columns:1fr}.search-box label,.search-box label:first-child,.search-box button{border-radius:9px}.feature-grid,.theme-grid,.case-grid,.plan-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.container{width:min(100% - 18px,540px)}.nav{min-height:62px}.brand strong{font-size:18px}.nav-menu{display:inline-flex;border:1px solid rgba(255,255,255,.42);border-radius:999px;padding:8px 12px;font-weight:900}.nav-links{display:none;position:absolute;top:64px;left:9px;right:9px;border-radius:14px;background:var(--blue);padding:10px;box-shadow:0 18px 40px rgba(0,53,128,.25)}.nav-toggle:checked~.nav-links{display:grid}.nav-links a{text-align:center}.hero-grid{min-height:auto;padding:30px 0 92px}h1{font-size:34px}.lead{font-size:15px}.hero-actions,.trust-row,.footer-inner,.cta-card{display:grid}.button,.search-box button{width:100%}.search-panel{margin-top:-62px}.feature-grid,.theme-grid,.case-grid,.plan-grid,.mock-kpis{grid-template-columns:1fr}.mock-body{grid-template-columns:1fr}.mock-sidebar{display:none}.mock-hero{display:grid}.mock-hero button{margin-left:0}}

/* Step 17.1: reduce main resort108.com heading sizes */
h1 {
  font-size: clamp(24px, calc(5vw - 10px), 54px);
}

.section-head h2,
.preview-copy h2,
.cta-card h2 {
  font-size: clamp(20px, calc(3.6vw - 7px), 39px);
}

@media (max-width: 720px) {
  h1 {
    font-size: 24px;
  }

  .section-head h2,
  .preview-copy h2,
  .cta-card h2 {
    font-size: 25px;
  }
}


/* Step 17.2: mobile-only H2 reduce another 5px */
@media (max-width: 720px) {
  .section-head h2,
  .preview-copy h2,
  .cta-card h2 {
    font-size: 20px;
  }
}


/* Step 17.3: mobile-only H3 reduce 7px */
@media (max-width: 720px) {
  .feature-grid h3,
  .theme-card h3,
  .case-grid h3,
  .plan-grid h3 {
    font-size: 15px;
  }
}


/* Step 17.4: mobile-only H3 +3px and article text -1px */
@media (max-width: 720px) {
  .feature-grid h3,
  .theme-card h3,
  .case-grid h3,
  .plan-grid h3 {
    font-size: 18px;
  }

  .feature-grid article,
  .theme-card,
  .case-grid article,
  .plan-grid article {
    font-size: 15px;
  }
}


/* Step 17.5: desktop-only H1/H2 reduce 5px */
@media (min-width: 1024px) {
  h1 {
    font-size: clamp(24px, calc(5vw - 15px), 49px);
  }

  .section-head h2,
  .preview-copy h2,
  .cta-card h2 {
    font-size: clamp(20px, calc(3.6vw - 12px), 34px);
  }
}


/* Step 17.6: desktop-only H1/H2 reduce another 3px */
@media (min-width: 1024px) {
  h1 {
    font-size: clamp(21px, calc(5vw - 18px), 46px);
  }

  .section-head h2,
  .preview-copy h2,
  .cta-card h2 {
    font-size: clamp(17px, calc(3.6vw - 15px), 31px);
  }
}