/* V108 Keyword Landing Pages: Chonburi + Rayong */
:root{
  --navy:#061a32;
  --navy2:#0a2748;
  --blue:#139cf2;
  --sky:#38bdf8;
  --text:#071b35;
  --muted:#536a82;
  --line:#dce7f2;
  --bg:#f4f8fc;
  --white:#ffffff;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:Tahoma,Arial,sans-serif;
  background:linear-gradient(180deg,#f7fbff,#f4f8fc);
  color:var(--text);
}
a{color:#126fc7;text-decoration:none;font-weight:900}
a:hover{text-decoration:underline}
.v108-top{
  background:linear-gradient(90deg,#020d1c,#061a32,#020d1c);
  color:#eaf8ff;
  text-align:center;
  padding:10px 16px;
  font-weight:1000;
  font-size:13px;
}
.v108-header{
  background:linear-gradient(180deg,rgba(8,31,58,.99),rgba(6,26,50,.98));
  border-bottom:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 52px rgba(0,13,33,.22);
}
.v108-header-inner{
  width:min(1180px,calc(100% - 32px));
  margin:auto;
  min-height:94px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}
.v108-brand{
  display:flex;
  align-items:center;
  gap:14px;
  color:#fff;
  text-decoration:none;
}
.v108-logo{
  width:64px;
  height:64px;
  border-radius:18px;
  background:linear-gradient(135deg,#0d84f0,#34bdff);
  display:grid;
  place-items:center;
  color:#fff;
  font-size:32px;
  font-weight:1000;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 14px 34px rgba(0,10,30,.28);
}
.v108-brand strong{
  display:block;
  color:#fff;
  font-size:clamp(30px,3vw,44px);
  line-height:.98;
  letter-spacing:-.055em;
  font-weight:1000;
}
.v108-brand small{
  display:block;
  margin-top:5px;
  color:rgba(234,248,255,.84);
  font-weight:900;
  font-size:13px;
}
.v108-nav{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}
.v108-nav a{
  color:#fff;
  min-height:44px;
  display:inline-flex;
  align-items:center;
  padding:0 14px;
  border-radius:14px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.10);
  text-decoration:none;
  font-size:14px;
}
.v108-nav a.cta{
  background:linear-gradient(135deg,#0d84f0,#34bdff);
  box-shadow:0 18px 44px rgba(13,132,240,.30);
}
.v108-hero{
  position:relative;
  min-height:560px;
  color:#fff;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(3,13,27,.88),rgba(3,13,27,.56),rgba(3,13,27,.30)),
    url('/assets/img/hero-clean-v100.webp?v=108') center/cover no-repeat,
    linear-gradient(135deg,#061a32,#0b3766);
}
.v108-hero:after{
  content:"";
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:46px 46px;
  opacity:.18;
  pointer-events:none;
}
.v108-hero-inner{
  position:relative;
  z-index:2;
  width:min(1180px,calc(100% - 32px));
  margin:auto;
  padding:76px 0;
  display:grid;
  grid-template-columns:1.1fr .78fr;
  gap:36px;
  align-items:center;
}
.v108-hero-card{
  background:linear-gradient(180deg,rgba(7,28,52,.92),rgba(4,17,33,.88));
  border:1px solid rgba(123,209,255,.28);
  border-left:7px solid var(--sky);
  border-radius:30px;
  padding:38px;
  box-shadow:0 34px 90px rgba(0,10,30,.46),inset 0 1px rgba(255,255,255,.08);
}
.v108-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(9,50,86,.90);
  border:1px solid rgba(94,200,255,.50);
  font-weight:1000;
  color:#eaf8ff;
  margin-bottom:18px;
}
.v108-hero h1{
  margin:0;
  color:#fff;
  font-size:clamp(42px,5.4vw,76px);
  line-height:1.05;
  letter-spacing:-.055em;
  text-shadow:0 3px 16px rgba(0,0,0,.38);
}
.v108-hero p{
  color:rgba(255,255,255,.94);
  font-size:18px;
  line-height:1.85;
  font-weight:800;
}
.v108-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.v108-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:0 20px;
  border-radius:15px;
  background:linear-gradient(135deg,#0d84f0,#34bdff);
  color:#fff!important;
  text-decoration:none;
  font-weight:1000;
  box-shadow:0 16px 40px rgba(13,132,240,.30);
}
.v108-btn.secondary{
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.26);
  box-shadow:none;
}
.v108-side-card{
  background:rgba(255,255,255,.96);
  border-radius:28px;
  padding:30px;
  color:var(--text);
  border:1px solid rgba(255,255,255,.74);
  box-shadow:0 34px 95px rgba(0,10,30,.28);
}
.v108-side-card h2{
  margin:0 0 12px;
  font-size:30px;
  line-height:1.25;
}
.v108-side-card p{
  color:#445b73;
  text-shadow:none;
  font-size:16px;
}
.v108-list{
  margin:18px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:11px;
}
.v108-list li{
  color:#344c64;
  font-weight:900;
  line-height:1.6;
  padding-left:30px;
  position:relative;
}
.v108-list li:before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  width:21px;
  height:21px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#eaf4ff;
  color:#1684e8;
  font-weight:1000;
  font-size:13px;
}
.v108-wrap{
  width:min(1180px,calc(100% - 32px));
  margin:auto;
}
.v108-section{padding:64px 0}
.v108-section h2{
  font-size:clamp(30px,3.2vw,46px);
  line-height:1.18;
  margin:0 0 14px;
  letter-spacing:-.045em;
  color:var(--text);
}
.v108-lead{
  color:#526a83;
  font-size:18px;
  line-height:1.85;
  max-width:860px;
  font-weight:800;
}
.v108-grid3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:26px;
}
.v108-grid2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-top:26px;
}
.v108-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:24px;
  padding:24px;
  box-shadow:0 18px 45px rgba(7,27,53,.10);
}
.v108-card h3{
  margin:0 0 10px;
  color:var(--text);
  font-size:24px;
}
.v108-card p,.v108-card li{
  color:#445b73;
  line-height:1.85;
  font-weight:750;
}
.v108-card ul{padding-left:22px;margin:12px 0 0}
.v108-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 45px rgba(7,27,53,.10);
}
.v108-table th,.v108-table td{
  text-align:left;
  padding:16px 18px;
  border-bottom:1px solid #e5edf5;
  line-height:1.65;
  vertical-align:top;
}
.v108-table th{
  background:#edf6ff;
  color:#071b35;
  font-weight:1000;
}
.v108-table tr:last-child td{border-bottom:0}
.v108-cta{
  background:linear-gradient(135deg,#061a32,#0d3159);
  color:#fff;
  border-radius:30px;
  padding:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  box-shadow:0 25px 70px rgba(6,26,50,.22);
}
.v108-cta h2{color:#fff;margin:0 0 8px}
.v108-cta p{color:rgba(255,255,255,.86);line-height:1.8;font-weight:800}
.v108-footer{
  background:#031225;
  color:rgba(255,255,255,.78);
  padding:34px 0;
}
.v108-footer strong{color:#fff}
@media(max-width:980px){
  .v108-header-inner{display:grid;gap:14px;justify-items:center;text-align:center;padding:14px 0}
  .v108-nav{justify-content:center}
  .v108-hero-inner{grid-template-columns:1fr;padding:48px 0}
  .v108-grid3,.v108-grid2{grid-template-columns:1fr}
  .v108-cta{display:block}
}
@media(max-width:520px){
  .v108-brand strong{font-size:28px}
  .v108-logo{width:52px;height:52px;font-size:26px}
  .v108-hero-card,.v108-side-card,.v108-card,.v108-cta{padding:22px;border-radius:22px}
  .v108-hero h1{font-size:38px}
  .v108-nav{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .v108-nav a{justify-content:center}
}