/* ============================================================
   blocks.css — IC-MyHost Master Block Styles v2
   © 2004–2026 Ideal Creation Center Co., Ltd.
   ============================================================ */
/*
ic-sec-s1	#ffffff
ic-sec-s2	#f7f8fc
ic-sec-s1	#ffffff
ic-sec-s2	#f7f8fc
ic-sec-s3	#eef2ff
ic-sec-s4	#e5ebff
ic-sec-s5	#dce4ff
ic-sec-s6	#cfd8ff
ic-sec-s7	#3d4f9f

V1
.ic-s1 { background: #ffffff; }
.ic-s2 { background: #f7f8fc; }
.ic-s3 { background: #eef2ff; }
V2
.ic-s1 { background: #fbfbfb; }
.ic-s2 { background: #f6f6f7; }
.ic-s3 { background: #f1f2f1; }
.ic-s4 { background: #ebebeb; }
.ic-s5 { background: #e5e5e5; }

V8-V9
.ic-s1	#FDFDFD	29	
.ic-s2	#F2F3F5	26	
.ic-s3	#EBEBEB	28	
.ic-s4	#DFDFDF	27	
.ic-s5	#FEF5E6	10	Ivory
.ic-s6	#545454	16	Dark Gray
.ic-s7	#3C3D41	17	Gunmetal
.ic-s8	#CFD5EF	5	Lavender Gray
 

/* ── SECTION BACKGROUNDS ── */

