.channels-page {
  --channel-ink:#142522;
  --channel-muted:#64716e;
  --channel-green:#0f6c5b;
  --channel-mint:#dff3ed;
  --channel-cream:#f6f4ee;
  --channel-line:rgba(20,37,34,.11);
  color:var(--channel-ink);
}
.channels-page main { overflow:hidden; }
.channels-page .channels-hero {
  position:relative;
  min-height:650px;
  display:flex;
  align-items:stretch;
  background:#e8eeea var(--channels-hero) center/cover no-repeat;
  isolation:isolate;
}
.channels-page .channels-hero::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,rgba(246,249,247,.98) 0%,rgba(246,249,247,.91) 38%,rgba(246,249,247,.28) 68%,rgba(246,249,247,.08) 100%);
}
.channels-hero-inner {
  display:grid;
  grid-template-columns:minmax(0,560px) minmax(320px,1fr);
  align-items:center;
  gap:clamp(30px,4vw,60px);
  padding:132px 0 56px;
}
.channels-eyebrow,.channels-section-no {
  display:block;
  color:var(--channel-green);
  font-size:10px;
  font-weight:800;
  letter-spacing:.18em;
}
.channels-hero h1 {
  margin:17px 0 22px;
  font-size:clamp(42px,5.6vw,76px);
  line-height:1.08;
  letter-spacing:-.045em;
  font-weight:760;
}
.channels-hero-copy > p {
  max-width:580px;
  margin:0;
  color:#4f605c;
  font-size:15px;
  line-height:1.95;
}
.channels-actions { display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-top:30px; }
.channels-page main .btn { min-height:44px; padding:0 20px; border-radius:999px; }
.channels-page main .btn.primary { background:var(--channel-ink); }
.channels-text-link,.channels-arrow-link { font-weight:750; border-bottom:1px solid currentColor; padding-bottom:3px; }
.channels-text-link span,.channels-arrow-link span { margin-left:7px; }
.channels-hero-summary {
  align-self:end;
  justify-self:end;
  width:min(100%,560px);
  display:grid;
  grid-template-columns:repeat(3,1fr);
  background:rgba(255,255,255,.86);
  border:1px solid rgba(255,255,255,.74);
  border-radius:18px;
  box-shadow:0 18px 55px rgba(30,58,50,.12);
  backdrop-filter:blur(16px);
}
.channels-hero-summary div { padding:19px 20px; }
.channels-hero-summary div + div { border-left:1px solid var(--channel-line); }
.channels-hero-summary strong,.channels-hero-summary span { display:block; }
.channels-hero-summary strong { font-size:13px; white-space:nowrap; }
.channels-hero-summary span { margin-top:3px; color:var(--channel-muted); font-size:10px; }

.channels-intro,.channels-partners,.channels-digital,.channels-capabilities,.channels-contact { padding:clamp(72px,9vw,120px) 0; }
.channels-intro-grid { display:grid; grid-template-columns:1fr 1fr; gap:9vw; align-items:start; }
.channels-intro h2,.channels-heading h2,.channels-digital h2,.channels-contact h2 {
  margin:15px 0 0;
  font-size:clamp(27px,3.4vw,45px);
  line-height:1.34;
  letter-spacing:-.035em;
}
.channels-intro-copy p { margin:0; color:var(--channel-muted); font-size:14px; line-height:2; }
.channels-intro-copy p + p { margin-top:17px; }
.channels-heading { display:flex; justify-content:space-between; gap:60px; align-items:end; margin-bottom:38px; }
.channels-heading > p { max-width:430px; margin:0 0 5px; color:var(--channel-muted); font-size:13px; line-height:1.9; }
.partner-group-title { margin:0 0 14px; color:var(--channel-muted); font-size:11px; letter-spacing:.12em; }

