/* Ester India — static site, EsoDant visual language (petrol / teal / cyan, Bai Jamjuree + Mulish). */
:root {
  --ei-bg:#F4F9F9; --ei-tint:#E2EFEF; --ei-surface:#FFFFFF;
  --ei-petrol:#123F45; --ei-petrol-2:#0C2D32; --ei-teal:#42B6A0; --ei-teal-dark:#2E8F7D; --ei-cyan:#0AB1D6; --ei-mint:#8FE3D1;
  --ei-ink:#2F3538; --ei-ink-2:#58595B; --ei-muted:#7A8487; --ei-rule:#CADCDC;
  --ei-head:"Bai Jamjuree",system-ui,sans-serif; --ei-body:"Mulish","Avenir Next","Segoe UI",system-ui,sans-serif;
  --ei-radius:14px; --ei-shadow:0 8px 30px rgba(18,63,69,.08);
}
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body { margin:0; font-family:var(--ei-body); font-size:17px; line-height:1.6; color:var(--ei-ink); background:var(--ei-bg); }
h1,h2,h3,h4,h5,h6 { font-family:var(--ei-head); color:var(--ei-ink); line-height:1.15; margin:0 0 .5em; font-weight:600; }
p { color:var(--ei-ink-2); margin:0 0 1em; }
a { color:var(--ei-teal-dark); text-decoration:none; }
a:hover { color:var(--ei-petrol); }
img { max-width:100%; height:auto; }
ul,ol { margin:0 0 1em; padding-left:1.2em; }
svg { width:11px; height:11px; }
:focus-visible { outline:3px solid var(--ei-cyan); outline-offset:2px; }

/* layout */
.ei-wrap { max-width:1160px; margin:0 auto; padding:0 1.25rem; }
.ei-section { padding:4.5rem 0; position:relative; }
.ei-band { background:var(--ei-tint); }
.ei-pagehead { padding:3.5rem 0 2.5rem; }
.ei-pagehead .ei-h1 { max-width:24ch; }
.ei-section-head { display:flex; justify-content:space-between; align-items:flex-end; gap:1rem; margin-bottom:1.6rem; flex-wrap:wrap; }
.ei-section-head h2 { margin:0; }
.ei-eyebrow { font-family:var(--ei-head); font-weight:600; letter-spacing:.14em; text-transform:uppercase; font-size:.78rem; color:var(--ei-teal); margin-bottom:.6em; }
.ei-eyebrow a { color:inherit; }
.ei-h1 { font-size:clamp(2.3rem,4.6vw,3.6rem); font-weight:600; letter-spacing:-.01em; margin:0 0 .4em; text-wrap:balance; }
.ei-h2 { font-size:clamp(1.6rem,2.8vw,2.3rem); font-weight:600; margin:0 0 .5em; text-wrap:balance; }
.ei-lead-dark { font-size:1.12rem; color:var(--ei-ink-2); max-width:66ch; }
.ei-muted { color:var(--ei-muted); font-size:.95rem; }
.ei-link { font-weight:700; color:var(--ei-teal-dark); display:inline-flex; gap:.4rem; align-items:center; }
.ei-split { display:grid; grid-template-columns:1fr 1fr; gap:3.5rem; align-items:center; }
.ei-split img { border-radius:var(--ei-radius); box-shadow:var(--ei-shadow); width:100%; height:auto; object-fit:cover; display:block; }
.ei-grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:1.3rem; }
.ei-grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:1.3rem; }
.ei-tags { display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:.9rem; }
.ei-tags span { font-size:.75rem; font-weight:700; color:var(--ei-petrol); background:var(--ei-tint); border-radius:999px; padding:.2rem .65rem; }
.ei-range-note { margin-top:1.4rem; font-size:.95rem; max-width:70ch; }

