/*
Theme Name: Face Yoga Vietnam
Theme URI: https://faceyogavietnam.com
Author: Mai Linh
Description: Theme chính thức của Face Yoga Vietnam - trẻ hóa khuôn mặt tự nhiên.
Version: 1.0
*/
/* ===== index.html ===== */

  :root{
    --ground:#FAF6F0; --raise:#FFFFFF; --ink:#26312A; --ink-soft:#495249;
    --muted:#7A837A; --line:#E7E0D4; --line-2:#F0EBE1;
    --sage:#84977E; --sage-deep:#5C6E56; --sage-wash:#EAEFE5;
    --rose:#C6837490; --rose-solid:#C68374; --rose-deep:#A5604F; --rose-wash:#F6E8E2;
    --gold:#BE9B62;
    --sh:0 2px 6px rgba(38,49,42,.05), 0 18px 44px rgba(38,49,42,.07);
    --sh-sm:0 1px 3px rgba(38,49,42,.06);
  }
  *{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%; scroll-behavior:smooth;}
  body{margin:0; background:var(--ground); color:var(--ink);
    font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;
    font-size:17px; line-height:1.7; letter-spacing:-.006em;
    -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
  /* Apple display face (SF Pro Display) — class name kept for markup stability */
  .serif{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;
    letter-spacing:-.022em;}
  .wrap{max-width:1320px; margin:0 auto; padding:0 26px;}
  h1,h2,h3{margin:0; line-height:1.14; text-wrap:balance; letter-spacing:-.01em;}
  p{margin:0;}
  a{color:inherit; text-decoration:none;}
  :focus-visible{outline:2px solid var(--rose-deep); outline-offset:3px;}
  .eyebrow{font-size:12.5px; letter-spacing:.22em; text-transform:uppercase; color:var(--sage-deep); font-weight:700;}

  /* NAV */
  .nav{position:sticky; top:0; z-index:20; backdrop-filter:blur(10px);
    background:rgba(250,246,240,.82); border-bottom:1px solid var(--line);}
  .nav .wrap{display:flex; align-items:center; gap:24px; height:72px;}
  .brand{display:flex; align-items:center; gap:11px; font-weight:700; letter-spacing:.01em; margin-right:auto;}
  .logo{width:34px; height:34px; flex:none;}
  .logo-img{height:53px; width:auto; display:block;}
  .foot .logo-img{height:54px;}
  @media(max-width:600px){ .logo-img{height:44px;} .foot .logo-img{height:48px;} }
  .navlinks{display:flex; gap:28px; font-size:15px; color:var(--ink-soft);}
  .navlinks a:hover{color:var(--rose-deep);}
  .soon{font-size:10px; letter-spacing:.08em; background:var(--sage-wash); color:var(--sage-deep); padding:2px 7px; border-radius:100px; margin-left:6px; vertical-align:middle; font-weight:700;}
  .btn{display:inline-flex; align-items:center; gap:8px; border-radius:100px; font-weight:650; font-size:15px; padding:11px 22px; cursor:pointer; border:1px solid transparent; transition:.2s;}
  .btn-primary{background:var(--sage-deep); color:#fff;}
  .btn-primary:hover{background:#4a5a45;}
  .btn-ghost{border-color:var(--line); color:var(--ink); background:var(--raise);}
  .btn-ghost:hover{border-color:var(--sage);}
  @media(max-width:860px){ .navlinks{display:none;} }

  /* HERO */
  .hero{position:relative; overflow:hidden;
    background:radial-gradient(120% 100% at 90% -20%, var(--rose-wash) 0%, transparent 52%),
               radial-gradient(90% 90% at -10% 10%, var(--sage-wash) 0%, transparent 55%);}
  .hero .wrap{display:grid; grid-template-columns:1.05fr .95fr; gap:52px; align-items:center; padding:70px 26px 84px;}
  .hero-eyebrow{display:flex; align-items:center; gap:10px; margin-bottom:22px;}
  .hero-eyebrow::before{content:""; width:26px; height:1px; background:var(--rose-solid);}
  .hero h1{font-size:clamp(38px,5.6vw,62px); font-weight:600;}
  .hero h1 em{font-style:italic; color:var(--rose-deep);}
  .hero-p{margin-top:24px; font-size:19px; color:var(--ink-soft); max-width:44ch;}
  .hero-cta{display:flex; flex-wrap:wrap; gap:14px; margin-top:32px;}
  .hero-stats{display:flex; gap:34px; margin-top:40px;}
  .hero-stats div{border-left:2px solid var(--rose-solid); padding-left:14px;}
  .hero-stats b{display:block; font-size:26px; font-weight:700;}
  .hero-stats span{font-size:13px; color:var(--muted);}
  /* hero art */
  .art{position:relative; aspect-ratio:4/5; border-radius:200px 200px 24px 24px; overflow:hidden;
    background:linear-gradient(160deg,#DCE4D3,#EAD9CF 55%,#E7C9BC); box-shadow:var(--sh);}
  .art svg{position:absolute; inset:0; width:100%; height:100%;}
  .hero-person{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center bottom; display:block;
    -webkit-mask-image:linear-gradient(to bottom,#000 82%, rgba(0,0,0,0) 99%);
            mask-image:linear-gradient(to bottom,#000 82%, rgba(0,0,0,0) 99%);
    filter:drop-shadow(0 5px 16px rgba(38,49,42,.09));}
  .art .cap{position:absolute; left:16px; bottom:16px; background:rgba(255,255,255,.85); backdrop-filter:blur(4px);
    font-size:12px; color:var(--ink-soft); padding:7px 13px; border-radius:100px;}
  .badge-float{position:absolute; top:22px; right:-8px; background:#fff; border-radius:16px; box-shadow:var(--sh);
    padding:12px 16px; font-size:13px; display:flex; gap:10px; align-items:center;}
  .badge-float b{font-size:15px;}
  @media(max-width:860px){ .hero .wrap{grid-template-columns:1fr; gap:36px; padding:48px 26px 60px;} .art{max-width:360px;} .badge-float{display:none !important;} }

  /* SECTIONS */
  section{padding:76px 0;}
  #what{background:var(--raise); border-top:1px solid var(--line);}
  .sec-head{max-width:640px; margin-bottom:14px;}
  .sec-head h2{font-size:clamp(28px,4vw,42px); font-weight:600; margin-top:14px;}
  .sec-head p{margin-top:16px; color:var(--ink-soft); font-size:18px;}
  .center{text-align:center; margin-left:auto; margin-right:auto;}

  /* WHAT — cards */
  .grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:96px;}
  @media(max-width:860px){ .grid3{grid-template-columns:1fr;} }
  .feat{position:relative; background:var(--raise); border:1px solid var(--line); border-radius:24px;
    padding:18px 26px 18px 162px; box-shadow:var(--sh); overflow:visible; min-height:104px;
    display:flex; flex-direction:column; justify-content:center;}
  .feat-photo{position:absolute; left:-22px; bottom:0; width:172px; height:auto; z-index:2; pointer-events:none;
    -webkit-mask-image:linear-gradient(to bottom,#000 86%, rgba(0,0,0,0) 100%);
            mask-image:linear-gradient(to bottom,#000 86%, rgba(0,0,0,0) 100%);
    filter:drop-shadow(0 10px 16px rgba(38,49,42,.16));}
  .feat-photo-img{width:100%; height:auto; display:block; transform:scaleX(-1);}
  .feat.rev .feat-photo-img{transform:none;}
  .feat.rev{padding:18px 162px 18px 26px; text-align:right;}
  .feat.rev .feat-photo{left:auto; right:-22px;}
  @media(max-width:600px){
    .feat, .feat.rev{padding:18px 150px 18px 24px; text-align:left;}
    .feat .feat-photo, .feat.rev .feat-photo{left:auto; right:-16px; width:150px;}
    .feat .feat-photo-img{transform:none;}
  }
  .feat h3{font-size:20px; font-weight:600;}
  .feat p{margin-top:10px; color:var(--ink-soft); font-size:15.5px;}

  /* FOUNDER band */
  .band{background:var(--raise); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
  .founder{display:grid; grid-template-columns:.8fr 1.2fr; gap:48px; align-items:center;}
  .fportrait{aspect-ratio:1; border-radius:28px; background:linear-gradient(150deg,#E7C9BC,#DCE4D3); box-shadow:var(--sh); position:relative; overflow:hidden;}
  .fportrait svg{position:absolute; inset:0; width:100%; height:100%;}
  .fportrait-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; transform:scaleX(-1); display:block;}
  .founder blockquote{margin:20px 0 0; font-size:22px; line-height:1.5; font-weight:500;}
  .founder .sign{margin-top:22px; font-size:15px; color:var(--muted);}
  .founder .sign b{color:var(--ink); display:block; font-size:17px;}
  @media(max-width:860px){ .founder{grid-template-columns:1fr; gap:28px;} .fportrait{max-width:320px;} }

  /* SOCIAL — key phase-1 */
  .social-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:44px;}
  @media(max-width:860px){ .social-grid{grid-template-columns:1fr;} }
  .soc{border-radius:20px; padding:28px 26px; color:#fff; position:relative; overflow:hidden; box-shadow:var(--sh); display:flex; flex-direction:column; gap:6px; min-height:180px;}
  .soc.tt{background:linear-gradient(150deg,#25252b,#3a3a44);}
  .soc.fb{background:linear-gradient(150deg,#3b5a9a,#4267B2);}
  .soc.yt{background:linear-gradient(150deg,#b8272b,#cc332f);}
  .soc.ig{background:linear-gradient(135deg,#f9ce34 0%,#ee2a7b 45%,#6228d7 100%);}
  .soc .sic{width:44px; height:44px;}
  .soc h3{font-size:20px; font-weight:650; margin-top:8px;}
  .soc .handle{font-size:14px; opacity:.85;}
  .soc .go{margin-top:auto; font-weight:650; font-size:14px; display:flex; align-items:center; gap:7px;}

  /* COMING SOON + email */
  .cta-band{border-radius:28px; padding:56px 44px; text-align:center;
    background:linear-gradient(150deg,var(--sage-deep),#43533f); color:#fff; box-shadow:var(--sh); position:relative; overflow:hidden;}
  .cta-band .halo{position:absolute; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,rgba(198,131,116,.4),transparent 70%); top:-160px; right:-100px;}
  .cta-band .eyebrow{color:#D9C7A8;}
  .cta-band h2{font-size:clamp(28px,4vw,40px); font-weight:600; margin-top:14px; color:#fff;}
  .cta-band p{margin-top:14px; color:rgba(255,255,255,.82); max-width:52ch; margin-left:auto; margin-right:auto;}
  .emailform{display:flex; gap:10px; max-width:460px; margin:28px auto 0; flex-wrap:wrap; justify-content:center; position:relative;}
  .emailform input{flex:1; min-width:220px; border:none; border-radius:100px; padding:14px 20px; font-size:15px; background:rgba(255,255,255,.95);}
  .emailform .btn-primary{background:var(--rose-solid);}
  .emailform .btn-primary:hover{background:var(--rose-deep);}
  .mini{margin-top:14px; font-size:13px; color:rgba(255,255,255,.6);}

  /* FOOTER */
  footer{padding:56px 0 40px; background:var(--raise); border-top:1px solid var(--line);}
  .foot{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:30px;}
  .foot h4{font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); font-weight:700; margin-bottom:14px;}
  .foot ul{list-style:none; margin:0; padding:0; display:grid; gap:9px; font-size:15px; color:var(--ink-soft);}
  .foot a:hover{color:var(--rose-deep);}
  .foot .brand{margin-bottom:14px;}
  .zalo{display:inline-flex; gap:8px; align-items:center; background:var(--sage-wash); color:var(--sage-deep); font-weight:650; padding:9px 16px; border-radius:100px; font-size:14px; margin-top:6px;}
  .copyright{border-top:1px solid var(--line); margin-top:40px; padding-top:22px; font-size:13px; color:var(--muted); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}
  @media(max-width:860px){ .foot{grid-template-columns:1fr 1fr;} }
  @media(prefers-reduced-motion:no-preference){ .feat,.soc{transition:transform .2s;} .feat:hover,.soc:hover{transform:translateY(-3px);} }

  /* ============ RESPONSIVE + MOBILE NAV ============ */
  .foot-intro{color:var(--ink-soft); font-size:15px; line-height:1.75; max-width:52ch;}
  .navtoggle{position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; clip:rect(0 0 0 0);}
  .hamburger{display:none; margin-left:6px; width:44px; height:44px; border-radius:12px; cursor:pointer; flex:none;
    align-items:center; justify-content:center; flex-direction:column; gap:5px;
    border:1px solid var(--line); background:var(--raise);}
  .hamburger span{display:block; width:20px; height:2px; background:var(--ink); border-radius:2px; transition:transform .25s, opacity .2s;}
  .navtoggle:focus-visible + .hamburger{outline:2px solid var(--rose-deep); outline-offset:2px;}
  .navcta-m{display:none;}

  @media(max-width:1024px){
    .wrap{padding:0 22px;}
    section{padding:60px 0;}
    .grid3, .social-grid{grid-template-columns:repeat(2,1fr);}
    .hero .wrap{gap:40px;}
  }
  @media(max-width:860px){
    .nav .wrap{gap:10px;}
    .hamburger{display:flex;}
    .nav .wrap > a.btn{display:none;}
    .navlinks{display:none; position:absolute; top:72px; left:0; right:0;
      flex-direction:column; gap:0; padding:8px 22px 16px;
      background:var(--ground); border-bottom:1px solid var(--line); box-shadow:var(--sh);}
    .navtoggle:checked ~ .navlinks{display:flex;}
    .navtoggle:checked ~ .hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
    .navtoggle:checked ~ .hamburger span:nth-child(2){opacity:0;}
    .navtoggle:checked ~ .hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
    .navlinks a{padding:13px 4px; font-size:16px; border-bottom:1px solid var(--line-2); color:var(--ink);}
    .navlinks a.navcta-m{display:inline-flex; justify-content:center; color:#fff; border-bottom:none; margin-top:12px;}
  }
  @media(max-width:600px){
    .wrap{padding:0 18px;}
    section{padding:48px 0;}
    .grid3, .social-grid{grid-template-columns:1fr;}
    .hero-stats{flex-wrap:wrap; gap:16px 24px;}
    .hero .wrap{padding:34px 18px 44px;}
    .cta-band{padding:40px 20px;}
    .founder blockquote{font-size:20px;}
  }
  @media(max-width:400px){
    .foot{grid-template-columns:1fr;}
    .hero-stats{gap:14px 18px;}
  }

/* ===== gioi-thieu.html ===== */

  :root{
    --ground:#FAF6F0; --raise:#FFFFFF; --ink:#26312A; --ink-soft:#495249;
    --muted:#7A837A; --line:#E7E0D4; --line-2:#F0EBE1;
    --sage:#84977E; --sage-deep:#5C6E56; --sage-wash:#EAEFE5;
    --rose:#C68374; --rose-deep:#A5604F; --rose-wash:#F6E8E2;
    --gold:#BE9B62; --gold-wash:#F3E9D5;
    --sh:0 2px 6px rgba(38,49,42,.05), 0 18px 44px rgba(38,49,42,.07);
    --sh-sm:0 1px 3px rgba(38,49,42,.06);
  }
  :root[data-theme="light"]{ --ground:#FAF6F0; --raise:#FFFFFF; }
  *{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; color-scheme:light;}
  body{margin:0; background:var(--ground); color:var(--ink);
    font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;
    font-size:17px; line-height:1.7; letter-spacing:-.006em; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
  .display{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif; letter-spacing:-.022em;}
  .wrap{max-width:1320px; margin:0 auto; padding:0 26px;}
  .narrow{max-width:820px; margin:0 auto; padding:0 26px;}
  h1,h2,h3,h4{margin:0; line-height:1.16; text-wrap:balance;}
  p{margin:0;}
  img{display:block; max-width:100%;}
  a{color:inherit; text-decoration:none;}
  :focus-visible{outline:2px solid var(--rose-deep); outline-offset:3px;}
  .eyebrow{font-size:12.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--sage-deep); font-weight:700;}

  /* NAV */
  .nav{position:-webkit-sticky; position:sticky; top:0; z-index:50; backdrop-filter:blur(10px); background:rgba(250,246,240,.85); border-bottom:1px solid var(--line);}
  .nav .wrap{display:flex; align-items:center; gap:24px; height:72px;}
  .brand{margin-right:auto; display:flex; align-items:center;}
  .logo-img{height:53px; width:auto; display:block;}
  .navlinks{display:flex; gap:28px; font-size:15px; color:var(--ink-soft);}
  .navlinks a:hover,.navlinks a.active{color:var(--rose-deep);} .navlinks a.active{font-weight:650;}
  .soon{font-size:10px; letter-spacing:.08em; background:var(--sage-wash); color:var(--sage-deep); padding:2px 7px; border-radius:100px; margin-left:6px; font-weight:700;}
  .btn{display:inline-flex; align-items:center; gap:8px; border-radius:100px; font-weight:650; font-size:15px; padding:11px 22px; cursor:pointer; border:1px solid transparent; transition:.2s;}
  .btn-primary{background:var(--sage-deep); color:#fff;} .btn-primary:hover{background:#4a5a45;}
  .btn-ghost{border-color:var(--line); color:var(--ink); background:var(--raise);} .btn-ghost:hover{border-color:var(--sage);}
  .navtoggle{position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; clip:rect(0 0 0 0);}
  .hamburger{display:none; margin-left:6px; width:44px; height:44px; border-radius:12px; cursor:pointer; flex:none; align-items:center; justify-content:center; flex-direction:column; gap:5px; border:1px solid var(--line); background:var(--raise);}
  .hamburger span{display:block; width:20px; height:2px; background:var(--ink); border-radius:2px; transition:transform .25s,opacity .2s;}
  .navtoggle:focus-visible + .hamburger{outline:2px solid var(--rose-deep); outline-offset:2px;}
  .navcta-m{display:none;}
  @media(max-width:860px){
    .hamburger{display:flex;} .nav .wrap > a.btn{display:none;} .nav .wrap{gap:10px;}
    .navlinks{display:none; position:absolute; top:72px; left:0; right:0; flex-direction:column; gap:0; padding:8px 22px 16px; background:var(--ground); border-bottom:1px solid var(--line); box-shadow:var(--sh);}
    .navtoggle:checked ~ .navlinks{display:flex;}
    .navtoggle:checked ~ .hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
    .navtoggle:checked ~ .hamburger span:nth-child(2){opacity:0;}
    .navtoggle:checked ~ .hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
    .navlinks a{padding:13px 4px; font-size:16px; border-bottom:1px solid var(--line-2); color:var(--ink);}
    .navlinks a.navcta-m{display:inline-flex; justify-content:center; color:#fff; border-bottom:none; margin-top:12px; background:var(--sage-deep); border-radius:100px;}
  }

  /* HERO */
  .hero{background:radial-gradient(120% 130% at 90% -30%, var(--rose-wash) 0%, transparent 55%), radial-gradient(90% 100% at -5% 0%, var(--sage-wash) 0%, transparent 55%); border-bottom:1px solid var(--line);}
  .hero .narrow{padding:40px 26px 54px; text-align:center;}
  .crumb{font-size:13.5px; color:var(--muted); margin-bottom:20px;}
  .crumb a:hover{color:var(--rose-deep);} .crumb span{color:var(--ink-soft);}
  .hero h1{font-size:clamp(34px,5.4vw,54px); font-weight:600; margin-top:14px;}
  .hero .sub{font-size:19px; color:var(--ink-soft); max-width:60ch; margin:18px auto 0;}

  section{padding:64px 0;}
  #what{background:var(--raise); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}

  /* FOUNDER */
  .founder{display:grid; grid-template-columns:.9fr 1.1fr; gap:52px; align-items:center;}
  .fphoto{border-radius:26px; overflow:hidden; box-shadow:var(--sh); aspect-ratio:4/5; background:linear-gradient(150deg,var(--sage-wash),var(--rose-wash));}
  .fphoto img{width:100%; height:100%; object-fit:cover;}
  .founder h2{font-size:clamp(26px,3.6vw,38px); font-weight:600; margin-top:14px;}
  .founder p{margin-top:16px; color:var(--ink-soft); font-size:17px;}
  .founder .sign{margin-top:22px; font-weight:700;} .founder .sign span{display:block; color:var(--muted); font-weight:500; font-size:14.5px;}
  @media(max-width:860px){ .founder{grid-template-columns:1fr; gap:30px;} .fphoto{max-width:380px;} }

  /* VALUES */
  .center{text-align:center;} .center .sub{margin-left:auto; margin-right:auto;}
  .sec-head{max-width:640px; margin:0 auto 40px;}
  .sec-head h2{font-size:clamp(26px,3.6vw,38px); font-weight:600; margin-top:14px;}
  .sec-head p{margin-top:14px; color:var(--ink-soft); font-size:18px;}
  .grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
  @media(max-width:860px){ .grid3{grid-template-columns:1fr;} }
  .vcard{background:var(--raise); border:1px solid var(--line); border-radius:20px; padding:30px 26px; box-shadow:var(--sh-sm);}
  .vcard .ic{width:54px; height:54px; border-radius:15px; display:grid; place-items:center; background:var(--sage-wash); margin-bottom:18px;}
  .vcard .ic svg{width:28px; height:28px;}
  .vcard h3{font-size:20px; font-weight:650;}
  .vcard p{margin-top:10px; color:var(--ink-soft); font-size:15.5px;}

  /* METHOD + STATS */
  .method{display:grid; grid-template-columns:1.05fr .95fr; gap:52px; align-items:center;}
  .method h2{font-size:clamp(24px,3.2vw,34px); font-weight:600;}
  .method p{margin-top:16px; color:var(--ink-soft);}
  .statgrid{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
  .stat{background:var(--rose-wash); border-radius:18px; padding:24px;}
  .stat b{display:block; font-size:34px; font-weight:700; color:var(--rose-deep); line-height:1;}
  .stat span{font-size:14px; color:var(--ink-soft);}
  .stat.sage{background:var(--sage-wash);} .stat.sage b{color:var(--sage-deep);}
  @media(max-width:860px){ .method{grid-template-columns:1fr; gap:30px;} }

  /* CTA */
  .cta-band{border-radius:28px; padding:56px 44px; text-align:center; background:linear-gradient(150deg,var(--sage-deep),#43533f); color:#fff; box-shadow:var(--sh); position:relative; overflow:hidden;}
  .cta-band .halo{position:absolute; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,rgba(198,131,116,.4),transparent 70%); top:-160px; right:-100px;}
  .cta-band .eyebrow{color:#D9C7A8;}
  .cta-band h2{font-size:clamp(26px,3.6vw,38px); font-weight:600; margin-top:14px; color:#fff;}
  .cta-band p{margin-top:12px; color:rgba(255,255,255,.82); max-width:52ch; margin-inline:auto;}
  .cta-row{display:flex; gap:14px; justify-content:center; margin-top:26px; flex-wrap:wrap;}
  .cta-band .btn-ghost{background:transparent; border-color:rgba(255,255,255,.4); color:#fff;} .cta-band .btn-ghost:hover{background:rgba(255,255,255,.12);}
  .cta-band .btn-light{background:#fff; color:var(--sage-deep);}

  /* FOOTER */
  footer{padding:56px 0 40px; background:var(--raise); border-top:1px solid var(--line); margin-top:8px;}
  .foot{display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:30px;}
  .foot .foot-intro{color:var(--ink-soft); font-size:15px; line-height:1.75; max-width:52ch; margin-top:12px;}
  .foot h4{font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); font-weight:700; margin-bottom:14px;}
  .foot ul{list-style:none; margin:0; padding:0; display:grid; gap:9px; font-size:15px; color:var(--ink-soft);}
  .foot a:hover{color:var(--rose-deep);}
  .copyright{border-top:1px solid var(--line); margin-top:40px; padding-top:22px; font-size:13px; color:var(--muted); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}
  @media(max-width:860px){ .foot{grid-template-columns:1fr 1fr;} }
  @media(max-width:460px){ .foot{grid-template-columns:1fr;} }

/* ===== blog.html ===== */

  :root{
    --ground:#FAF6F0; --raise:#FFFFFF; --ink:#26312A; --ink-soft:#495249;
    --muted:#7A837A; --line:#E7E0D4; --line-2:#F0EBE1;
    --sage:#84977E; --sage-deep:#5C6E56; --sage-wash:#EAEFE5;
    --rose:#C68374; --rose-deep:#A5604F; --rose-wash:#F6E8E2;
    --gold:#BE9B62; --gold-wash:#F3E9D5;
    --sh:0 2px 6px rgba(38,49,42,.05), 0 18px 44px rgba(38,49,42,.07);
    --sh-sm:0 1px 3px rgba(38,49,42,.06);
  }
  :root[data-theme="light"]{
    --ground:#FAF6F0; --raise:#FFFFFF; --ink:#26312A; --ink-soft:#495249;
    --muted:#7A837A; --line:#E7E0D4; --line-2:#F0EBE1;
    --sage:#84977E; --sage-deep:#5C6E56; --sage-wash:#EAEFE5;
    --rose:#C68374; --rose-deep:#A5604F; --rose-wash:#F6E8E2;
    --gold:#BE9B62; --gold-wash:#F3E9D5;
    --sh:0 2px 6px rgba(38,49,42,.05), 0 18px 44px rgba(38,49,42,.07); --sh-sm:0 1px 3px rgba(38,49,42,.06);
  }
  *{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; color-scheme:light;}
  body{margin:0; background:var(--ground); color:var(--ink);
    font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;
    font-size:17px; line-height:1.7; letter-spacing:-.006em; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
  .display{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif; letter-spacing:-.022em;}
  .wrap{max-width:1320px; margin:0 auto; padding:0 26px;}
  .narrow{max-width:1080px; margin:0 auto; padding:0 26px;}
  h1,h2,h3,h4{margin:0; line-height:1.16; text-wrap:balance;}
  p{margin:0;}
  a{color:inherit; text-decoration:none;}
  img{display:block; max-width:100%;}
  :focus-visible{outline:2px solid var(--rose-deep); outline-offset:3px;}
  .eyebrow{font-size:12.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--sage-deep); font-weight:700;}

  /* NAV */
  .nav{position:sticky; top:0; z-index:30; backdrop-filter:blur(10px); background:rgba(250,246,240,.82); border-bottom:1px solid var(--line);}
  .nav .wrap{display:flex; align-items:center; gap:24px; height:72px;}
  .brand{margin-right:auto; display:flex; align-items:center;}
  .logo-img{height:53px; width:auto; display:block;}
  .navlinks{display:flex; gap:28px; font-size:15px; color:var(--ink-soft);}
  .navlinks a:hover,.navlinks a.active{color:var(--rose-deep);}
  .navlinks a.active{font-weight:650;}
  .soon{font-size:10px; letter-spacing:.08em; background:var(--sage-wash); color:var(--sage-deep); padding:2px 7px; border-radius:100px; margin-left:6px; font-weight:700;}
  .btn{display:inline-flex; align-items:center; gap:8px; border-radius:100px; font-weight:650; font-size:15px; padding:11px 22px; cursor:pointer; border:1px solid transparent; transition:.2s;}
  .btn-primary{background:var(--sage-deep); color:#fff;} .btn-primary:hover{background:#4a5a45;}
  .navtoggle{position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; clip:rect(0 0 0 0);}
  .hamburger{display:none; margin-left:6px; width:44px; height:44px; border-radius:12px; cursor:pointer; flex:none; align-items:center; justify-content:center; flex-direction:column; gap:5px; border:1px solid var(--line); background:var(--raise);}
  .hamburger span{display:block; width:20px; height:2px; background:var(--ink); border-radius:2px; transition:transform .25s,opacity .2s;}
  .navtoggle:focus-visible + .hamburger{outline:2px solid var(--rose-deep); outline-offset:2px;}
  .navcta-m{display:none;}
  @media(max-width:860px){
    .hamburger{display:flex;} .nav .wrap > a.btn{display:none;} .nav .wrap{gap:10px;}
    .navlinks{display:none; position:absolute; top:72px; left:0; right:0; flex-direction:column; gap:0; padding:8px 22px 16px; background:var(--ground); border-bottom:1px solid var(--line); box-shadow:var(--sh);}
    .navtoggle:checked ~ .navlinks{display:flex;}
    .navtoggle:checked ~ .hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
    .navtoggle:checked ~ .hamburger span:nth-child(2){opacity:0;}
    .navtoggle:checked ~ .hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
    .navlinks a{padding:13px 4px; font-size:16px; border-bottom:1px solid var(--line-2); color:var(--ink);}
    .navlinks a.navcta-m{display:inline-flex; justify-content:center; color:#fff; border-bottom:none; margin-top:12px; background:var(--sage-deep); border-radius:100px;}
  }

  /* BLOG HERO */
  .bloghero{background:radial-gradient(120% 120% at 88% -30%, var(--rose-wash) 0%, transparent 55%), radial-gradient(90% 100% at -5% 0%, var(--sage-wash) 0%, transparent 55%); border-bottom:1px solid var(--line);}
  .bloghero .narrow{padding:34px 26px 52px; text-align:center;}
  .crumb{font-size:13.5px; color:var(--muted); margin-bottom:22px;}
  .crumb a:hover{color:var(--rose-deep);} .crumb span{color:var(--ink-soft);}
  .bloghero h1{font-size:clamp(34px,5.4vw,54px); font-weight:600; margin-top:14px;}
  .bloghero .sub{font-size:19px; color:var(--ink-soft); max-width:60ch; margin:18px auto 0;}
  .search{display:flex; gap:10px; max-width:520px; margin:30px auto 0;}
  .search input{flex:1; border:1px solid var(--line); background:var(--raise); border-radius:100px; padding:13px 20px; font-size:15px; color:var(--ink);}
  .search button{flex:none; border:none; background:var(--sage-deep); color:#fff; border-radius:100px; padding:0 22px; font-weight:650; cursor:pointer;}

  /* CATEGORY CHIPS */
  .cats{display:flex; flex-wrap:wrap; gap:10px; justify-content:center; padding:26px 26px 4px;}
  .chip{font-size:14px; font-weight:600; padding:8px 16px; border-radius:100px; border:1px solid var(--line); background:var(--raise); color:var(--ink-soft); cursor:pointer; transition:.18s;}
  .chip:hover{border-color:var(--sage);}
  .chip.active{background:var(--sage-deep); color:#fff; border-color:var(--sage-deep);}

  section{padding:44px 0;}
  .sec-title{display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:24px;}
  .sec-title h2{font-size:clamp(24px,3.2vw,32px); font-weight:600;}
  .sec-title a{font-size:14.5px; font-weight:650; color:var(--rose-deep);}

  /* TAGS */
  .tag{display:inline-block; font-size:12px; font-weight:700; letter-spacing:.03em; padding:5px 12px; border-radius:100px; text-transform:uppercase;}
  .t-sage{background:var(--sage-wash); color:var(--sage-deep);}
  .t-rose{background:var(--rose-wash); color:var(--rose-deep);}
  .t-gold{background:var(--gold-wash); color:var(--gold);}

  /* FEATURED */
  .featured{display:grid; grid-template-columns:1.05fr .95fr; gap:0; background:var(--raise); border:1px solid var(--line); border-radius:26px; overflow:hidden; box-shadow:var(--sh);}
  .featured .cover{position:relative; min-height:340px; background:linear-gradient(150deg,var(--sage-wash),var(--rose-wash));}
  .featured .cover img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
  .featured .body{padding:38px 40px; display:flex; flex-direction:column; justify-content:center;}
  .featured .body h2{font-size:clamp(24px,2.6vw,32px); font-weight:650; margin:16px 0 0; letter-spacing:-.02em;}
  .featured .body p{margin-top:14px; color:var(--ink-soft); font-size:16.5px;}
  .meta{display:flex; align-items:center; gap:14px; margin-top:22px; font-size:13.5px; color:var(--muted); flex-wrap:wrap;}
  .meta .who{display:flex; align-items:center; gap:9px; color:var(--ink-soft); font-weight:600;}
  .meta .av{width:30px; height:30px; border-radius:50%; object-fit:cover; border:1px solid var(--line);}
  .meta .dot{width:3px; height:3px; border-radius:50%; background:var(--muted);}
  .readmore{margin-top:24px; align-self:flex-start; display:inline-flex; align-items:center; gap:8px; font-weight:650; color:var(--sage-deep);}
  .readmore:hover{gap:12px; color:var(--rose-deep);}
  @media(max-width:820px){ .featured{grid-template-columns:1fr;} .featured .cover{min-height:240px;} .featured .body{padding:28px 24px;} }

  /* GRID */
  .grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
  @media(max-width:980px){ .grid{grid-template-columns:repeat(2,1fr);} }
  @media(max-width:620px){ .grid{grid-template-columns:1fr;} }
  .card{background:var(--raise); border:1px solid var(--line); border-radius:20px; overflow:hidden; box-shadow:var(--sh-sm); display:flex; flex-direction:column; transition:transform .2s, box-shadow .2s;}
  .card:hover{transform:translateY(-4px); box-shadow:var(--sh);}
  .card .cover{position:relative; aspect-ratio:16/10; overflow:hidden; display:grid; place-items:center;}
  .card .cover .cat{position:absolute; top:14px; left:14px;}
  .card .cover svg{width:96px; height:96px; opacity:.9;}
  .cv-sage{background:linear-gradient(150deg,#cfe0c4,#a9c39a);}
  .cv-rose{background:linear-gradient(150deg,#f3d7cc,#e0a892);}
  .cv-gold{background:linear-gradient(150deg,#eeddbb,#d8bd86);}
  .cv-mix{background:linear-gradient(150deg,#d7e2cd,#eecfc2);}
  .cv-deep{background:linear-gradient(150deg,#7f927a,#5c6e56);}
  .card .body{padding:20px 22px 22px; display:flex; flex-direction:column; flex:1;}
  .card h3{font-size:19px; font-weight:650; letter-spacing:-.01em; margin-top:12px;}
  .card h3 a:hover{color:var(--rose-deep);}
  .card p{margin-top:9px; color:var(--ink-soft); font-size:14.5px; flex:1;}
  .card .meta{margin-top:16px; padding-top:14px; border-top:1px solid var(--line-2);}

  /* PAGINATION */
  .pager{display:flex; gap:8px; justify-content:center; margin-top:44px;}
  .pager a{min-width:42px; height:42px; padding:0 12px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:12px; background:var(--raise); font-weight:600; color:var(--ink-soft);}
  .pager a.active{background:var(--sage-deep); color:#fff; border-color:var(--sage-deep);}
  .pager a:hover:not(.active){border-color:var(--sage);}

  /* NEWSLETTER */
  .cta-band{border-radius:28px; padding:52px 44px; text-align:center; background:linear-gradient(150deg,var(--sage-deep),#43533f); color:#fff; box-shadow:var(--sh); position:relative; overflow:hidden;}
  .cta-band .halo{position:absolute; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,rgba(198,131,116,.4),transparent 70%); top:-160px; right:-100px;}
  .cta-band .eyebrow{color:#D9C7A8;}
  .cta-band h2{font-size:clamp(26px,3.6vw,36px); font-weight:600; margin-top:14px; color:#fff;}
  .cta-band p{margin-top:12px; color:rgba(255,255,255,.82); max-width:52ch; margin-inline:auto;}
  .eform{display:flex; gap:10px; max-width:460px; margin:26px auto 0; flex-wrap:wrap; justify-content:center;}
  .eform input{flex:1; min-width:220px; border:none; border-radius:100px; padding:14px 20px; font-size:15px; background:rgba(255,255,255,.95); color:#26312A;}
  .eform .btn-primary{background:var(--rose);} .eform .btn-primary:hover{background:var(--rose-deep);}
  .mini{margin-top:12px; font-size:13px; color:rgba(255,255,255,.6);}

  /* FOOTER */
  footer{padding:56px 0 40px; background:var(--raise); border-top:1px solid var(--line); margin-top:20px;}
  .foot{display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:30px;}
  .foot .foot-intro{color:var(--ink-soft); font-size:15px; line-height:1.75; max-width:52ch; margin-top:12px;}
  .foot h4{font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); font-weight:700; margin-bottom:14px;}
  .foot ul{list-style:none; margin:0; padding:0; display:grid; gap:9px; font-size:15px; color:var(--ink-soft);}
  .foot a:hover{color:var(--rose-deep);}
  .copyright{border-top:1px solid var(--line); margin-top:40px; padding-top:22px; font-size:13px; color:var(--muted); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}
  @media(max-width:860px){ .foot{grid-template-columns:1fr 1fr;} }
  @media(max-width:460px){ .foot{grid-template-columns:1fr;} }

/* ===== bai-viet.html ===== */

  :root{
    --ground:#FAF6F0; --raise:#FFFFFF; --ink:#26312A; --ink-soft:#495249;
    --muted:#7A837A; --line:#E7E0D4; --line-2:#F0EBE1;
    --sage:#84977E; --sage-deep:#5C6E56; --sage-wash:#EAEFE5;
    --rose:#C68374; --rose-deep:#A5604F; --rose-wash:#F6E8E2;
    --gold:#BE9B62; --gold-wash:#F3E9D5;
    --sh:0 2px 6px rgba(38,49,42,.05), 0 18px 44px rgba(38,49,42,.07);
    --sh-sm:0 1px 3px rgba(38,49,42,.06);
  }
  :root[data-theme="light"]{
    --ground:#FAF6F0; --raise:#FFFFFF; --ink:#26312A; --ink-soft:#495249;
    --muted:#7A837A; --line:#E7E0D4; --line-2:#F0EBE1;
    --sage:#84977E; --sage-deep:#5C6E56; --sage-wash:#EAEFE5;
    --rose:#C68374; --rose-deep:#A5604F; --rose-wash:#F6E8E2;
    --gold:#BE9B62; --gold-wash:#F3E9D5;
    --sh:0 2px 6px rgba(38,49,42,.05), 0 18px 44px rgba(38,49,42,.07); --sh-sm:0 1px 3px rgba(38,49,42,.06);
  }
  *{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; color-scheme:light;}
  body{margin:0; background:var(--ground); color:var(--ink);
    font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;
    font-size:17px; line-height:1.7; letter-spacing:-.006em; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
  .display{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif; letter-spacing:-.022em;}
  .wrap{max-width:1320px; margin:0 auto; padding:0 26px;}
  h1,h2,h3,h4{margin:0; line-height:1.18; text-wrap:balance;}
  p{margin:0;}
  img{display:block; max-width:100%;}
  a{color:inherit; text-decoration:none;}
  :focus-visible{outline:2px solid var(--rose-deep); outline-offset:3px;}
  .eyebrow{font-size:12.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--sage-deep); font-weight:700;}

  /* NAV — giống trang chủ, dính (sticky) khi cuộn */
  .nav{position:-webkit-sticky; position:sticky; top:0; z-index:50; backdrop-filter:blur(10px); background:rgba(250,246,240,.85); border-bottom:1px solid var(--line);}
  .nav .wrap{display:flex; align-items:center; gap:24px; height:72px;}
  .brand{margin-right:auto; display:flex; align-items:center;}
  .logo-img{height:53px; width:auto; display:block;}
  .navlinks{display:flex; gap:28px; font-size:15px; color:var(--ink-soft);}
  .navlinks a:hover,.navlinks a.active{color:var(--rose-deep);} .navlinks a.active{font-weight:650;}
  .soon{font-size:10px; letter-spacing:.08em; background:var(--sage-wash); color:var(--sage-deep); padding:2px 7px; border-radius:100px; margin-left:6px; font-weight:700;}
  .btn{display:inline-flex; align-items:center; gap:8px; border-radius:100px; font-weight:650; font-size:15px; padding:11px 22px; cursor:pointer; border:1px solid transparent; transition:.2s;}
  .btn-primary{background:var(--sage-deep); color:#fff;} .btn-primary:hover{background:#4a5a45;}
  .navtoggle{position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; clip:rect(0 0 0 0);}
  .hamburger{display:none; margin-left:6px; width:44px; height:44px; border-radius:12px; cursor:pointer; flex:none; align-items:center; justify-content:center; flex-direction:column; gap:5px; border:1px solid var(--line); background:var(--raise);}
  .hamburger span{display:block; width:20px; height:2px; background:var(--ink); border-radius:2px; transition:transform .25s,opacity .2s;}
  .navtoggle:focus-visible + .hamburger{outline:2px solid var(--rose-deep); outline-offset:2px;}
  .navcta-m{display:none;}
  @media(max-width:860px){
    .hamburger{display:flex;} .nav .wrap > a.btn{display:none;} .nav .wrap{gap:10px;}
    .navlinks{display:none; position:absolute; top:72px; left:0; right:0; flex-direction:column; gap:0; padding:8px 22px 16px; background:var(--ground); border-bottom:1px solid var(--line); box-shadow:var(--sh);}
    .navtoggle:checked ~ .navlinks{display:flex;}
    .navtoggle:checked ~ .hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
    .navtoggle:checked ~ .hamburger span:nth-child(2){opacity:0;}
    .navtoggle:checked ~ .hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
    .navlinks a{padding:13px 4px; font-size:16px; border-bottom:1px solid var(--line-2); color:var(--ink);}
    .navlinks a.navcta-m{display:inline-flex; justify-content:center; color:#fff; border-bottom:none; margin-top:12px; background:var(--sage-deep); border-radius:100px;}
  }

  /* READING PROGRESS BAR */
  .progress{position:fixed; top:0; left:0; height:3px; width:0; background:linear-gradient(90deg,var(--sage),var(--rose)); z-index:60; transition:width .1s linear;}

  /* ARTICLE HEADER */
  .art-head{background:radial-gradient(120% 130% at 90% -30%, var(--rose-wash) 0%, transparent 55%), radial-gradient(90% 100% at -5% 0%, var(--sage-wash) 0%, transparent 55%); border-bottom:1px solid var(--line);}
  .art-head .col{max-width:820px; margin:0 auto; padding:32px 26px 40px;}
  .crumb{font-size:13.5px; color:var(--muted);}
  .crumb a:hover{color:var(--rose-deep);} .crumb span{color:var(--ink-soft);}
  .art-head h1{font-size:clamp(30px,4.6vw,46px); font-weight:650; margin-top:18px;}
  .art-head .lead{font-size:19px; color:var(--ink-soft); margin-top:18px;}
  .byline{display:flex; align-items:center; gap:14px; margin-top:26px; font-size:14px; color:var(--muted); flex-wrap:wrap;}
  .byline .who{display:flex; align-items:center; gap:10px; color:var(--ink); font-weight:600;}
  .byline .av{width:40px; height:40px; border-radius:50%; object-fit:cover; border:1px solid var(--line);}
  .byline .dot{width:3px; height:3px; border-radius:50%; background:var(--muted);}

  /* COVER */
  .cover-wrap{max-width:960px; margin:-8px auto 0; padding:0 26px;}
  .cover{border-radius:22px; overflow:hidden; box-shadow:var(--sh); aspect-ratio:16/9; background:linear-gradient(150deg,var(--sage-wash),var(--rose-wash));}
  .cover img{width:100%; height:100%; object-fit:cover; object-position:center 30%;}
  .cover-cap{max-width:960px; margin:10px auto 0; padding:0 26px; font-size:13px; color:var(--muted); text-align:center;}

  /* LAYOUT: TOC + CONTENT */
  .layout{display:grid; grid-template-columns:240px minmax(0,720px); gap:56px; justify-content:center; padding:52px 26px 20px;}
  .toc{position:-webkit-sticky; position:sticky; top:96px; align-self:start; font-size:14.5px;}
  .toc h4{font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:700; margin-bottom:14px;}
  .toc ul{list-style:none; margin:0; padding:0; display:grid; gap:2px; border-left:2px solid var(--line);}
  .toc a{display:block; padding:7px 14px; color:var(--ink-soft); border-left:2px solid transparent; margin-left:-2px; transition:.15s;}
  .toc a:hover{color:var(--rose-deep);}
  .toc a.active{color:var(--sage-deep); font-weight:650; border-left-color:var(--sage);}
  @media(max-width:1000px){ .layout{grid-template-columns:minmax(0,720px); } .toc{display:none;} }

  /* ARTICLE BODY (prose) */
  .prose{font-size:18px; line-height:1.85; color:var(--ink);}
  .prose > * + *{margin-top:22px;}
  .prose h2{font-size:clamp(23px,3vw,30px); font-weight:650; margin-top:46px; scroll-margin-top:92px; letter-spacing:-.02em;}
  .prose h3{font-size:20px; font-weight:650; margin-top:32px; scroll-margin-top:92px;}
  .prose p{color:var(--ink-soft);}
  .prose strong{color:var(--ink); font-weight:650;}
  .prose a{color:var(--rose-deep); border-bottom:1px solid var(--line);}
  .prose a:hover{border-color:var(--rose);}
  .prose ul,.prose ol{padding-left:24px; color:var(--ink-soft);}
  .prose li{margin:9px 0;} .prose li::marker{color:var(--sage);}
  .prose ol li::marker{color:var(--rose-deep); font-weight:700;}
  .lead-in::first-letter{}
  /* pull quote */
  .pullquote{border:none; margin:38px 0; padding:8px 0 8px 26px; border-left:4px solid var(--rose); }
  .pullquote p{font-family:inherit; font-size:24px; line-height:1.45; font-weight:600; color:var(--ink);}
  .pullquote cite{display:block; margin-top:12px; font-size:14px; font-style:normal; color:var(--muted);}
  /* callout */
  .callout{background:var(--sage-wash); border:1px solid var(--line); border-radius:16px; padding:22px 24px; margin:34px 0;}
  .callout .eyebrow{color:var(--sage-deep); margin-bottom:8px;}
  .callout p{color:var(--ink-soft);}
  /* stat */
  .statbox{display:flex; gap:20px; align-items:center; background:var(--rose-wash); border-radius:16px; padding:22px 26px; margin:34px 0;}
  .statbox b{font-size:40px; font-weight:700; color:var(--rose-deep); line-height:1;}
  .statbox span{font-size:15px; color:var(--ink-soft);}
  /* figure */
  .figure{margin:36px 0;}
  .figure img{border-radius:16px; width:100%; box-shadow:var(--sh-sm);}
  .figure figcaption{font-size:13px; color:var(--muted); text-align:center; margin-top:10px;}

  /* SHARE */
  .share{display:flex; align-items:center; gap:12px; margin:44px 0 0; padding-top:26px; border-top:1px solid var(--line);}
  .share span{font-size:14px; color:var(--muted); font-weight:600;}
  .share a{width:40px; height:40px; border-radius:50%; display:grid; place-items:center; background:var(--raise); border:1px solid var(--line); color:var(--ink-soft);}
  .share a:hover{border-color:var(--sage); color:var(--rose-deep); transform:translateY(-2px);}
  .share svg{width:18px; height:18px;}

  /* AUTHOR BOX */
  .authorbox{display:flex; gap:20px; align-items:center; background:var(--raise); border:1px solid var(--line); border-radius:20px; padding:24px; margin:34px 0 0; box-shadow:var(--sh-sm);}
  .authorbox img{width:78px; height:78px; border-radius:50%; object-fit:cover; flex:none; border:1px solid var(--line);}
  .authorbox .eyebrow{margin-bottom:6px;}
  .authorbox h4{font-size:19px; font-weight:650;}
  .authorbox p{font-size:14.5px; color:var(--ink-soft); margin-top:6px;}

  /* RELATED */
  .related{border-top:1px solid var(--line); background:var(--raise);}
  .related .wrap{padding:52px 26px;}
  .related h2{font-size:clamp(22px,3vw,30px); font-weight:600; margin-bottom:24px;}
  .rgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
  @media(max-width:900px){ .rgrid{grid-template-columns:1fr;} }
  .rcard{background:var(--ground); border:1px solid var(--line); border-radius:18px; overflow:hidden; transition:transform .2s,box-shadow .2s;}
  .rcard:hover{transform:translateY(-4px); box-shadow:var(--sh);}
  .rcard .cv{aspect-ratio:16/10; display:grid; place-items:center;}
  .rcard .cv svg{width:72px; height:72px; opacity:.9;}
  .cv-sage{background:linear-gradient(150deg,#cfe0c4,#a9c39a);}
  .cv-rose{background:linear-gradient(150deg,#f3d7cc,#e0a892);}
  .cv-gold{background:linear-gradient(150deg,#eeddbb,#d8bd86);}
  .rcard .bd{padding:18px 20px 20px;}
  .rcard .tag{font-size:11.5px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; color:var(--sage-deep);}
  .rcard h3{font-size:17px; font-weight:650; margin-top:9px; letter-spacing:-.01em;}
  .rcard h3 a:hover{color:var(--rose-deep);}

  /* NEWSLETTER */
  .cta-band{border-radius:28px; padding:52px 44px; text-align:center; background:linear-gradient(150deg,var(--sage-deep),#43533f); color:#fff; box-shadow:var(--sh); position:relative; overflow:hidden;}
  .cta-band .halo{position:absolute; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,rgba(198,131,116,.4),transparent 70%); top:-160px; right:-100px;}
  .cta-band .eyebrow{color:#D9C7A8;}
  .cta-band h2{font-size:clamp(24px,3.4vw,34px); font-weight:600; margin-top:12px; color:#fff;}
  .cta-band p{margin-top:12px; color:rgba(255,255,255,.82); max-width:52ch; margin-inline:auto;}
  .eform{display:flex; gap:10px; max-width:460px; margin:24px auto 0; flex-wrap:wrap; justify-content:center;}
  .eform input{flex:1; min-width:220px; border:none; border-radius:100px; padding:14px 20px; font-size:15px; background:rgba(255,255,255,.95); color:#26312A;}
  .eform .btn-primary{background:var(--rose);} .eform .btn-primary:hover{background:var(--rose-deep);}
  .sec{padding:44px 0;}

  /* FOOTER — giống trang chủ */
  footer{padding:56px 0 40px; background:var(--raise); border-top:1px solid var(--line); margin-top:8px;}
  .foot{display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:30px;}
  .foot .foot-intro{color:var(--ink-soft); font-size:15px; line-height:1.75; max-width:52ch; margin-top:12px;}
  .foot h4{font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); font-weight:700; margin-bottom:14px;}
  .foot ul{list-style:none; margin:0; padding:0; display:grid; gap:9px; font-size:15px; color:var(--ink-soft);}
  .foot a:hover{color:var(--rose-deep);}
  .copyright{border-top:1px solid var(--line); margin-top:40px; padding-top:22px; font-size:13px; color:var(--muted); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}
  @media(max-width:860px){ .foot{grid-template-columns:1fr 1fr;} }
  @media(max-width:460px){ .foot{grid-template-columns:1fr;} }

/* ===== khoa-hoc.html ===== */

  :root{
    --ground:#FAF6F0; --raise:#FFFFFF; --ink:#26312A; --ink-soft:#495249;
    --muted:#7A837A; --line:#E7E0D4; --line-2:#F0EBE1;
    --sage:#84977E; --sage-deep:#5C6E56; --sage-wash:#EAEFE5;
    --rose:#C68374; --rose-deep:#A5604F; --rose-wash:#F6E8E2;
    --gold:#BE9B62; --gold-wash:#F3E9D5;
    --sh:0 2px 6px rgba(38,49,42,.05), 0 18px 44px rgba(38,49,42,.07);
    --sh-sm:0 1px 3px rgba(38,49,42,.06);
  }
  :root[data-theme="light"]{ --ground:#FAF6F0; }
  *{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; color-scheme:light;}
  body{margin:0; background:var(--ground); color:var(--ink);
    font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;
    font-size:17px; line-height:1.7; letter-spacing:-.006em; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
  .display{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif; letter-spacing:-.022em;}
  .wrap{max-width:1320px; margin:0 auto; padding:0 26px;}
  .narrow{max-width:820px; margin:0 auto; padding:0 26px;}
  h1,h2,h3,h4{margin:0; line-height:1.16; text-wrap:balance;}
  p{margin:0;}
  img{display:block; max-width:100%;}
  a{color:inherit; text-decoration:none;}
  :focus-visible{outline:2px solid var(--rose-deep); outline-offset:3px;}
  .eyebrow{font-size:12.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--sage-deep); font-weight:700;}

  /* NAV */
  .nav{position:-webkit-sticky; position:sticky; top:0; z-index:50; backdrop-filter:blur(10px); background:rgba(250,246,240,.85); border-bottom:1px solid var(--line);}
  .nav .wrap{display:flex; align-items:center; gap:24px; height:72px;}
  .brand{margin-right:auto; display:flex; align-items:center;}
  .logo-img{height:53px; width:auto; display:block;}
  .navlinks{display:flex; gap:28px; font-size:15px; color:var(--ink-soft);}
  .navlinks a:hover,.navlinks a.active{color:var(--rose-deep);} .navlinks a.active{font-weight:650;}
  .soon{font-size:10px; letter-spacing:.08em; background:var(--sage-wash); color:var(--sage-deep); padding:2px 7px; border-radius:100px; margin-left:6px; font-weight:700;}
  .btn{display:inline-flex; align-items:center; gap:8px; border-radius:100px; font-weight:650; font-size:15px; padding:11px 22px; cursor:pointer; border:1px solid transparent; transition:.2s;}
  .btn-primary{background:var(--sage-deep); color:#fff;} .btn-primary:hover{background:#4a5a45;}
  .navtoggle{position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; clip:rect(0 0 0 0);}
  .hamburger{display:none; margin-left:6px; width:44px; height:44px; border-radius:12px; cursor:pointer; flex:none; align-items:center; justify-content:center; flex-direction:column; gap:5px; border:1px solid var(--line); background:var(--raise);}
  .hamburger span{display:block; width:20px; height:2px; background:var(--ink); border-radius:2px; transition:transform .25s,opacity .2s;}
  .navtoggle:focus-visible + .hamburger{outline:2px solid var(--rose-deep); outline-offset:2px;}
  .navcta-m{display:none;}
  @media(max-width:860px){
    .hamburger{display:flex;} .nav .wrap > a.btn{display:none;} .nav .wrap{gap:10px;}
    .navlinks{display:none; position:absolute; top:72px; left:0; right:0; flex-direction:column; gap:0; padding:8px 22px 16px; background:var(--ground); border-bottom:1px solid var(--line); box-shadow:var(--sh);}
    .navtoggle:checked ~ .navlinks{display:flex;}
    .navtoggle:checked ~ .hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
    .navtoggle:checked ~ .hamburger span:nth-child(2){opacity:0;}
    .navtoggle:checked ~ .hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
    .navlinks a{padding:13px 4px; font-size:16px; border-bottom:1px solid var(--line-2); color:var(--ink);}
    .navlinks a.navcta-m{display:inline-flex; justify-content:center; color:#fff; border-bottom:none; margin-top:12px; background:var(--sage-deep); border-radius:100px;}
  }

  /* HERO */
  .hero{background:radial-gradient(120% 130% at 90% -30%, var(--rose-wash) 0%, transparent 55%), radial-gradient(90% 100% at -5% 0%, var(--sage-wash) 0%, transparent 55%); border-bottom:1px solid var(--line);}
  .hero .narrow{padding:40px 26px 56px; text-align:center;}
  .crumb{font-size:13.5px; color:var(--muted); margin-bottom:18px;}
  .crumb a:hover{color:var(--rose-deep);} .crumb span{color:var(--ink-soft);}
  .pill{display:inline-block; font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--rose-deep); background:var(--rose-wash); padding:6px 14px; border-radius:100px;}
  .hero h1{font-size:clamp(34px,5.4vw,54px); font-weight:600; margin-top:16px;}
  .hero .sub{font-size:19px; color:var(--ink-soft); max-width:60ch; margin:18px auto 0;}
  .heroform{display:flex; gap:10px; max-width:480px; margin:28px auto 0;}
  .heroform input{flex:1; border:1px solid var(--line); background:var(--raise); border-radius:100px; padding:13px 20px; font-size:15px; color:var(--ink);}

  section{padding:64px 0;}
  .sec-head{max-width:660px; margin:0 auto 40px; text-align:center;}
  .sec-head h2{font-size:clamp(26px,3.6vw,38px); font-weight:600; margin-top:12px;}
  .sec-head p{margin-top:14px; color:var(--ink-soft); font-size:18px;}

  /* COURSE GRID */
  .grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
  @media(max-width:980px){ .grid{grid-template-columns:repeat(2,1fr);} }
  @media(max-width:640px){ .grid{grid-template-columns:1fr;} }
  .course{background:var(--raise); border:1px solid var(--line); border-radius:20px; overflow:hidden; box-shadow:var(--sh-sm); display:flex; flex-direction:column;}
  .course .cv{position:relative; aspect-ratio:16/10; display:grid; place-items:center;}
  .course .cv svg{width:80px; height:80px; opacity:.9;}
  .course .cv .badge{position:absolute; top:14px; right:14px; background:rgba(255,255,255,.9); color:var(--rose-deep); font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; padding:5px 11px; border-radius:100px;}
  .cv-sage{background:linear-gradient(150deg,#cfe0c4,#a9c39a);}
  .cv-rose{background:linear-gradient(150deg,#f3d7cc,#e0a892);}
  .cv-gold{background:linear-gradient(150deg,#eeddbb,#d8bd86);}
  .cv-deep{background:linear-gradient(150deg,#7f927a,#5c6e56);}
  .course .bd{padding:22px 22px 24px; display:flex; flex-direction:column; flex:1;}
  .course .lvl{font-size:12px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; color:var(--sage-deep);}
  .course h3{font-size:20px; font-weight:650; margin-top:9px; letter-spacing:-.01em;}
  .course p{margin-top:10px; color:var(--ink-soft); font-size:15px; flex:1;}
  .course .foot{margin-top:18px; display:flex; align-items:center; justify-content:space-between; padding-top:14px; border-top:1px solid var(--line-2);}
  .course .price{font-size:14px; color:var(--muted); font-weight:600;}
  .course .go{font-size:14px; font-weight:700; color:var(--rose-deep);}

  /* LEARN */
  .band{background:var(--raise); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
  .learn{display:grid; grid-template-columns:1fr 1fr; gap:16px 40px;}
  @media(max-width:760px){ .learn{grid-template-columns:1fr;} }
  .learn .item{display:flex; gap:14px; align-items:flex-start;}
  .learn .ck{width:26px; height:26px; border-radius:50%; background:var(--sage-wash); display:grid; place-items:center; flex:none; margin-top:2px;}
  .learn .ck svg{width:14px; height:14px;}
  .learn .item p{color:var(--ink-soft);} .learn .item b{color:var(--ink);}

  /* FEATURE BANNERS */
  .banner{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
  @media(max-width:820px){ .banner{grid-template-columns:1fr;} }
  .bcard{border-radius:22px; padding:34px 32px; color:#fff; position:relative; overflow:hidden; box-shadow:var(--sh);}
  .bcard.sage{background:linear-gradient(150deg,var(--sage-deep),#43533f);}
  .bcard.rose{background:linear-gradient(150deg,#b7735f,#96513f);}
  .bcard .eyebrow{color:rgba(255,255,255,.75);}
  .bcard h3{font-size:24px; font-weight:650; margin-top:12px; color:#fff;}
  .bcard p{margin-top:12px; color:rgba(255,255,255,.85); font-size:15.5px;}
  .bcard .btn{margin-top:20px; background:#fff; color:var(--ink);}

  /* CTA */
  .cta-band{border-radius:28px; padding:56px 44px; text-align:center; background:linear-gradient(150deg,var(--sage-deep),#43533f); color:#fff; box-shadow:var(--sh); position:relative; overflow:hidden;}
  .cta-band .halo{position:absolute; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,rgba(198,131,116,.4),transparent 70%); top:-160px; right:-100px;}
  .cta-band .eyebrow{color:#D9C7A8;}
  .cta-band h2{font-size:clamp(26px,3.6vw,38px); font-weight:600; margin-top:14px; color:#fff;}
  .cta-band p{margin-top:12px; color:rgba(255,255,255,.82); max-width:52ch; margin-inline:auto;}
  .eform{display:flex; gap:10px; max-width:460px; margin:24px auto 0; flex-wrap:wrap; justify-content:center;}
  .eform input{flex:1; min-width:220px; border:none; border-radius:100px; padding:14px 20px; font-size:15px; background:rgba(255,255,255,.95); color:#26312A;}
  .eform .btn-primary{background:var(--rose);} .eform .btn-primary:hover{background:var(--rose-deep);}
  .mini{margin-top:12px; font-size:13px; color:rgba(255,255,255,.6);}

  /* FOOTER */
  footer{padding:56px 0 40px; background:var(--raise); border-top:1px solid var(--line); margin-top:8px;}
  .foot{display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:30px;}
  .foot .foot-intro{color:var(--ink-soft); font-size:15px; line-height:1.75; max-width:52ch; margin-top:12px;}
  .foot h4{font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); font-weight:700; margin-bottom:14px;}
  .foot ul{list-style:none; margin:0; padding:0; display:grid; gap:9px; font-size:15px; color:var(--ink-soft);}
  .foot a:hover{color:var(--rose-deep);}
  .copyright{border-top:1px solid var(--line); margin-top:40px; padding-top:22px; font-size:13px; color:var(--muted); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}
  @media(max-width:860px){ .foot{grid-template-columns:1fr 1fr;} }
  @media(max-width:460px){ .foot{grid-template-columns:1fr;} }

/* ===== lien-he.html ===== */

  :root{
    --ground:#FAF6F0; --raise:#FFFFFF; --ink:#26312A; --ink-soft:#495249;
    --muted:#7A837A; --line:#E7E0D4; --line-2:#F0EBE1;
    --sage:#84977E; --sage-deep:#5C6E56; --sage-wash:#EAEFE5;
    --rose:#C68374; --rose-deep:#A5604F; --rose-wash:#F6E8E2;
    --gold:#BE9B62; --gold-wash:#F3E9D5;
    --sh:0 2px 6px rgba(38,49,42,.05), 0 18px 44px rgba(38,49,42,.07);
    --sh-sm:0 1px 3px rgba(38,49,42,.06);
  }
  :root[data-theme="light"]{ --ground:#FAF6F0; }
  *{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; color-scheme:light;}
  body{margin:0; background:var(--ground); color:var(--ink);
    font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;
    font-size:17px; line-height:1.7; letter-spacing:-.006em; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
  .display{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif; letter-spacing:-.022em;}
  .wrap{max-width:1320px; margin:0 auto; padding:0 26px;}
  .narrow{max-width:820px; margin:0 auto; padding:0 26px;}
  h1,h2,h3,h4{margin:0; line-height:1.16; text-wrap:balance;}
  p{margin:0;}
  img{display:block; max-width:100%;}
  a{color:inherit; text-decoration:none;}
  :focus-visible{outline:2px solid var(--rose-deep); outline-offset:3px;}
  .eyebrow{font-size:12.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--sage-deep); font-weight:700;}

  /* NAV */
  .nav{position:-webkit-sticky; position:sticky; top:0; z-index:50; backdrop-filter:blur(10px); background:rgba(250,246,240,.85); border-bottom:1px solid var(--line);}
  .nav .wrap{display:flex; align-items:center; gap:24px; height:72px;}
  .brand{margin-right:auto; display:flex; align-items:center;}
  .logo-img{height:53px; width:auto; display:block;}
  .navlinks{display:flex; gap:28px; font-size:15px; color:var(--ink-soft);}
  .navlinks a:hover,.navlinks a.active{color:var(--rose-deep);} .navlinks a.active{font-weight:650;}
  .soon{font-size:10px; letter-spacing:.08em; background:var(--sage-wash); color:var(--sage-deep); padding:2px 7px; border-radius:100px; margin-left:6px; font-weight:700;}
  .btn{display:inline-flex; align-items:center; gap:8px; border-radius:100px; font-weight:650; font-size:15px; padding:11px 22px; cursor:pointer; border:1px solid transparent; transition:.2s;}
  .btn-primary{background:var(--sage-deep); color:#fff;} .btn-primary:hover{background:#4a5a45;}
  .navtoggle{position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; clip:rect(0 0 0 0);}
  .hamburger{display:none; margin-left:6px; width:44px; height:44px; border-radius:12px; cursor:pointer; flex:none; align-items:center; justify-content:center; flex-direction:column; gap:5px; border:1px solid var(--line); background:var(--raise);}
  .hamburger span{display:block; width:20px; height:2px; background:var(--ink); border-radius:2px; transition:transform .25s,opacity .2s;}
  .navtoggle:focus-visible + .hamburger{outline:2px solid var(--rose-deep); outline-offset:2px;}
  .navcta-m{display:none;}
  @media(max-width:860px){
    .hamburger{display:flex;} .nav .wrap > a.btn{display:none;} .nav .wrap{gap:10px;}
    .navlinks{display:none; position:absolute; top:72px; left:0; right:0; flex-direction:column; gap:0; padding:8px 22px 16px; background:var(--ground); border-bottom:1px solid var(--line); box-shadow:var(--sh);}
    .navtoggle:checked ~ .navlinks{display:flex;}
    .navtoggle:checked ~ .hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
    .navtoggle:checked ~ .hamburger span:nth-child(2){opacity:0;}
    .navtoggle:checked ~ .hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
    .navlinks a{padding:13px 4px; font-size:16px; border-bottom:1px solid var(--line-2); color:var(--ink);}
    .navlinks a.navcta-m{display:inline-flex; justify-content:center; color:#fff; border-bottom:none; margin-top:12px; background:var(--sage-deep); border-radius:100px;}
  }

  /* HERO */
  .hero{background:radial-gradient(120% 130% at 90% -30%, var(--rose-wash) 0%, transparent 55%), radial-gradient(90% 100% at -5% 0%, var(--sage-wash) 0%, transparent 55%); border-bottom:1px solid var(--line);}
  .hero .narrow{padding:40px 26px 48px; text-align:center;}
  .crumb{font-size:13.5px; color:var(--muted); margin-bottom:18px;}
  .crumb a:hover{color:var(--rose-deep);} .crumb span{color:var(--ink-soft);}
  .hero h1{font-size:clamp(34px,5.4vw,52px); font-weight:600; margin-top:14px;}
  .hero .sub{font-size:19px; color:var(--ink-soft); max-width:56ch; margin:16px auto 0;}

  section{padding:60px 0;}
  /* CONTACT LAYOUT */
  .contact{display:grid; grid-template-columns:1.2fr .8fr; gap:44px; align-items:start;}
  @media(max-width:860px){ .contact{grid-template-columns:1fr; gap:32px;} }
  .formcard{background:var(--raise); border:1px solid var(--line); border-radius:22px; padding:30px 30px 32px; box-shadow:var(--sh);}
  .formcard h2{font-size:24px; font-weight:650;}
  .formcard .fp{color:var(--ink-soft); font-size:15px; margin-top:8px;}
  .field{margin-top:18px;}
  .field label{display:block; font-size:13.5px; font-weight:650; color:var(--ink); margin-bottom:7px;}
  .field input,.field textarea,.field select{width:100%; border:1px solid var(--line); background:var(--ground); border-radius:12px; padding:12px 15px; font-size:15px; color:var(--ink); font-family:inherit;}
  .field textarea{resize:vertical; min-height:130px;}
  .field input:focus,.field textarea:focus,.field select:focus{border-color:var(--sage); outline:none; box-shadow:0 0 0 3px var(--sage-wash);}
  .formcard .btn-primary{margin-top:22px; width:100%; justify-content:center; padding:14px;}
  .formnote{margin-top:12px; font-size:13px; color:var(--muted); text-align:center;}

  /* INFO SIDE */
  .info{display:grid; gap:16px;}
  .infocard{background:var(--raise); border:1px solid var(--line); border-radius:18px; padding:22px 22px; box-shadow:var(--sh-sm);}
  .infocard .eyebrow{margin-bottom:12px;}
  .irow{display:flex; align-items:center; gap:14px; padding:10px 0;}
  .irow + .irow{border-top:1px solid var(--line-2);}
  .irow .ic{width:42px; height:42px; border-radius:12px; background:var(--sage-wash); display:grid; place-items:center; flex:none;}
  .irow .ic svg{width:20px; height:20px;}
  .irow .t{font-size:12.5px; color:var(--muted);} .irow .v{font-weight:650; font-size:15px;}
  .socrow{display:flex; gap:10px; margin-top:6px;}
  .socrow a{width:44px; height:44px; border-radius:12px; display:grid; place-items:center; color:#fff;}
  .s-tt{background:#111;} .s-fb{background:#4267B2;} .s-yt{background:#c9302c;} .s-ig{background:linear-gradient(135deg,#f9ce34,#ee2a7b 45%,#6228d7);}
  .socrow svg{width:20px; height:20px;}

  /* FAQ */
  .band{background:var(--raise); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
  .sec-head{max-width:640px; margin:0 auto 32px; text-align:center;}
  .sec-head h2{font-size:clamp(24px,3.4vw,34px); font-weight:600; margin-top:12px;}
  .faq{max-width:760px; margin:0 auto; display:grid; gap:12px;}
  .faq details{background:var(--ground); border:1px solid var(--line); border-radius:14px; padding:4px 20px;}
  .faq summary{cursor:pointer; list-style:none; padding:16px 0; font-weight:650; font-size:16.5px; display:flex; justify-content:space-between; align-items:center; gap:12px;}
  .faq summary::-webkit-details-marker{display:none;}
  .faq summary::after{content:"+"; font-size:22px; color:var(--sage-deep); font-weight:400; line-height:1;}
  .faq details[open] summary::after{content:"–";}
  .faq p{color:var(--ink-soft); font-size:15px; padding:0 0 18px;}

  /* FOOTER */
  footer{padding:56px 0 40px; background:var(--raise); border-top:1px solid var(--line); margin-top:8px;}
  .foot{display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:30px;}
  .foot .foot-intro{color:var(--ink-soft); font-size:15px; line-height:1.75; max-width:52ch; margin-top:12px;}
  .foot h4{font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); font-weight:700; margin-bottom:14px;}
  .foot ul{list-style:none; margin:0; padding:0; display:grid; gap:9px; font-size:15px; color:var(--ink-soft);}
  .foot a:hover{color:var(--rose-deep);}
  .copyright{border-top:1px solid var(--line); margin-top:40px; padding-top:22px; font-size:13px; color:var(--muted); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}
  @media(max-width:860px){ .foot{grid-template-columns:1fr 1fr;} }
  @media(max-width:460px){ .foot{grid-template-columns:1fr;} }