.channels-partners { background:var(--channel-cream); }
.retail-logo-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; }
.retail-logo {
  position:relative;
  min-width:0;
  min-height:150px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:20px 12px;
  background:#fff;
  border:1px solid rgba(20,37,34,.07);
  border-radius:14px;
  transition:transform .2s ease,box-shadow .2s ease;
}
.retail-logo::after { content:"↗"; position:absolute; top:10px; right:12px; color:#a4afac; font-size:11px; opacity:0; transition:opacity .2s ease; }
.retail-logo:hover { transform:translateY(-3px); box-shadow:0 13px 30px rgba(36,52,47,.08); }
.retail-logo:hover::after,.retail-logo:focus-visible::after { opacity:1; }
.retail-logo:focus-visible { outline:2px solid var(--channel-green); outline-offset:2px; }
.retail-logo img {
  width:144px;
  max-width:100%;
  height:72px;
  display:block;
  object-fit:contain;
}
.retail-logo-hands img { transform:scale(1.12); }
.retail-logo span { color:#596561; font-size:10px; font-weight:700; text-align:center; }
.ecommerce-title { margin-top:38px; }
.commerce-link-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; }
.commerce-link-grid a { position:relative; min-height:118px; display:flex; flex-direction:column; justify-content:center; padding:22px; background:#fff; border:1px solid rgba(20,37,34,.07); border-radius:14px; transition:transform .2s ease,box-shadow .2s ease; }
.commerce-link-grid a:hover { transform:translateY(-3px); box-shadow:0 13px 30px rgba(36,52,47,.08); }
.commerce-link-grid a:focus-visible { outline:2px solid var(--channel-green); outline-offset:2px; }
.commerce-link-grid strong { font-size:20px; line-height:1.2; }
.commerce-link-grid span { margin-top:7px; color:var(--channel-muted); font-size:10px; }
.commerce-link-grid i { position:absolute; top:14px; right:16px; color:#9aa7a3; font-style:normal; }
.commerce-momo { color:#e91e63; }.commerce-pchome { color:#d90000; }.commerce-books { color:#07746c; }.commerce-etmall { color:#e7352b; }.commerce-shopee { color:#ee4d2d; }
.channels-map-cta {
  margin-top:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  padding:34px 38px;
  color:#fff;
  background:var(--channel-green);
  border-radius:18px;
}
.channels-map-cta span { font-size:9px; letter-spacing:.16em; opacity:.7; }
.channels-map-cta h3 { margin:7px 0 4px; font-size:21px; }
.channels-map-cta p { margin:0; color:rgba(255,255,255,.72); }
.channels-map-cta .btn.primary { flex:0 0 auto; background:#fff; color:var(--channel-green); }

.channels-digital { background:var(--channel-ink); color:#fff; }
.channels-digital-grid { display:grid; grid-template-columns:.88fr 1.12fr; gap:10vw; align-items:center; }
.channels-digital .channels-section-no { color:#79cbb9; }
.channels-digital-copy > p { margin:24px 0; color:rgba(255,255,255,.62); font-size:13px; line-height:2; }
.digital-platforms { display:flex; flex-wrap:wrap; gap:12px; }
.digital-platforms span { padding:15px 19px; border:1px solid rgba(255,255,255,.18); border-radius:999px; color:rgba(255,255,255,.85); font-size:12px; }

.capability-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--channel-line); border-bottom:1px solid var(--channel-line); }
.capability-grid article { padding:34px 28px 38px; }
.capability-grid article + article { border-left:1px solid var(--channel-line); }
.capability-grid article > span { color:var(--channel-green); font-size:10px; font-weight:800; letter-spacing:.14em; }
.capability-grid h3 { margin:30px 0 12px; font-size:18px; }
.capability-grid p { margin:0; color:var(--channel-muted); line-height:1.9; }

.channels-contact { padding-top:0; }
.channels-contact-inner { display:grid; grid-template-columns:1fr 1fr; gap:9vw; align-items:end; padding-top:72px; border-top:1px solid var(--channel-line); }
.channels-contact-inner > div:last-child > p { max-width:480px; margin:0; color:var(--channel-muted); font-size:13px; line-height:1.9; }

@media (max-width:1080px) {
  .channels-page .channels-hero { min-height:600px; background-position:62% center; }
  .channels-page .channels-hero::before { background:linear-gradient(90deg,rgba(246,249,247,.98) 0%,rgba(246,249,247,.88) 55%,rgba(246,249,247,.2) 100%); }
  .channels-hero-inner { grid-template-columns:1fr; gap:42px; padding:120px 0 40px; }
  .channels-hero-copy { max-width:620px; }
  .channels-hero-summary { justify-self:start; }
  .retail-logo-grid { grid-template-columns:repeat(4,1fr); }
  .commerce-link-grid { grid-template-columns:repeat(3,1fr); }
  .capability-grid { grid-template-columns:repeat(2,1fr); }
  .capability-grid article:nth-child(3) { border-left:0; border-top:1px solid var(--channel-line); }
  .capability-grid article:nth-child(4) { border-top:1px solid var(--channel-line); }
}
@media (max-width:700px) {
  .channels-page .channels-hero { min-height:640px; background-position:68% center; }
  .channels-page .channels-hero::before { background:linear-gradient(180deg,rgba(246,249,247,.98) 0%,rgba(246,249,247,.91) 58%,rgba(246,249,247,.46) 100%); }
  .channels-hero-inner { display:flex; flex-direction:column; align-items:stretch; justify-content:space-between; padding:110px 0 26px; }
  .channels-hero h1 { font-size:clamp(40px,12vw,58px); }
  .channels-hero-copy > p { font-size:13px; line-height:1.85; }
  .channels-hero-summary { width:100%; }
  .channels-hero-summary div { padding:14px 11px; }
  .channels-hero-summary strong { font-size:11px; }
  .channels-intro-grid,.channels-digital-grid,.channels-contact-inner { grid-template-columns:1fr; gap:34px; }
  .channels-heading { display:block; margin-bottom:28px; }
  .channels-heading > p { margin-top:16px; }
  .retail-logo-grid { grid-template-columns:repeat(2,1fr); }
  .commerce-link-grid { grid-template-columns:repeat(2,1fr); }
  .commerce-link-grid a:last-child { grid-column:1/-1; }
  .retail-logo { min-height:126px; }
  .retail-logo img { width:132px; height:66px; }
  .channels-map-cta { align-items:flex-start; flex-direction:column; padding:28px 24px; }
  .channels-map-cta .btn { width:100%; }
  .capability-grid { grid-template-columns:1fr; border-bottom:0; }
  .capability-grid article { padding:27px 4px; border-bottom:1px solid var(--channel-line); }
  .capability-grid article + article { border-left:0; }
  .capability-grid article:nth-child(3),.capability-grid article:nth-child(4) { border-top:0; }
  .capability-grid h3 { margin-top:15px; }
  .channels-contact-inner { padding-top:55px; }
  .channels-actions { gap:15px; }
  .channels-actions .btn { width:auto; }
}
@media (prefers-reduced-motion:reduce) {
  .retail-logo { transition:none; }
}
