/* CJE Discovery — nền tảng, bố cục và nhận diện */
@import url("./account-flow.css");
: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)}

    /* H35-R2: Điều hướng Journey luôn truy cập được ở lớp giao diện cao nhất. */
    .global-navigation-access{position:fixed;z-index:80;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));max-width:min(250px,calc(100vw - 24px));min-height:48px;display:flex;align-items:center;gap:10px;padding:6px 14px 6px 7px;border:1px solid rgba(25,57,44,.2);border-radius:999px;background:rgba(252,251,247,.96);color:var(--forest);box-shadow:0 10px 28px rgba(25,57,44,.18);backdrop-filter:blur(16px);transition:transform .2s ease,box-shadow .2s ease}.global-navigation-access:hover{transform:translateY(-1px);box-shadow:0 13px 32px rgba(25,57,44,.24)}.global-navigation-access[aria-current="page"]{border-color:var(--forest);background:var(--forest);color:var(--surface)}.global-navigation-access__icon{width:34px;height:34px;display:grid;flex:0 0 34px;place-items:center;border-radius:50%;background:var(--forest);color:var(--surface);font:600 .7rem var(--mono)}.global-navigation-access[aria-current="page"] .global-navigation-access__icon{background:var(--surface);color:var(--forest)}.global-navigation-access__copy{min-width:0;display:grid;line-height:1.15}.global-navigation-access__copy strong{font-size:.76rem}.global-navigation-access__copy small{max-width:170px;overflow:hidden;color:inherit;font-size:.62rem;text-overflow:ellipsis;white-space:nowrap;opacity:.76}

    /* H35-R1: H35 là điểm truy cập tài khoản duy nhất; không để nút hồ sơ cũ chồng lên giao diện. */
    .has-persistent-navigation-shell .header-actions [data-legacy-account-access="suppressed"],.has-persistent-navigation-shell .header-actions a[href$="profile.html"],.has-persistent-navigation-shell .navigation-quick-access--login{display:none!important}

    @media(max-width:640px){.global-navigation-access{top:max(8px,env(safe-area-inset-top));right:max(8px,env(safe-area-inset-right));min-height:42px;gap:7px;padding:4px 10px 4px 5px}.global-navigation-access__icon{width:32px;height:32px;flex-basis:32px}.global-navigation-access__copy small{max-width:104px}}

    /* H35-R3: lối vào Điều hướng chỉ còn biểu tượng mũi tên, không nhãn và không pill. */
    .global-navigation-access{width:46px;height:46px;min-height:46px;max-width:none;justify-content:center;gap:0;padding:0;border-radius:50%;box-shadow:none}
    .global-navigation-access:hover{transform:none;box-shadow:none}
    .global-navigation-access__icon{width:auto;height:auto;display:block;flex:0 0 auto;border-radius:0;background:none;color:var(--forest);font:600 1.35rem/1 var(--ui)}
    .global-navigation-access[aria-current="page"] .global-navigation-access__icon{background:none;color:var(--surface)}
    .global-navigation-access__copy{display:none}
    @media(max-width:640px){.global-navigation-access{width:42px;height:42px;min-height:42px;padding:0}.global-navigation-access__icon{width:auto;height:auto;flex-basis:auto;font-size:1.25rem}}

    /* H35-R4: biểu tượng SVG dạng kim định hướng thay cho ký tự mũi tên. */
    .global-navigation-access__icon{width:23px;height:23px;display:block;flex:0 0 23px;fill:currentColor;stroke:none}
    @media(max-width:640px){.global-navigation-access__icon{width:21px;height:21px;flex-basis:21px}}
    .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}
/* H26-R2 compact Human Actor catalog */
.human-actor-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.human-actor-home .section-lead{max-width:680px}.human-actor-public-card{display:grid;grid-template-columns:104px minmax(0,1fr);min-height:188px;overflow:hidden}.human-actor-public-card__media{min-height:100%;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,#e1e8e2,#f4eee2);color:var(--forest)}.human-actor-public-card__media img{width:100%;height:100%;min-height:188px;object-fit:cover}.human-actor-public-card__initials{font:600 1.35rem var(--mono);letter-spacing:.06em}.human-actor-public-card__body{min-width:0;padding:15px;display:flex;flex-direction:column;gap:7px}.human-actor-public-card__body h3,.human-actor-public-card__body p{margin:0}.human-actor-public-card__body h3{color:var(--forest);font-size:1rem;line-height:1.3}.human-actor-public-card__top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.human-actor-public-card__top .eyebrow{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.human-actor-public-card__summary{display:-webkit-box;overflow:hidden;color:var(--stone);font-size:.78rem;line-height:1.5;-webkit-box-orient:vertical;-webkit-line-clamp:2}.human-actor-public-card__meta{display:flex;gap:5px;flex-wrap:wrap}.human-actor-public-card__meta span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.66rem;padding:4px 7px;border-radius:999px;background:#eef3ef}.human-actor-availability{flex:none;padding:3px 6px;border-radius:999px;background:#f0ebe1;color:var(--stone);font-size:.62rem;line-height:1.4}.human-actor-availability.is-available{background:#dcece2;color:#255c40}.human-actor-public-card__link{margin-top:auto;color:var(--forest);font-size:.76rem;font-weight:600}.human-actor-public-card__action{width:100%;min-height:38px;margin-top:auto;padding:7px 10px;font-size:.75rem}.human-actor-home .human-actor-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.human-actor-profile .human-actor-grid{grid-template-columns:repeat(3,minmax(0,1fr))}@media(max-width:1000px){.human-actor-grid,.human-actor-home .human-actor-grid,.human-actor-profile .human-actor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.human-actor-grid,.human-actor-home .human-actor-grid,.human-actor-profile .human-actor-grid{grid-template-columns:1fr}.human-actor-public-card{grid-template-columns:92px minmax(0,1fr);min-height:170px}.human-actor-public-card__media img{min-height:170px}}