.ic-s1 { background: #FDFDFD; }
.ic-s2 { background: #F2F3F5; }
.ic-s3 { background: #EBEBEB; }
.ic-s4 { background: #DFDFDF; }
.ic-s5 { background: #FEF5E6; /*Ivory*/ }
.ic-s6 { background: #545454; /*Dark Gray*/ }
.ic-s7 { background: #3C3D41; /*Gunmetal*/ }
.ic-s8 { background: #CFD5EF; /*Lavender Gray*/ }

 

/* ── LAYOUT ── */
.ic-section    { padding: 80px 0; }
.ic-section-sm { padding: 52px 0; }
.ic-center     { text-align: center;  }
.ic-lead       { font-size: 17px; color: #FFFFFF;   max-width: 640px;  line-height: 1.78; }
.ic-center .ic-lead { margin: 0 auto;   }
.ic-s2 .ic-center .ic-lead  { font-size: 17px; color: var(--ic-text, #1a1e3c);   max-width:640px; line-height: 1.78; }
.ic-center .ic-lead { margin: 0 auto;   }
.ic-label      { display: inline-block; font-size: 15px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: #FF9900; margin-bottom: 14px; }
.ic-center .ic-lead h2 { color: #FFFFFF; }
.white{ color: #FFFFFF; }
.orange{ color: #FF9900; }
hr.ic-divider  { border: none; border-top: 1px solid #e8edf5; }

/* ── GRIDS ── */
.ic-grid-2   { display: grid; grid-template-columns: repeat(2,1fr); gap: 28px; }
.ic-grid-3   { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.ic-grid-4   { display: grid; grid-template-columns: repeat(4,1fr); gap: 22px; align-items:stretch; }
.ic-grid-1-1 { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }

/* ── CHECKMARK circle green ── */
.ic-check { display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:#e8f8ee;flex-shrink:0; }
.ic-check svg { width:12px;height:12px;stroke:#187a3e;stroke-width:2.3;stroke-linecap:round;fill:none; }

/* ── ICON WRAP (6 colors) ── */
.ic-icon-wrap { width:52px;height:52px;border-radius:13px;display:flex;align-items:center;justify-content:center;margin-bottom:18px;flex-shrink:0; }
.ic-icon-wrap h3{ color:#FF9900;}
.ic-icon-wrap svg { width:24px;height:24px; }
.ic-icon-blue   { background:#e8eeff; } .ic-icon-blue   svg { stroke:#021159; }
.ic-icon-amber  { background:#fff3e0; } .ic-icon-amber  svg { stroke:#c77700; }
.ic-icon-green  { background:#e8f8ee; } .ic-icon-green  svg { stroke:#187a3e; }
.ic-icon-slate  { background:#f1f4f9; } .ic-icon-slate  svg { stroke:#3a4a6b; }
.ic-icon-orange { background:#ff9900; } .ic-icon-orange  svg { stroke:#3a4a6b; }
.ic-icon-violet { background:#f0ebff; } .ic-icon-violet svg { stroke:#5b21b6; }
.ic-icon-teal   { background:#e0f6f8; } .ic-icon-teal   svg { stroke:#0a7a87; }

/* ── BADGES ── */
.ic-badge { display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:999px;font-size:12px;font-weight:700;background:#eef2ff;color:#021159;border:1px solid #c7d2e8; }
.ic-badge-dot { width:6px;height:6px;border-radius:50%;background:#22c55e;flex-shrink:0; }

/* ── BUTTONS ── */
.ic-btn { display:inline-flex;align-items:center;gap:8px;padding:13px 28px;border-radius:10px;font-size:16px;font-weight:700;font-family:inherit;border:none;cursor:pointer;text-decoration:none;transition:all .18s;white-space:nowrap;line-height:1; }
.ic-btn-primary { background:#021159;color:#fff; }
.ic-btn-primary:hover { background:#0a1f7a;color:#fff;transform:translateY(-1px);box-shadow:0 6px 20px rgba(2,17,89,.25); }
.ic-btn-orange  { background:#FF9900;color:#1a1400; }
.ic-btn-orange:hover  { background:#FF9900;color:#FFFFFF;transform:translateY(-1px);box-shadow:0 6px 20px rgba(255,153,0,.3); }
.ic-btn-outline { background:transparent;color:#021159;border:1.5px solid #c7d2e8; }
.ic-btn-outline:hover { background:#eef2ff;border-color:#021159; }
.ic-btn-ghost   { background:rgba(2,17,89,.07);color:#021159; }
.ic-btn-ghost:hover   { background:rgba(2,17,89,.13); }
.ic-btn-ghost-inv { background:rgba(255,255,255,.12);color:#fff;border:1.5px solid rgba(255,255,255,.3); }
.ic-btn-ghost-inv:hover { background:rgba(255,255,255,.22);color:#fff; }

/* ── VIEW PLANS button — ใช้ทุกที่ใน theme ── */
.ic-btn-view-plans {
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 28px;border-radius:10px;
  font-size:15px;font-weight:700;font-family:inherit;
  background: #DFDFDF; /* 14	Light Silver */
  /* rgba(2,17,89,.07);background:linear-gradient(135deg,#ffffff 0%,#d8d9ff 100%);*/
  color:#021159;
  border:1.5px solid #999 ;
  cursor:pointer;text-decoration:none;
  transition:all .18s;white-space:nowrap;line-height:1;
  box-shadow:0 2px 8px  rgba(2,17,89,.1); 
}
.ic-btn-view-plans:hover {
  /*background:linear-gradient(135deg,#e8eaff 0%,#b0b8ee 100%);
  color:#021159;*/
  background: #2B3773; /*rgba(2,17,89,.13); */ 

  color:#ffffff;/*#ff9900; */ border:1.5px solid #545454;/*border-color:#8890e0; */
  transform:translateY(-1px);box-shadow:0 5px 16px rgba(2,17,89,.18);
}
.ic-btn-view-plans.ic-btn-lg { padding:15px 34px;font-size:16px; }
.ic-btn-sm { padding:9px 20px;font-size:14px; }
.ic-btn-lg { padding:15px 34px;font-size:16px; }
.ic-btn-xl { padding:17px 40px;font-size:17px;font-weight:800;letter-spacing:.2px; }

/* ── HERO SECTION (light bg) ── */
.ic-hero-grid { display:grid;grid-template-columns:1.1fr 0.9fr;gap:56px;align-items:center; }
.ic-hero-sub  { font-size:16.5px;color:#475569;line-height:1.75;margin-bottom:28px; }
.ic-hero-sub strong { color:#0f172a; }
.ic-hl        { color:#FF9900; }

/* hero trust row */
.ic-hero-trust {
  display:flex;gap:0;flex-wrap:wrap;margin-bottom:28px;align-items:stretch;
  background:#EEF2FF;	 /* สี34  linear-gradient(135deg,#ffffff 0%,#d8d9ff 100%); */
  border-radius:14px;padding:14px 20px;border:1px solid #c7d2e8;
  box-shadow:0 2px 8px rgba(2,17,89,.07);
}
.ic-hero-trust-item { padding:5px 15px;display:flex;flex-direction:column;justify-content:center; width: 24%; }
.ic-hero-trust-item strong { display:block;font-size:17px;font-weight:800;color:#021159;line-height:1.1; }
.ic-hero-trust-item span   { font-size:12px;color:#64748b; }
.ic-trust-span-dark        { font-size:12px;color:#333333; }  /* label บน dark hero bg */
.ic-trust-sep { width:1px;background:rgba(2,17,89,.15);align-self:stretch;margin:4px 0; }

/* strong highlight สีส้มบน dark hero bg */
.ic-s7 .ic-hero-sub-hl { color:#FF9900; }

/* hero status card */
.ic-hero-card { background:#021159;border:1px solid #0a2070;border-radius:20px;padding:24px;box-shadow:0 8px 28px rgba(2,17,89,.3); }
/*
.ic-hero-card-title { font-size:16px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:14px; }
*/
.ic-status-row { display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.1);font-size:14px;gap:12px; }
.ic-status-row:last-of-type { border-bottom:none; }
.ic-status-label { color:rgba(255,255,255,.55); }
.ic-status-val   { font-weight:600;color:#fff;text-align:right; }
.ic-status-green { color:#16a34a; }
.ic-hero-card-stats { display:flex;justify-content:space-around;margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.12); }
.ic-stat-mini { text-align:center; }
.ic-stat-mini strong { display:block;font-size:22px;font-weight:800;color:#fff;line-height:1; }
.ic-stat-mini span   { font-size:12px;color:rgba(255,255,255,.5);margin-top:3px;display:block; }

/* ── TRUST BAR ── */
.ic-trustbar { background:#1e2536;padding:36px 0; }
.ic-trustbar-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px;text-align:center; }
.ic-trustbar-num  { font-size:28px;font-weight:800;color:#fff;line-height:1; }
.ic-trustbar-lbl  { font-size:13px;color:rgba(255,255,255,.58);margin-top:4px; }
.ic-trustbar-logos { margin-top:24px;text-align:center; }
.ic-trustbar-logos small { display:block;font-size:11px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:rgba(255,255,255,.38);margin-bottom:10px; }
.ic-trustbar-logos-list  { display:flex;justify-content:center;flex-wrap:wrap;gap:4px 22px; }
.ic-trustbar-logos-list span { font-size:14px;font-weight:600;color:rgba(255,255,255,.6); }

/* ── CTA CARD (Reframe / Final CTA, light) ── */
.ic-cta-card-section { padding:64px 0; }
.ic-cta-card {
  background: #F2F3F5; /* 7	Light Gray linear-gradient(135deg,#ffffff 0%,#deeaff 55%,#c8daff 100%); */
  border-radius:28px;padding:60px 52px;text-align:center;
  box-shadow:0 20px 60px rgba(2,17,89,.1),0 4px 16px rgba(2,17,89,.06);
  border:1px solid rgba(2,17,89,.07);position:relative;overflow:hidden;
}
.ic-cta-card::after { content:'';position:absolute;top:-60px;right:-60px;width:220px;height:220px;background:radial-gradient(circle,rgba(2,17,89,.05) 0%,transparent 70%);pointer-events:none; }
.ic-cta-card > * { position:relative;z-index:1; }
.ic-cta-card h2  { color:#021159;font-size:clamp(20px,2.8vw,32px);font-weight:800;letter-spacing:-.3px;margin-bottom:14px; }
.ic-cta-card h2 span { color:#FF9900; }
.ic-cta-card .ic-cta-sub { color:#3a4a6b;font-size:16.5px;max-width:560px;margin:0 auto 32px;line-height:1.75; }
.ic-cta-card-tag { display:inline-block;font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:rgba(2,17,89,.45);margin-bottom:14px;background:rgba(2,17,89,.06);padding:4px 12px;border-radius:999px;border:1px solid rgba(2,17,89,.1); }
.ic-cta-actions  { display:flex;gap:12px;flex-wrap:wrap;justify-content:center; }

/* ── CARDS (plain) ── */
.ic-card { background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:28px; }
.ic-card-accent-blue   { border-top:12px solid #021159; }
.ic-card-accent-orange { border-top:12px solid #FF9900; }
.ic-card-accent-green  { border-top:12px solid #22c55e; }
.ic-card-accent-violet { border-top:12px solid #5b21b6; }
.ic-card-accent-teal   { border-top:12px solid #0a7a87; }

/* PAIN CARDS — grey tint bg, no hover color */
.ic-pain-card { background:#f8f9fb;border:1px solid #e8edf5;border-radius:16px;padding:32px 24px;text-align:center; }
.ic-pain-card h3 { font-size:17px;font-weight:700;margin-bottom:10px;color:#0f172a; }
.ic-pain-card p  { font-size:14.5px;color:#475569; }
.ic-pain-icon-wrap {
  width:60px;height:60px;border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 18px;
  /* สีจาง — bg อ่อน + icon เข้ม */
  background:#eef2ff;
}
.ic-pain-icon-wrap svg { width:26px;height:26px;stroke:#021159;stroke-width:1.6;fill:none; }

/* ── INCLUDED — hostway style 2×4 grid ── */
.ic-included-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:20px; }
.ic-included-card {
  background:#fff;border:1px solid #e8edf5;border-radius:14px;
  padding:22px 18px;text-align:center;
}
.ic-included-icon {
  width:48px;height:48px;border-radius:12px;
  background:#eef2ff;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 14px;
}
.ic-included-icon svg { width:22px;height:22px;stroke:#021159;stroke-width:1.7;fill:none; }
.ic-included-card strong { display:block;font-size:14.5px;font-weight:700;color:#0f172a;margin-bottom:4px; }
.ic-included-card span   { font-size:12.5px;color:#64748b;line-height:1.5;display:block; }

/* ── TABS ── */
.ic-tabs { display:flex;gap:0;flex-wrap:wrap;border-bottom:6px solid #e2e8f0;margin-bottom:44px; }
.ic-tab-btn { padding:12px 24px;font-size:16px;font-weight:600;color:#64748b;background:none;border:none;border-bottom:6px solid transparent;margin-bottom:-6px;cursor:pointer;font-family:inherit;transition:all .15s;white-space:nowrap; }
.ic-tab-btn:hover { color:#021159; }
.ic-tab-btn.active { color:#021159;border-bottom-color:#021159;font-weight:700; }
.ic-tab-panel { display:none; }
.ic-tab-panel.active { display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center; }
.ic-tab-content h3 { font-size:28px;font-weight:800;margin-bottom:14px; }
.ic-tab-content p  { font-size:16px;margin-bottom:22px; }
.ic-tab-content ul { list-style:none;margin-bottom:26px; }
.ic-tab-content ul li { font-size:15px;color:#334155;padding:7px 0;border-bottom:1px solid #f1f5f9;display:flex;align-items:flex-start;gap:10px; }
.ic-tab-content ul li:last-child { border-bottom:none; }

/* ── TESTIMONIAL ── */
.ic-testi-card  { background:#fff;border:1px solid #e2e8f0;border-radius:20px;padding:40px;max-width:820px;margin:0 auto; }
.ic-testi-stars { display:flex;gap:3px;margin-bottom:20px; }
.ic-testi-star  { width:18px;height:18px;fill:#FF9900; }
.ic-testi-quote { font-size:18px;line-height:1.75;color:#0f172a;font-style:italic;margin-bottom:28px;border-left:3px solid #021159;padding-left:20px; }
.ic-testi-author { display:flex;align-items:center;gap:16px; }
.ic-testi-avatar { width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#021159,#1a3aaa);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:17px;flex-shrink:0; }
.ic-testi-name  { font-weight:700;font-size:15px;color:#0f172a; }
.ic-testi-role  { font-size:13px;color:#64748b;margin-top:2px; }
.ic-testi-nav   { display:flex;gap:8px;justify-content:center;margin-top:28px; }
.ic-testi-dot   { width:8px;height:8px;border-radius:50%;background:#cbd5e1;cursor:pointer;transition:background .15s,transform .15s;border:none;padding:0; }
.ic-testi-dot.active { background:#021159;transform:scale(1.3); }

/* ── WHY CHOOSE (Block I) ── */
.ic-why-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:28px; }
.ic-why-card { background:#fff;border:1px solid #e2e8f0;border-radius:20px;overflow:hidden;transition:box-shadow .2s,transform .2s;padding:28px 28px 32px; }
.ic-why-card:hover { box-shadow:0 16px 48px rgba(2,17,89,.1);transform:translateY(-4px); }
.ic-why-card .icon{width:52px;height:52px;border-radius:14px;background:#eef2ff;display:flex;align-items:center;justify-content:center;margin-bottom:20px; alignment-adjust:middle; text-align:center;}
.ic-why-photo { width:100%;aspect-ratio:6/4;position:relative;overflow:hidden; }
.ic-why-photo-placeholder { width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative; }
.ic-why-photo-placeholder svg.bg-icon { width:80px;height:80px;opacity:.15;   }
.ic-why-photo-fade { position:absolute;bottom:0;left:0;right:0;height:50%; }
.ic-why-body    { padding:26px 26px 30px; }
.ic-why-body h3 { font-size:19px;font-weight:700;margin-bottom:10px;color:#0f172a; }
.ic-why-body p  { font-size:15px;color:#475569;line-height:1.75;margin-bottom:18px; }
.ic-why-body a  { font-size:14px;font-weight:700;color:#021159;display:inline-flex;align-items:center;gap:5px;text-decoration:none; }
.ic-why-body a:hover { color:#FF9900; }

/* ── FAQ 2-col ACCORDION ── */
.ic-faq-2col { display:grid;grid-template-columns:1fr 1fr;gap:0 48px;align-items:start; }
.ic-faq-item { border-bottom:1px solid #d0d9ee; }
.ic-faq-btn  {
  width:100%;background:none;border:none;cursor:pointer;
  padding:17px 0;text-align:left;
  font-size:15.5px;font-weight:600;color:#0f172a;
  display:flex;justify-content:space-between;align-items:center;gap:14px;
  font-family:inherit;line-height:1.4;
}
/* ซ่อน ::after default ของ daylight.css */
.ic-faq-btn::after { display:none !important; }
.ic-faq-icon {
  width:28px;height:28px;min-width:28px;border-radius:50%;
  background:#eef2ff;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  transition:background .15s;
}
.ic-faq-icon svg { width:14px;height:14px;stroke:#021159;stroke-width:2.5;stroke-linecap:round;fill:none;transition:transform .25s; }
.ic-faq-item.ic-open .ic-faq-icon { background:#021159; }
.ic-faq-item.ic-open .ic-faq-icon svg { stroke:#fff;transform:rotate(45deg); }
.ic-faq-body       { display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s ease; }
.ic-faq-body-inner { overflow:hidden; }
.ic-faq-item.ic-open .ic-faq-body { grid-template-rows:1fr; }
.ic-faq-body-inner p { padding-bottom:16px;font-size:15px;color:#475569;line-height:1.75;margin:0; }

/* ── PRICING ── */
.ic-price-card { background:#fff;border:1.5px solid #e2e8f0;border-radius:20px;padding:30px;padding-top:44px;display:flex;flex-direction:column;flex:1;transition:box-shadow .2s,transform .2s;position:relative; }
.ic-price-card:hover { box-shadow:0 12px 36px rgba(2,17,89,.1);transform:translateY(-3px); }
.ic-price-card.featured { background:linear-gradient(160deg,#021159 0%,#0d2280 100%);border-color:#FF9900;padding-top:44px; }
.ic-price-card.featured .ic-price-tier  { color:#FF9900; }
.ic-price-card.featured .ic-price-desc,
.ic-price-card.featured .ic-price-mo   { color:rgba(255,255,255,.55); }
.ic-price-card.featured .ic-price-amount { color:#fff; }
.ic-price-card.featured .ic-price-features li { color:rgba(255,255,255,.85);border-bottom-color:rgba(255,255,255,.1); }
.ic-price-card.featured .ic-price-features li::before { color:#4ade80; }
.ic-price-badge  { position:absolute;top:12px;left:50%;transform:translateX(-50%);background:#FF9900;color:#1a1400;font-size:11px;font-weight:700;padding:4px 16px;border-radius:999px;white-space:nowrap;z-index:2; }
.ic-price-wrap   { position:relative;display:flex;flex-direction:column;height:100%; }
.ic-price-tier   { font-size:20px;font-weight:700;margin-bottom:4px; }
.ic-price-desc   { font-size:14px;color:#64748b;margin-bottom:14px;min-height:40px; }
.ic-price-amount { font-size:38px;font-weight:800;line-height:1;color:#0f172a; }
.ic-price-amount span { font-size:14px;font-weight:400;color:#94a3b8; }
.ic-price-mo     { font-size:13px;color:#94a3b8;margin-bottom:18px; }
.ic-price-features { list-style:none;flex:1;margin-bottom:22px; }
.ic-price-features li { font-size:14.5px;color:#334155;padding:7px 0;border-bottom:1px solid #f1f5f9;display:flex;align-items:center;gap:8px; }
.ic-price-features li:last-child { border-bottom:none; }
.ic-price-features li::before { content:'✓';color:#22c55e;font-weight:700;flex-shrink:0; }

/* ── IMG PLACEHOLDER ── */
.ic-img-placeholder { border-radius:16px;overflow:hidden;background:linear-gradient(135deg,#e8eeff,#d5e0ff);display:flex;align-items:center;justify-content:center;position:relative; }
.ic-img-placeholder svg { opacity:.18; }
.ic-img-placeholder::after { content:attr(data-label);position:absolute;bottom:16px;left:16px;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#021159;opacity:.5; }

/* ── FOOTER SOLUTION DESC ── */
.ic-footer-sol-desc { font-size:12px;color:rgba(255,255,255,.4);font-weight:400; }
.ic-footer-col ul li a:hover .ic-footer-sol-desc { color:rgba(255,153,0,.6); }

/* ── RESPONSIVE ── */
@media (max-width:900px) {
  .ic-hero-grid { grid-template-columns:1fr;gap:32px; }
  .ic-grid-3,.ic-grid-4,.ic-why-grid { grid-template-columns:repeat(2,1fr); }
  .ic-grid-1-1 { grid-template-columns:1fr;gap:36px; }
  .ic-tab-panel.active { grid-template-columns:1fr; }
  .ic-faq-2col { grid-template-columns:1fr;gap:0; }
  .ic-included-grid { grid-template-columns:repeat(2,1fr); }
  .ic-cta-card { padding:40px 28px; }
}
@media (max-width:600px) {
  .ic-grid-2,.ic-grid-3,.ic-grid-4,.ic-why-grid { grid-template-columns:1fr; }
  .ic-included-grid { grid-template-columns:repeat(2,1fr); }
  .ic-section { padding:52px 0; }
}

/* ══ HERO: card status ══ */
.ic-hero-card-title { font-size: 18px !important; color: #64748b !important; }
.ic-status-label { font-size: 14px !important; color: #475569; }
.ic-status-val   { font-size: 14px !important; font-weight: 600; color: #0f172a; }
.ic-status-green { color: #16a34a !important; }
.ic-stat-mini strong { font-size: 22px; font-weight: 800; color: #021159; display: block; line-height: 1; }
.ic-stat-mini span   { font-size: 12px; color: #64748b; margin-top: 3px; display: block; }

/* ══ HERO + REFRAME: CTA buttons ══ */
.ic-btn-cta-primary {
  background: #021159;
  color: #fff;
  padding: 14px 32px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 700;
  font-family: inherit;
  border: none;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: background .18s, transform .18s, box-shadow .18s;
  white-space: nowrap;
  box-shadow: 0 4px 14px rgba(2,17,89,.25);
}
.ic-btn-cta-primary:hover {
  background: #0a1f7a;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(2,17,89,.32);
}
.ic-btn-cta-outline {
  background: transparent;
  color: #021159;
  padding: 13px 28px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 700;
  font-family: inherit;
  border: 2px solid #021159;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: background .18s, transform .18s;
  white-space: nowrap;
}
.ic-btn-cta-outline:hover {
  background: #021159;
  color: #fff;
  transform: translateY(-2px);
}

/* ══ TRUST BAR V2 ══ */
.ic-trustbar-v2 {
  background: #1e2536;
  padding: 32px 0;
  border-top: 1px solid rgba(255,255,255,.06);
}
.ic-trustbar-v2-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 16px;
  text-align: center;
  margin-bottom: 24px;
}
.ic-trustbar-v2-item { padding: 8px; }
.ic-trustbar-v2-num {
  font-size: 32px;
  font-weight: 800;
  color: #fff;
  line-height: 1;
  margin-bottom: 4px;
}
.ic-trustbar-v2-lbl {
  font-size: 13px;
  color: rgba(255,255,255,.75);
}
.ic-trustbar-v2-logos { text-align: center; }
.ic-trustbar-v2-logos small {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(255,255,255,.55);
  margin-bottom: 10px;
}
.ic-trustbar-v2-logos-list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 4px 22px;
}
.ic-trustbar-v2-logos-list span {
  font-size: 14px;
  font-weight: 600;
  color: rgba(255,255,255,.8);
}

/* ══ PAIN CARDS PRO ══ */
.ic-pain-card-pro {
  background: #DFDFDF; /*  14	Light Silver  #e5eaff; // old */
  border: 1px solid #545454; 
/*  background: #3C3D41; 	17	Gunmetal 
  border: 1px solid #545454;*/
   
   /*  16	Dark Gray #c0cbf0; // old */
  border-radius: 16px;
  padding: 32px 24px;
  text-align: center;
  box-shadow: 0 4px 16px rgba(2,17,89,.1);
}
.ic-pain-icon-pro {
  width: 60px;
  height: 60px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid #c0cbf0;
  box-shadow: 0 2px 8px rgba(2,17,89,.08);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 18px;
}
.ic-pain-icon-pro svg {
  width: 28px;
  height: 28px;
  stroke: #021159;
  opacity: .8;
}
.ic-pain-card-pro h3 {
  font-size: 17px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 10px;
}
.ic-pain-card-pro p {
  font-size: 14.5px;
  color: #475569;
  margin: 0;
}

/* ══ INCLUDED PRO (hostway style, 4x2 grid) ══ */
.ic-included-pro {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.ic-included-pro-item {
  background: #FEF5E6; /*	 	10	Ivory  // old */
  border: 1px solid #DFDFDF; /* 14	Light Silver  #c0cbf0; // old  */
  border-radius: 14px;
  padding: 24px 20px;
  text-align: center;
  box-shadow: 0 4px 14px rgba(2,17,89,.09);
}
.ic-included-pro-icon {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid #c0cbf0;
  box-shadow: 0 2px 6px rgba(2,17,89,.07);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 14px;
}
.ic-included-pro-icon svg {
  width: 24px;
  height: 24px;
}
.ic-included-pro-item strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 4px;
}
.ic-included-pro-item span {
  font-size: 12.5px;
  color: #64748b;
  line-height: 1.5;
}

/* ══ FAQ: ลบ ::after + ใน ic-faq-noafter ══ */
.ic-faq-noafter::after { display: none !important; }

/* ══ RESPONSIVE ══ */
@media (max-width: 900px) {
  .ic-included-pro { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .ic-included-pro { grid-template-columns: repeat(2, 1fr); }
  .ic-trustbar-v2-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ── SOLUTIONS FAMILY CARDS ── */
.ic-solutions-card {
  background: #FEF5E6; /* #FEF5E6	10	Ivory  // :#d9d9d9; old */
  border:1px solid #FE9900; /* ขอบ #2B3773	3	Indigo  //  #c0c0c0  old  */
  border-radius:16px;padding:28px;
  display: flex;
  flex-direction: column;
  transition:box-shadow .2s,transform .2s;
}
.ic-solutions-card:hover { box-shadow:0 8px 28px rgba(2,17,89,.1);transform:translateY(-2px); }
.ic-solutions-card h3 { color:#0f172a;margin-bottom:8px; }
.ic-solutions-card p  { color:#334155;font-size:14.5px;margin-bottom:16px; }
.ic-solutions-card a  { font-size:14px;font-weight:700;color:#021159; }
.ic-solutions-card a:hover { color:#FF9900; }
.ic-solutions-card .price { font-size:14px;font-weight:700;color:#FF9900;margin-bottom:12px; }
 
/* ── SIC Pulse — full width strip ── */
.ic-pulse,.soft-blue-white{
margin-top:24px;background:#f8faff;border:1.5px solid #e2e8f0;border-radius:16px;padding:24px 28px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;
}
.stat-cards{
display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px;
}
.stat-cards .box{ background:#fff;border:1px solid #e2e8f0;border-radius:14px;padding:20px;text-align:center;box-shadow:0 2px 8px rgba(2,17,89,.06); }
.stat-cards .box .highlight{ font-size:26px;font-weight:800;color:#FF9900;margin-bottom:4px; }
.stat-cards .box .topic{ font-size:16px;font-weight:700;color:#03115A;margin-bottom:4px; }
.stat-cards .box .detail{ font-size:14px;color:#03115A; }
 


/* ── INFRA: image size note ──
   ชื่อไฟล์: /images/aspot/infra-[name].webp
   ขนาดแนะนำ: 600×400 px (ratio 3:2) หรือ 800×534 px
   .ic-why-photo ใช้ aspect-ratio:4/3 ── */

/* ── FAQ: override daylight.css (ใช้ ic-open แทน open, grid-template-rows แทน max-height) ── */
.ic-faq-body { display:grid !important; grid-template-rows:0fr !important; max-height:none !important; overflow:hidden; transition:grid-template-rows .28s ease !important; }
.ic-faq-body-inner { overflow:hidden; }
.ic-faq-item.ic-open .ic-faq-body { grid-template-rows:1fr !important; max-height:none !important; }
.ic-faq-btn::after { display:none !important; }
.ic-faq-item.open .ic-faq-body { max-height:none !important; }

/* ── INFRA photo card — รูปจริง ── */
.ic-why-photo { position:relative;overflow:hidden; }
.ic-why-photo-img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  aspect-ratio:4/3;
}
.ic-why-photo .ic-why-photo-fade {
  position:absolute;
  bottom:0;left:0;right:0;
  height:45%;
  pointer-events:none;
}


/* ══════════════════════════════════════════════════════════════
   HOME PAGE MOBILE FIX — v3 (June 2026)
   แทนที่ inline style ทุกจุด → class ที่ responsive ได้จริง
   ══════════════════════════════════════════════════════════════ */

/* ── Section padding (แทน style="padding:64px 0 / 72px 0") ── */
.ic-hero-section  { padding: 60px 0 48px; }
.ic-section-pad   { padding: 64px 0; }

/* ── Hero CTA buttons ── */
.ic-hero-cta {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 28px;
}

/* ── Hero trust row: fix width:24% → flex-based ── */
.ic-hero-trust     { margin-top: 36px; }
.ic-hero-trust-item { width: auto; flex: 1 1 auto; min-width: 70px; }

/* ── Flood Story: 2-col grid → 1-col mobile ── */
.ic-flood-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}

/* ── Button group (Flood CTA row) ── */
.ic-btn-group {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

/* ── Photo strip ── */
.ic-photo-strip {
  margin-top: 40px;
  margin-bottom: 12px;
  border-radius: 16px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
.ic-photo-strip-img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  display: block;
}

/* ── Product cards (Good / Better / Best) ── */
.ic-product-card {
  background: #fff;
  border-radius: 18px;
  padding: 28px;
  border: 1.5px solid #e2e8f0;
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
  display: flex;
  flex-direction: column;
}
.ic-product-card--featured {
  border: 2px solid #021159;
  box-shadow: 0 8px 32px rgba(2,17,89,.12);
}
.ic-product-card-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.ic-product-card h3 {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 8px;
}
.ic-product-card p {
  flex: 1;
  font-size: 14.5px;
  color: #334155;
  line-height: 1.65;
  margin-bottom: 0;
}
.ic-product-tier {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: #64748b;
  background: #f1f5f9;
  padding: 3px 10px;
  border-radius: 999px;
}
.ic-product-tier--featured {
  color: #021159;
  background: #eef2ff;
}
.ic-product-price {
  font-size: 15px;
  font-weight: 800;
  color: #FF9900;
  margin: 12px 0 16px;
}

/* ── News header row ── */
.ic-news-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 36px;
  flex-wrap: wrap;
  gap: 8px;
}
.ic-news-title   { margin: 0; }
.ic-news-viewall { font-size: 14px; font-weight: 700; color: #021159; text-decoration: none; white-space: nowrap; }
.ic-news-viewall:hover { color: #FF9900; }

/* ══════════════════════════════════════════════════════════════
   RESPONSIVE BREAKPOINTS
   ══════════════════════════════════════════════════════════════ */

/* ── Tablet: 768px ── */
@media (max-width: 768px) {
  /* Flood Story: stack ให้ text ก่อน แล้ว stat cards ด้านล่าง */
  .ic-flood-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  /* Photo strip: 2 cols อยู่ได้แต่ height ลดลง */
  .ic-photo-strip { gap: 4px; }
  .ic-photo-strip-img { height: 180px; }
}

/* ── Mobile: 600px ── */
@media (max-width: 600px) {
  /* Section padding ลดลง */
  .ic-hero-section  { padding: 40px 0 32px; }
  .ic-section-pad   { padding: 44px 0; }
  .ic-cta-card-section { padding: 44px 0; }

  /* Hero trust: wrap เป็น 2x2 บนมือถือ */
  .ic-hero-trust { padding: 12px 14px; gap: 0; }
  .ic-hero-trust-item {
    flex: 0 0 50%;
    padding: 8px 10px;
    box-sizing: border-box;
  }
  .ic-trust-sep { display: none; }

  /* Hero buttons: full width บนมือถือ */
  .ic-hero-cta { flex-direction: column; gap: 10px; }
  .ic-hero-cta .ic-btn { width: 100%; justify-content: center; }

  /* Photo strip: stack เป็น 1 col บนมือถือ */
  .ic-photo-strip { grid-template-columns: 1fr; gap: 4px; }
  .ic-photo-strip-img { height: 200px; }

  /* Product cards: ให้ Tier badge ลง line ใหม่ถ้าแคบ */
  .ic-product-card-header { flex-wrap: wrap; }

  /* News header: stack บนมือถือ */
  .ic-news-header { flex-direction: column; align-items: flex-start; gap: 4px; }
  .ic-news-header .ic-news-title { font-size: clamp(18px, 4vw, 24px); }
}

/* ── Very small: 400px ── */
@media (max-width: 400px) {
  .ic-hero-trust-item { flex: 0 0 100%; }
  .ic-trust-sep { display: none; }
  .ic-product-card { padding: 20px; }
  .ic-cta-card { padding: 32px 20px; }
}