/* Gói Tinh Hoa: page styles from the design <helmet>, plus hover rules. */

  :root{
    --rose:#A63A4A; --sakura:#E8A0B4; --font-sans:'Montserrat', system-ui, sans-serif;
    /* 1A — navy chọn #08204E: xanh hơn #1B2A4A, dịu hơn #01184A một bậc để nền xanh nhạt không bị chói */
    --navy-800:#05163A; --navy-700:#08204E; --navy-600:#1A3567; --navy-500:#3D5687;
    /* 1C — cách A: đỏ chỉ cho CTA, vàng cho gạch tiêu đề + đường phân cách */
    --accent-red:#E6354F; --accent-gold:#F5B14E; --accent-green:#10BA7B; --accent-blue:#4579FF;
    --rule-gold:#F5B14E;
    --grad-bridge:linear-gradient(135deg,#10BA7B 0%,#4579FF 100%);
    --grad-bridge-deep:linear-gradient(135deg,#0C9A63 0%,#2F5FE6 100%);
  }
  html{ scroll-behavior:smooth; }
  .mono{ font-variant-numeric:tabular-nums; }
  body{ margin:0; background:var(--paper); font-family:'Montserrat', system-ui, sans-serif; color:var(--navy-600); font-size:17px; line-height:1.65; }
  a{ color:var(--accent-blue); text-decoration-color:rgba(51,102,234,.35); }
  a:hover{ color:var(--navy-700); }
  h1,h2,h3{ color:var(--navy-700); line-height:1.3; letter-spacing:-.015em; margin:0; }
  p{ margin:0; text-wrap:pretty; }
  [data-dd]{ position:relative; }
  [data-dd] [data-dd-menu]{ display:none; }
  [data-dd]:hover [data-dd-menu]{ display:flex; }
  [data-parallax]{ will-change:transform; }
  @media (prefers-reduced-motion: no-preference){
    @keyframes enm-marquee{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(-50%,0,0); } }
  @keyframes om-breathe{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.035); } }
    [data-anim="sphere"]{ animation:om-breathe 5s ease-in-out infinite; }
  }
  #s8 input::placeholder, #s8 textarea::placeholder{ color:rgba(255,255,255,.62); opacity:1; }
  #s8 select option{ color:var(--navy-700); background:#fff; }
  @media (max-width:1024px){
    [data-r="hero"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="split"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="s6grid"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="s6img"]{ position:static !important; }
    [data-r="srow"]{ grid-template-columns:46px minmax(0,1fr) !important; }
    [data-r="sline"]{ left:22px !important; }
    [data-r="numrow"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="alignR"]{ text-align:left !important; margin-left:0 !important; }
    [data-r="jrow"]{ grid-template-columns:52px minmax(0,1fr) !important; }
    [data-r="jrow"] > p{ grid-column:2 !important; padding-top:6px !important; }
    [data-r="jline"]{ left:25px !important; }
    [data-r="grid5"]{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    [data-r="grid5"] > *:last-child{ grid-column:span 2 !important; }
    [data-r="grid2"]{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    [data-r="herovis"]{ min-height:0 !important; display:flex !important; flex-direction:column !important; gap:16px !important; }
    [data-r="herovis"] > div:first-child{ display:none !important; }
    [data-r="herovis"] > div[data-parallax]{ position:static !important; width:min(72%,300px) !important; align-self:center !important; }
    [data-r="herovis"] [data-r="hcard"]{ position:static !important; max-width:none !important; }
    [data-r="grid12"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="tri"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="b12"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="bspanA"], [data-r="bspanB"], [data-r="bspanC"], [data-r="bmap"]{ grid-column:auto !important; margin:0 !important; }
    [data-r="bchips"]{ margin-top:24px !important; width:100% !important; }
    [data-r="b3"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="flow"]{ grid-template-columns:minmax(0,1fr) !important; gap:34px !important; }
    [data-r="eco"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="keisen"]{ display:none !important; }
    [data-r="ecogrid"]{ grid-template-columns:minmax(0,1fr) !important; gap:36px !important; }
    [data-r="ecoarrow"]{ display:none !important; }
    [data-r="flowarrow"]{ padding:0 !important; transform:rotate(90deg); }
    [data-r="b2"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="bnow"] > div{ grid-column:auto !important; }
    [data-r="bridgelabels"] > div:last-child{ justify-self:start !important; text-align:left !important; }
    [data-r="bridgelabels"] > div:last-child p{ margin-left:0 !important; }
    [data-r="bridgelabels"] > div:last-child > div{ justify-content:flex-start !important; flex-direction:row-reverse !important; }
    [data-r="bridgemid"]{ position:static !important; transform:none !important; align-items:flex-start !important; text-align:left !important; padding:clamp(20px,3vw,40px) clamp(20px,3vw,40px) 0 !important; }
    [data-r="quote2"]{ grid-template-columns:minmax(0,1fr) !important; gap:32px !important; align-items:start !important; }
    [data-r="figure"] img{ max-width:340px !important; }
    [data-r="span"]{ grid-column:auto !important; }
    [data-r="jp"]{ display:none !important; }
    [data-r="deco"]{ display:none !important; }
    [data-r="bleed"]{ margin:0 !important; }
    [data-r="nav"]{ display:none !important; }
    [data-r="stair"]{ padding-left:0 !important; }
    [data-r="overlap"]{ margin:24px 0 0 0 !important; }
    [data-r="grid4"]{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    [data-r="anat"]{ aspect-ratio:auto !important; display:grid !important; grid-template-columns:minmax(0,38fr) minmax(0,62fr) !important; column-gap:clamp(12px,3vw,20px) !important; align-items:center !important; }
    [data-r="anat"] > div[aria-hidden]{ display:none !important; }
    [data-r="anatfig"]{ position:relative !important; inset:auto !important; grid-column:1 !important; grid-row:1 / span 8 !important; aspect-ratio:486 / 648 !important; align-self:center !important; }
    [data-r="anatsvg"]{ display:none !important; }
    [data-r="anatdotsm"]{ display:block !important; }
    [data-r="anatfig"] > img{ position:absolute !important; left:0 !important; top:0 !important; width:100% !important; height:100% !important; max-width:100% !important; transform:none !important; object-fit:fill !important; }
    [data-r="anatlbl"]{ position:relative !important; top:auto !important; left:auto !important; transform:none !important; width:auto !important; grid-column:2 !important; text-align:left !important; display:grid !important; grid-template-columns:34px minmax(0,1fr) !important; align-items:start !important; gap:0 !important; padding:9px 0 !important; min-height:44px !important; }
    [data-r="anatlbl"] > [data-r="anatcue"]{ display:flex !important; padding-top:5px; }
    [data-r="anatrail"]{ display:none !important; }
    [data-r="anatpanel"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="nfig"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="nfig"] > div:nth-child(2){ order:-1; }
    [data-r="nlabelL"]{ grid-template-columns:40px minmax(0,1fr) !important; }
    [data-r="nlabelL"] > div:first-child{ order:2; text-align:left !important; }
    [data-r="nlabelL"] > div:last-child{ order:1; }
    [data-r="grid4b"]{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    [data-r="heroshot"]{ margin-bottom:0 !important; }
    [data-r="bandcard"]{ position:static !important; width:auto !important; margin-top:clamp(20px,3vw,28px) !important; box-shadow:0 2px 6px rgba(27,42,74,.05) !important; }
    [data-r="grid3"]{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    [data-r="about2"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="svcrow"]{ flex-direction:column !important; height:auto !important; gap:14px !important; }
    [data-r="svcpanel"]{ flex:none !important; height:260px !important; }
    [data-r="svcpanel"] img, [data-r="svcpanel"] > div{ opacity:1 !important; }
    [data-r="svcpanel"] > div:nth-of-type(2){ display:none !important; }
    [data-r="grid3"] > *{ grid-column:span 1 !important; margin-top:0 !important; }
    [data-r="ctaside"]{ padding-top:24px !important; }
  }
  @media (prefers-reduced-motion: reduce){ [data-marquee]{ animation:none !important; } }
  @media (max-width:768px){
    [data-r="bandlabel"]{ display:none !important; }
    [data-r="dock"]{ right:12px !important; bottom:12px !important; }
    [data-r="ctaform"]{ padding:26px !important; border-radius:20px !important; }
    [data-r="dock"] a:first-child span:last-child span:first-child{ display:none !important; }
    [data-r="herostage"]{ min-height:0 !important; padding-bottom:340px !important; }
    [data-r="herotext"]{ max-width:100% !important; }
    [data-r="orbit"]{ width:300px !important; height:300px !important; right:50% !important; transform:translateX(50%) !important; top:auto !important; bottom:24px !important; }
    [data-r="sect"]{ padding-top:64px !important; padding-bottom:64px !important; }
    [data-r="seam"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="seam2"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="seamline"]{ display:none !important; }
    [data-r="band"]{ height:auto !important; padding-top:20px !important; padding-bottom:20px !important; }
  }
  @media (max-width:480px){
    [data-r="anat"]{ grid-template-columns:minmax(0,33fr) minmax(0,67fr) !important; column-gap:10px !important; }
    [data-r="anatlbl"]{ grid-template-columns:26px minmax(0,1fr) !important; padding:8px 0 !important; }
    [data-r="anatlbl"] > [data-r="anatcue"] > span:first-child{ width:8px !important; }
    [data-r="grid4b"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="grid5"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="grid2"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="grid4"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="form2"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="statrow"]{ grid-template-columns:minmax(0,1fr) !important; }
    [data-r="grid3"]{ grid-template-columns:minmax(0,1fr) !important; }
  }

    /* === tầng responsive chung === */
    img, svg, video{ max-width:100%; }
    [data-r="mtrigger"]{ display:none; }
    [data-r="drawer"]{ display:none; }
    #mnav{ position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
    #mnav:checked ~ [data-r="drawer"]{ display:flex; }
    @media (max-width:1024px){
      [data-r="mtrigger"]{ display:flex !important; }
      [data-r="hidemob"]{ display:none !important; }
    }
    @media (prefers-reduced-motion: reduce){ [data-marquee]{ animation:none !important; } }
  @media (max-width:768px){
    [data-r="bandlabel"]{ display:none !important; }
      [data-r="pad"]{ padding-left:18px !important; padding-right:18px !important; }
      [data-r="quote3"]{ padding-left:20px !important; padding-right:20px !important; }
      [data-r="ctaform"]{ grid-template-columns:minmax(0,1fr) !important; }
    }
    @media (max-width:480px){
    [data-r="anat"]{ grid-template-columns:minmax(0,33fr) minmax(0,67fr) !important; column-gap:10px !important; }
    [data-r="anatlbl"]{ grid-template-columns:26px minmax(0,1fr) !important; padding:8px 0 !important; }
    [data-r="anatlbl"] > [data-r="anatcue"] > span:first-child{ width:8px !important; }
    [data-r="grid4b"]{ grid-template-columns:minmax(0,1fr) !important; }
      body{ font-size:16px; }
      [data-r="sect"]{ padding-top:52px !important; padding-bottom:52px !important; }
      [data-r="pad"]{ padding-left:16px !important; padding-right:16px !important; }
    }
    header[data-hdr] a{ border-bottom:none; }
  header[data-hdr] [data-r="drawer"] a{ border-bottom:1px solid var(--border-hairline); }
  header[data-hdr] [data-r="drawer"] a:last-child, header[data-hdr] [data-r="drawer"] a[href^="tel:"]{ border-bottom:none; }

  footer a, footer a:hover{ border-bottom:none !important; text-decoration:none !important; }
  footer [data-r="ftcols"] a{ align-self:flex-start; }
  @media (max-width:1024px){ [data-r="ft"]{ grid-template-columns:minmax(0,1fr) !important; } }
  @media (max-width:600px){ [data-r="ftcols"]{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; row-gap:32px !important; } }
  [data-gbtn]{ background-image:linear-gradient(90deg,#3366EA 0%,#24B87A 34%,#FEB740 67%,#F32E49 100%) !important; background-size:0% 100% !important; background-repeat:no-repeat !important; background-position:left center !important; transition:background-size 460ms cubic-bezier(.4,0,.2,1), color 160ms cubic-bezier(.4,0,.2,1), border-color 160ms cubic-bezier(.4,0,.2,1), box-shadow 160ms cubic-bezier(.4,0,.2,1) !important; }
  [data-gbtn]:hover, [data-gbtn]:active, [data-gbtn]:focus-visible{ background-size:100% 100% !important; color:#fff !important; border-color:transparent !important; text-shadow:0 1px 2px rgba(27,42,74,.45); outline:none; }
  [data-gbtn]:hover svg, [data-gbtn]:active svg{ stroke:#fff; }
  [data-hcard]{ transition:box-shadow 180ms cubic-bezier(.4,0,.2,1); }
  [data-hcard]:hover{ box-shadow:0 16px 36px rgba(27,42,74,.14), inset 0 0 0 1.5px rgba(27,42,74,.22) !important; }
  @media (prefers-reduced-motion: reduce){ [data-gbtn], [data-hcard]{ transition:none !important; } }

  @keyframes fabpulse{ 0%{ transform:scale(1); opacity:.35; } 100%{ transform:scale(1.75); opacity:0; } }
  [data-fabring][data-on="1"]{ animation:fabpulse 2.2s cubic-bezier(.4,0,.2,1) infinite; }
  @media (prefers-reduced-motion: reduce){ [data-fabring]{ animation:none !important; } [data-fab], [data-fabmenu]{ transition:none !important; } }

/* hover */
.tinh-hoa-h0:hover { color: rgb(184, 86, 111) !important; }
.tinh-hoa-h1:hover { background: rgb(251, 240, 243) !important; }
.tinh-hoa-h2:hover { background: rgb(194, 26, 51) !important; }
.tinh-hoa-h3:hover { color: rgb(255, 255, 255) !important; background: rgba(255, 255, 255, 0.08) !important; }
.tinh-hoa-h4:hover { color: rgb(255, 255, 255) !important; }
.tinh-hoa-h5:hover { background: rgb(247, 249, 252) !important; }