/* buttons */
.ei-btn { display:inline-flex; align-items:center; gap:.5rem; background:var(--ei-teal); color:#fff; font-weight:700; padding:.8rem 1.4rem; border-radius:999px; border:2px solid var(--ei-teal); font:inherit; font-weight:700; font-size:1rem; line-height:1.2; cursor:pointer; transition:background .15s,border-color .15s; }
.ei-btn:hover { background:var(--ei-teal-dark); border-color:var(--ei-teal-dark); color:#fff; }
.ei-btn-ghost { background:transparent; color:var(--ei-petrol); border-color:var(--ei-petrol); }
.ei-btn-ghost:hover { background:var(--ei-petrol); color:#fff; }
.ei-hero-actions { display:flex; gap:.8rem; flex-wrap:wrap; margin-top:1.4rem; }

/* header */
.ei-header { position:sticky; top:0; z-index:500; background:rgba(244,249,249,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--ei-rule); }
.ei-header .ei-wrap { display:flex; align-items:center; justify-content:space-between; height:74px; gap:1rem; }
.ei-logo img { height:36px; width:auto; display:block; }
.ei-nav ul { list-style:none; margin:0; padding:0; display:flex; align-items:center; gap:1.6rem; }
.ei-nav li a { color:var(--ei-ink); font-weight:600; font-size:1rem; }
.ei-nav li a:hover, .ei-nav li.current > a { color:var(--ei-teal-dark); }
.ei-nav li.btn-menu a { background:var(--ei-teal); color:#fff; border-radius:999px; padding:.55rem 1.15rem; font-weight:700; }
.ei-nav li.btn-menu a:hover { background:var(--ei-teal-dark); }
.ei-burger { display:none; width:40px; height:40px; border:0; background:transparent; cursor:pointer; flex-direction:column; justify-content:center; gap:5px; }
.ei-burger span { display:block; height:2px; background:var(--ei-petrol); border-radius:2px; }
@media (max-width: 900px) {
  .ei-burger { display:flex; }
  .ei-nav { position:fixed; top:74px; left:0; right:0; background:var(--ei-bg); border-bottom:1px solid var(--ei-rule); padding:1rem 1.25rem 1.5rem; display:none; }
  .ei-nav.is-open { display:block; }
  .ei-nav ul { flex-direction:column; align-items:stretch; gap:.2rem; }
  .ei-nav li a { display:block; padding:.7rem 0; font-size:1.1rem; }
  .ei-nav li.btn-menu { margin-top:.6rem; }
  .ei-nav li.btn-menu a { display:inline-block; }
}

/* hero */
.ei-hero { position:relative; color:#fff; min-height:560px; display:flex; align-items:center; background-position:center 60%; background-size:cover; background-repeat:no-repeat; }
.ei-hero::before { content:""; position:absolute; inset:0; background:linear-gradient(100deg, rgba(18,63,69,.95) 0%, rgba(18,63,69,.82) 45%, rgba(18,63,69,.3) 100%); }
.ei-hero .ei-wrap { position:relative; width:100%; }
.ei-hero-inner { padding:5rem 0; max-width:680px; }
.ei-hero h1 { color:#fff; }
.ei-hero .ei-eyebrow { color:var(--ei-mint); }
.ei-hero .ei-lead { color:rgba(255,255,255,.88); font-size:1.08rem; }
.ei-hero .ei-btn-ghost { color:#fff; border-color:#fff; }
.ei-hero .ei-btn-ghost:hover { background:#fff; color:var(--ei-petrol); }

/* cards */
.ei-card { display:flex; flex-direction:column; background:var(--ei-surface); border:1px solid var(--ei-rule); border-radius:var(--ei-radius); overflow:hidden; color:var(--ei-ink); box-shadow:var(--ei-shadow); transition:transform .15s, box-shadow .15s; }
.ei-card:hover { transform:translateY(-3px); box-shadow:0 14px 36px rgba(18,63,69,.14); color:var(--ei-ink); }
.ei-card > img { aspect-ratio:16/10; object-fit:cover; width:100%; height:auto; display:block; }
.ei-card-body { padding:1.25rem 1.4rem 1.4rem; display:flex; flex-direction:column; flex:1; }
.ei-card h3 { margin:0 0 .4rem; font-size:1.15rem; font-weight:600; }
.ei-card p { font-size:.93rem; margin:0 0 .9rem; }
.ei-card-cta { margin-top:auto; font-weight:700; color:var(--ei-teal-dark); display:inline-flex; gap:.4rem; align-items:center; }
.ei-grade { border-top:4px solid var(--ei-teal); }
.ei-grade-name { font-family:var(--ei-head); color:var(--ei-petrol); display:flex; align-items:baseline; gap:.35rem; margin-bottom:.4rem; }
.ei-grade-name span { font-size:.95rem; font-weight:600; letter-spacing:.02em; }
.ei-grade-name b { font-size:1.8rem; font-weight:700; line-height:1; }
.ei-grade-inci { font-weight:700; color:var(--ei-ink); font-size:.9rem !important; }

/* dark band */
.ei-dark { position:relative; overflow:hidden; background:var(--ei-petrol); color:rgba(255,255,255,.82); padding:4.5rem 0; }
.ei-dark > svg { position:absolute; inset:0; width:100%; height:100%; }
.ei-dark .ei-wrap { position:relative; }
.ei-dark h3 { color:#fff; font-size:1.05rem; margin:.5rem 0 .4rem; font-weight:600; }
.ei-dark p { color:rgba(255,255,255,.82); font-size:.95rem; margin:0; }
.ei-dark img { height:52px; width:auto; border-radius:8px; display:block; }
.ei-num { font-family:var(--ei-head); font-size:2.6rem; font-weight:700; color:var(--ei-mint); line-height:1; font-variant-numeric:tabular-nums; }
.ei-usps > div { border-left:1px solid rgba(255,255,255,.2); padding-left:1.2rem; }
.ei-usps span { color:var(--ei-mint); font-family:var(--ei-head); font-weight:600; font-size:1.25rem; display:block; margin-bottom:.6rem; }
.ei-usps h4 { color:#fff; font-size:1.1rem; margin-bottom:.4rem; }

/* tables */
.ei-brands { overflow-x:auto; border:1px solid var(--ei-rule); border-radius:var(--ei-radius); background:var(--ei-surface); box-shadow:var(--ei-shadow); }
.ei-brands table { width:100%; border-collapse:collapse; font-size:.95rem; margin:0; }
.ei-brands th, .ei-brands td { text-align:left; padding:.9rem 1.1rem; border-top:1px solid var(--ei-rule); vertical-align:top; }
.ei-brands th { font-family:var(--ei-head); font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ei-muted); border-top:none; background:var(--ei-tint); white-space:nowrap; }
.ei-brands td:first-child { font-weight:700; color:var(--ei-petrol); white-space:nowrap; }
.ei-brands td a { font-weight:700; display:inline-flex; gap:.4rem; align-items:center; white-space:nowrap; }
.ei-range td { font-size:.93rem; }
.ei-range .ei-cas { font-variant-numeric:tabular-nums; color:var(--ei-ink-2); white-space:nowrap; }
.ei-range-cat { font-size:1.15rem; font-weight:600; color:var(--ei-petrol); margin:2rem 0 .8rem; display:flex; align-items:baseline; gap:.6rem; }
.ei-range-cat:first-of-type { margin-top:.5rem; }
.ei-range-cat span { font-family:var(--ei-body); font-weight:700; font-size:.75rem; color:var(--ei-teal-dark); background:var(--ei-surface); border:1px solid var(--ei-rule); border-radius:999px; padding:.1rem .55rem; }

/* values / team / timeline / certs */
.ei-value { background:var(--ei-surface); border:1px solid var(--ei-rule); border-radius:var(--ei-radius); box-shadow:var(--ei-shadow); padding:1.6rem 1.8rem; }
.ei-value h3 { color:var(--ei-petrol); font-size:1.15rem; }
.ei-value p { font-size:.95rem; margin:0; }
.ei-split .ei-value { box-shadow:none; margin-bottom:.9rem; }
.ei-person { background:var(--ei-surface); border:1px solid var(--ei-rule); border-radius:var(--ei-radius); overflow:hidden; box-shadow:var(--ei-shadow); padding-bottom:1.2rem; }
.ei-person img, .ei-person-blank { width:100%; aspect-ratio:4/4.3; object-fit:cover; object-position:top; display:block; background:var(--ei-tint); }
.ei-person-blank { background:linear-gradient(160deg, var(--ei-tint), #CFE3E3); }
.ei-person h4 { color:var(--ei-petrol); font-size:1.15rem; margin:1rem 1.4rem .2rem; }
.ei-person h5 { color:var(--ei-muted); font-family:var(--ei-body); font-weight:600; font-size:.9rem; margin:0 1.4rem .3rem; }
.ei-person p { font-size:.9rem; margin:0 1.4rem; }
.ei-timeline { list-style:none; padding:0; margin:0; display:grid; gap:.6rem; max-width:860px; }
.ei-timeline li { display:grid; grid-template-columns:5.5rem 1fr; gap:1rem; align-items:baseline; background:var(--ei-surface); border:1px solid var(--ei-rule); border-radius:12px; padding:.8rem 1.1rem; }
.ei-timeline b { font-family:var(--ei-head); color:#fff; background:var(--ei-teal); border-radius:999px; text-align:center; padding:.15rem .6rem; font-size:.95rem; }
.ei-timeline span { color:var(--ei-ink-2); font-size:.95rem; }
.ei-certs { list-style:none; padding:0; margin:0; display:grid; gap:1rem; }
.ei-certs li { display:grid; grid-template-columns:96px 1fr; gap:1.4rem; align-items:center; background:var(--ei-surface); border:1px solid var(--ei-rule); border-radius:var(--ei-radius); padding:1.2rem 1.4rem; }
.ei-certs img { width:96px; height:96px; object-fit:contain; border-radius:12px; }
.ei-cert-badge { width:96px; height:96px; border-radius:12px; background:var(--ei-petrol); color:var(--ei-mint); font-family:var(--ei-head); font-weight:700; display:flex; align-items:center; justify-content:center; text-align:center; line-height:1.2; font-size:.95rem; }
.ei-certs h4 { color:var(--ei-petrol); font-size:1.15rem; margin-bottom:.3rem; }
.ei-certs p { margin:0; font-size:.95rem; }

/* logos */
.ei-logos { display:grid; grid-template-columns:repeat(8,1fr); gap:1rem; margin-top:1.6rem; }
.ei-logos div { background:var(--ei-surface); border:1px solid var(--ei-rule); border-radius:10px; padding:.6rem; display:flex; align-items:center; justify-content:center; aspect-ratio:4/3; }
.ei-logos img { max-height:100%; max-width:100%; object-fit:contain; mix-blend-mode:multiply; }

/* posts */
.ei-post .ei-date { font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ei-muted); font-family:var(--ei-head); font-weight:600; }
.ei-post h3 { font-size:1.02rem; margin:.3rem 0 .5rem; }
.ei-article .ei-wrap { max-width:860px; }
.ei-post-hero { width:100%; border-radius:var(--ei-radius); box-shadow:var(--ei-shadow); margin-bottom:2rem; display:block; }
.ei-prose p { font-size:1.05rem; max-width:70ch; }

/* forms + contact */
.ei-contact-grid { display:grid; grid-template-columns:1.4fr 1fr; gap:2.5rem; align-items:start; }
.ei-form { background:var(--ei-surface); border:1px solid var(--ei-rule); border-radius:var(--ei-radius); box-shadow:var(--ei-shadow); padding:2.2rem; }
.ei-form label { display:block; font-weight:700; font-size:.9rem; color:var(--ei-petrol); margin-bottom:.9rem; }
.ei-form input, .ei-form textarea { display:block; width:100%; margin-top:.35rem; border:1px solid var(--ei-rule); border-radius:12px; padding:.75rem 1rem; background:var(--ei-bg); font:inherit; font-size:1rem; color:var(--ei-ink); }
.ei-form textarea { resize:vertical; }
.ei-form .ei-two { display:grid; grid-template-columns:1.6fr 1fr; gap:.8rem; }
.ei-form .ei-btn { margin-top:.4rem; }
.ei-form .ei-muted { margin:1rem 0 0; }
.ei-hp { position:absolute !important; left:-9999px !important; width:1px; height:1px; opacity:0; }
.ei-notice { padding:.8rem 1rem; border-radius:12px; font-weight:600; }
.ei-ok { background:#DDF3EA; color:#1F6B55; }
.ei-err { background:#F9DEDB; color:#A3362E; }
.ei-contact-box { background:linear-gradient(160deg, var(--ei-petrol) 0%, #1B5C63 100%); border-radius:var(--ei-radius); color:#fff; padding:2rem 2.2rem; }
.ei-contact-box h3 { color:#fff; font-size:1.5rem; }
.ei-contact-box ul { list-style:none; padding:0; margin:0; }
.ei-contact-box li { padding:.8rem 0; border-bottom:1px solid rgba(255,255,255,.18); }
.ei-contact-box li:last-child { border-bottom:0; }
.ei-contact-box h5 { color:var(--ei-mint); font-family:var(--ei-body); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; margin:0 0 .2rem; }
.ei-contact-box a, .ei-contact-box p { color:#fff; font-size:1.02rem; margin:0; }
.ei-contact-box a:hover { color:var(--ei-mint); }
.ei-faqs { max-width:860px; }
details.ei-faq { background:var(--ei-surface); border:1px solid var(--ei-rule); border-radius:var(--ei-radius); box-shadow:var(--ei-shadow); margin-bottom:.9rem; padding:0 1.6rem; }
details.ei-faq summary { cursor:pointer; list-style:none; font-family:var(--ei-head); font-weight:600; font-size:1.08rem; color:var(--ei-petrol); padding:1.2rem 0; display:flex; justify-content:space-between; gap:1rem; }
details.ei-faq summary::-webkit-details-marker { display:none; }
details.ei-faq summary::after { content:"+"; color:var(--ei-teal); font-weight:700; font-size:1.3rem; line-height:1; }
details.ei-faq[open] summary::after { content:"–"; }
details.ei-faq p { padding-bottom:1.2rem; margin:0; max-width:70ch; }

/* cta + footer */
.ei-cta { text-align:center; }
.ei-cta p { max-width:60ch; margin:0 auto 1.4rem; }
.ei-footer { background:var(--ei-petrol-2); color:rgba(255,255,255,.82); padding:3.5rem 0 0; }
.ei-footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1.3fr; gap:2.5rem; padding-bottom:2.5rem; }
.ei-footer h4 { color:#fff; font-size:1rem; margin:0 0 .9rem; font-weight:600; }
.ei-footer ul { list-style:none; margin:0; padding:0; display:grid; gap:.45rem; }
.ei-footer a { color:rgba(255,255,255,.82); }
.ei-footer a:hover { color:#fff; }
.ei-footer p { color:rgba(255,255,255,.82); font-size:.95rem; }
.ei-footer .ei-brand img { height:30px; width:auto; margin-bottom:1rem; }
.ei-subscribe { display:grid; gap:.6rem; }
.ei-subscribe input[type=email] { border-radius:999px; border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.06); color:#fff; padding:.65rem 1rem; font:inherit; width:100%; }
.ei-subscribe .ei-btn { justify-self:start; padding:.55rem 1.2rem; font-size:.95rem; }
.ei-footer-bottom { border-top:1px solid rgba(255,255,255,.12); padding:1.1rem 0; font-size:.85rem; display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.ei-footer-bottom p { margin:0; font-size:.85rem; }

@media (max-width: 960px) { .ei-grid-4 { grid-template-columns:1fr 1fr; } .ei-grid-3 { grid-template-columns:1fr 1fr; } .ei-logos { grid-template-columns:repeat(4,1fr); } .ei-footer-grid { grid-template-columns:1fr 1fr; } .ei-contact-grid { grid-template-columns:1fr; } }
@media (max-width: 720px) { .ei-split, .ei-grid-4, .ei-grid-3, .ei-footer-grid { grid-template-columns:1fr; } .ei-hero { min-height:0; } .ei-hero-inner { padding:3.5rem 0; } .ei-section { padding:3rem 0; } .ei-timeline li { grid-template-columns:1fr; gap:.3rem; } .ei-timeline b { justify-self:start; } .ei-certs li { grid-template-columns:1fr; } .ei-form { padding:1.4rem; } .ei-form .ei-two { grid-template-columns:1fr; } }
@media (prefers-reduced-motion: reduce) { .ei-card { transition:none; } html { scroll-behavior:auto; } }