/* CJE Discovery — nền tảng, bố cục và nhận diện */
:root {
      --forest:#19392c; --indigo:#263e5c; --tea:#536b55; --earth:#a65536;
      --cloud:#f5f2e9; --surface:#fcfbf7; --mist:#e2e6e2; --border:#c5ccc6;
      --stone:#68716c; --charcoal:#252a27; --success:#347257; --danger:#a23f3f;
      --ui:"Be Vietnam Pro",system-ui,sans-serif; --story:"Lora",Georgia,serif;
      --mono:"IBM Plex Mono",monospace; --page:1180px; --r:12px;
    }
    *{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;min-width:320px;background:var(--cloud);color:var(--charcoal);font:400 16px/1.6 var(--ui)}
    a{color:inherit;text-decoration:none} button{font:inherit;cursor:pointer} svg{display:block} .container{width:min(calc(100% - 32px),var(--page));margin:auto}
    .skip{position:fixed;z-index:99;top:10px;left:10px;padding:10px 14px;background:var(--forest);color:var(--surface);transform:translateY(-150%)} .skip:focus{transform:none}
    .icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
    .eyebrow{margin:0;color:var(--stone);font:500 .72rem/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase}
    .title{margin:4px 0 0;color:var(--forest);font-size:clamp(1.45rem,3vw,2rem);line-height:1.25}.section{padding:70px 0}.heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px}.heading>a{color:var(--forest);font-size:.85rem;font-weight:500}
    .btn{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:11px 18px;border:1px solid transparent;border-radius:8px;background:var(--forest);color:var(--surface);font-weight:500}.btn:hover{filter:brightness(.92)}.btn--light{background:var(--surface);color:var(--forest)}.btn--outline{border-color:var(--border);background:transparent;color:var(--forest)}.btn--earth{background:var(--earth)}.btn--block{width:100%}
    .top-status{background:var(--indigo);color:var(--surface);font-size:.76rem}.top-status .container{min-height:34px;display:flex;justify-content:center;align-items:center;gap:8px}
    header{position:sticky;top:0;z-index:30;border-bottom:1px solid rgba(197,204,198,.8);background:rgba(245,242,233,.95);backdrop-filter:blur(14px)}
    .header{min-height:70px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:24px}.brand{display:flex;align-items:center;gap:10px;color:var(--forest);font-weight:600}.brand-mark{width:35px;height:35px;display:grid;place-items:center;border:1px solid;border-radius:50%}.brand small{display:block;color:var(--stone);font:400 .56rem var(--mono);letter-spacing:.08em}
    .desktop-nav{display:flex;justify-content:center;gap:4px}.desktop-nav a{padding:8px 11px;border-radius:8px;color:var(--stone);font-size:.88rem;font-weight:500}.desktop-nav a:hover,.desktop-nav a[aria-current="page"]{background:var(--mist);color:var(--forest)}.header-actions{display:flex;gap:8px}.icon-btn{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--border);border-radius:50%;background:var(--surface);color:var(--forest)}.navigation-quick-access{position:relative;flex:none;transition:background .2s ease,color .2s ease,transform .2s ease}.navigation-quick-access:hover{background:var(--forest);color:var(--surface);transform:translateY(-1px)}.navigation-quick-access.is-current{border-color:var(--forest);background:var(--forest);color:var(--surface)}.navigation-quick-access>span{display:block;font-size:1.05rem;line-height:1;transform:rotate(-24deg)}.navigation-quick-access--login{position:fixed;z-index:20;top:22px;right:22px;border-color:rgba(252,251,247,.42);background:rgba(252,251,247,.14);color:var(--surface);backdrop-filter:blur(10px)}
    .hero{position:relative;min-height:580px;display:grid;align-items:end;overflow:hidden;color:var(--surface);background-image:linear-gradient(90deg,rgba(12,35,27,.78) 0%,rgba(18,45,35,.48) 48%,rgba(18,45,35,.18) 100%),linear-gradient(180deg,rgba(25,57,44,.04),rgba(25,57,44,.58)),url("../images/home/home-hero-desktop.webp");background-position:center;background-size:cover}
    .hero:before,.hero:after{content:none}
    .hero-content{position:relative;z-index:2;display:grid;grid-template-columns:1.25fr .75fr;align-items:end;gap:48px;padding:76px 0 62px}.hero .eyebrow{color:rgba(252,251,247,.72)}.hero h1{max-width:800px;margin:14px 0 18px;font-size:clamp(2.8rem,7vw,5.7rem);font-weight:500;letter-spacing:-.045em;line-height:.98}.hero-lead{max-width:640px;margin:0;color:rgba(252,251,247,.84);font:400 clamp(1.05rem,2vw,1.28rem)/1.65 var(--story)}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.hero .btn--outline{border-color:rgba(252,251,247,.48);color:var(--surface)}
    .journey-glass{padding:24px;border:1px solid rgba(252,251,247,.3);border-radius:var(--r);background:rgba(25,57,44,.46);backdrop-filter:blur(14px)}.journey-glass h2{margin:7px 0 4px;font-size:1.15rem}.journey-glass p{margin:0;color:rgba(252,251,247,.72);font-size:.83rem}.progress{height:7px;margin:17px 0 9px;overflow:hidden;border-radius:99px;background:rgba(252,251,247,.2)}.progress span{display:block;width:40%;height:100%;border-radius:inherit;background:var(--surface)}
    .context{position:relative;z-index:3;margin-top:-22px}.context-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--border);border-radius:var(--r);background:var(--surface);box-shadow:0 18px 45px rgba(25,57,44,.08)}.context-item{min-height:88px;display:flex;align-items:center;gap:12px;padding:17px}.context-item+*{border-left:1px solid var(--border)}.context-item strong,.context-item small{display:block}.context-item strong{color:var(--forest);font-size:.88rem;font-weight:500}.context-item small{color:var(--stone);font-size:.72rem}
