/* ==========================================================================
   AVÉLORA GROUP — Brand Design System
   Monochrome editorial luxury. Serif display + geometric sans.
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
:root{
    --ink:#0C0C0D;
    --ink-2:#1A1A1C;
    --ink-3:#3B3B40;
    --muted:#6E6E76;
    --paper:#FBFAF8;
    --paper-2:#F4F1EC;
    --stone:#E9E4DC;
    --gold:#B08D57;
    --gold-soft:#D9C4A3;
    --line:rgba(12,12,13,.12);
    --line-strong:rgba(12,12,13,.28);
    --line-inv:rgba(251,250,248,.18);

    --serif:'Cormorant Garamond',"Times New Roman",Georgia,'Noto Serif SC','Songti SC','STSong','SimSun',serif;
    --sans:'Jost',"Helvetica Neue",-apple-system,BlinkMacSystemFont,"Segoe UI",'PingFang SC','Hiragino Sans GB','Microsoft YaHei',Arial,sans-serif;

    --wrap:1240px;
    --wrap-narrow:860px;
    --gutter:clamp(1.25rem,5vw,4rem);
    --sec-y:clamp(4.5rem,10vw,9rem);
    --ease:cubic-bezier(.16,.84,.44,1);
    --t:.5s var(--ease);
    --header-h:78px;
}

/* ---------- 2. Reset ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
    font-family:var(--sans);
    font-size:clamp(1rem,.97rem + .15vw,1.075rem);
    line-height:1.75;
    color:var(--ink-2);
    background:var(--paper);
    font-weight:300;
    letter-spacing:.005em;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
}
img,svg{max-width:100%;display:block}
img{height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
ul,ol{list-style:none}
::selection{background:var(--ink);color:var(--paper)}

/* ---------- 3. Typography ---------- */
h1,h2,h3,h4{font-family:var(--serif);font-weight:300;line-height:1.08;letter-spacing:-.01em;color:var(--ink)}
h1{font-size:clamp(2.6rem,1.6rem + 4.4vw,5.6rem)}
h2{font-size:clamp(2rem,1.4rem + 2.6vw,3.6rem)}
h3{font-size:clamp(1.35rem,1.1rem + 1vw,1.95rem);line-height:1.2}
h4{font-size:clamp(1.1rem,1rem + .4vw,1.3rem);line-height:1.3}
p{margin:0 0 1.15em}
p:last-child{margin-bottom:0}
strong{font-weight:500;color:var(--ink)}
em{font-style:italic}

.display{font-family:var(--serif);font-weight:300;line-height:1.02;letter-spacing:-.015em}
.eyebrow{
    font-size:.68rem;font-weight:400;letter-spacing:.34em;text-transform:uppercase;
    color:var(--muted);display:block;margin-bottom:1.4rem;
}
.eyebrow--gold{color:var(--gold)}
.lede{
    font-size:clamp(1.08rem,1rem + .5vw,1.4rem);line-height:1.65;color:var(--ink-3);
    font-weight:300;
}
.serif-quote{font-family:var(--serif);font-size:clamp(1.5rem,1.1rem + 1.7vw,2.6rem);line-height:1.32;color:var(--ink);font-weight:300}
.small{font-size:.86rem;line-height:1.7;color:var(--muted)}
.tracked{letter-spacing:.28em;text-transform:uppercase;font-size:.7rem}

/* ---------- 4. Layout ---------- */
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding-inline:var(--gutter)}
.wrap-narrow{width:100%;max-width:var(--wrap-narrow);margin:0 auto;padding-inline:var(--gutter)}
section{position:relative}
.sec{padding-block:var(--sec-y)}
.sec-sm{padding-block:clamp(3rem,6vw,5.5rem)}
.rule{height:1px;background:var(--line);border:0;margin:0}
.rule-short{width:64px;height:1px;background:var(--gold);border:0;margin:0 0 2rem}
.center{text-align:center}
.center .rule-short{margin-inline:auto}
.stack-lg>*+*{margin-top:clamp(2.5rem,5vw,4.5rem)}

.grid{display:grid;gap:clamp(1.5rem,3vw,2.75rem)}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,6vw,6rem);align-items:center}
.split-40{grid-template-columns:.8fr 1.2fr}
.split-60{grid-template-columns:1.2fr .8fr}

/* Dark surfaces */
.ink{background:var(--ink);color:rgba(251,250,248,.76)}
.ink h1,.ink h2,.ink h3,.ink h4,.ink strong{color:var(--paper)}
.ink .eyebrow{color:rgba(251,250,248,.5)}
.ink .eyebrow--gold{color:var(--gold-soft)}
.ink .lede{color:rgba(251,250,248,.78)}
.ink .rule{background:var(--line-inv)}
.ink .small{color:rgba(251,250,248,.55)}
.stone{background:var(--paper-2)}

/* ---------- 5. Buttons ---------- */
.btn{
    display:inline-flex;align-items:center;gap:.85rem;
    padding:1.05rem 2.2rem;
    font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;font-weight:400;
    background:var(--ink);color:var(--paper);
    border:1px solid var(--ink);cursor:pointer;
    transition:background var(--t),color var(--t),border-color var(--t),transform var(--t);
    position:relative;overflow:hidden;
}
.btn span.arrow{display:inline-block;transition:transform var(--t)}
.btn:hover{background:transparent;color:var(--ink);transform:translateY(-2px)}
.btn:hover span.arrow{transform:translateX(5px)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.btn-ghost:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.ink .btn{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.ink .btn:hover{background:transparent;color:var(--paper)}
.ink .btn-ghost{background:transparent;color:var(--paper);border-color:var(--line-inv)}
.ink .btn-ghost:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn-row{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2.5rem}
.center .btn-row{justify-content:center}

.link-more{
    display:inline-flex;align-items:center;gap:.7rem;
    font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;
    padding-bottom:.5rem;border-bottom:1px solid var(--line-strong);
    color:var(--ink);transition:gap var(--t),border-color var(--t),color var(--t);
}
.link-more:hover{gap:1.15rem;border-color:var(--gold);color:var(--gold)}
.ink .link-more{color:var(--paper);border-color:var(--line-inv)}
.ink .link-more:hover{color:var(--gold-soft);border-color:var(--gold-soft)}

/* ---------- 6. Header ---------- */
.site-header{
    position:fixed;inset:0 0 auto 0;z-index:120;
    height:var(--header-h);
    display:flex;align-items:center;
    background:transparent;
    transition:background .45s var(--ease),box-shadow .45s var(--ease),height .45s var(--ease);
}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:2rem;width:100%}
.site-header.is-solid,.site-header.is-open{background:rgba(251,250,248,.94);backdrop-filter:saturate(180%) blur(14px);box-shadow:0 1px 0 var(--line)}
body.hero-dark .site-header:not(.is-solid):not(.is-open){color:var(--paper)}
body.hero-dark .site-header:not(.is-solid):not(.is-open) .logo-mark path,
body.hero-dark .site-header:not(.is-solid):not(.is-open) .logo-mark circle{stroke:var(--paper)}
body.hero-dark .site-header:not(.is-solid):not(.is-open) .logo-word{color:var(--paper)}
body.hero-dark .site-header:not(.is-solid):not(.is-open) .nav-list a{color:rgba(251,250,248,.82)}
body.hero-dark .site-header:not(.is-solid):not(.is-open) .burger span{background:var(--paper)}
body.hero-dark .site-header:not(.is-solid):not(.is-open) .lang-switch a{color:rgba(251,250,248,.7);border-color:var(--line-inv)}

.logo{display:flex;align-items:center;flex-shrink:0}
.logo a{display:flex;align-items:center;gap:.75rem}
.logo-mark{width:38px;height:38px;flex-shrink:0}
.logo-mark path,.logo-mark circle{transition:stroke .4s var(--ease)}
.logo-word{
    font-family:var(--serif);font-size:1.32rem;letter-spacing:.2em;color:var(--ink);
    line-height:1;transition:color .4s var(--ease);white-space:nowrap;
}
.logo-word small{display:block;font-family:var(--sans);font-size:.5rem;letter-spacing:.42em;margin-top:.34rem;opacity:.62}
.logo:hover{opacity:.72}
.logo{transition:opacity var(--t)}

.nav-list{display:flex;align-items:center;gap:clamp(1rem,2vw,2.1rem)}
.nav-list>li{position:relative}
.nav-list a{
    font-size:.7rem;letter-spacing:.19em;text-transform:uppercase;color:var(--ink-3);
    padding:.5rem 0;display:inline-block;position:relative;transition:color var(--t);white-space:nowrap;
}
.nav-list a::after{
    content:"";position:absolute;left:0;bottom:.1rem;width:0;height:1px;background:currentColor;
    transition:width var(--t);
}
.nav-list a:hover::after,.nav-list a.active::after{width:100%}
.nav-list a.active{color:var(--ink)}
.has-sub>a::before{content:"";position:absolute;right:-.85rem;top:50%;width:5px;height:5px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-70%) rotate(45deg);opacity:.6}
.has-sub{margin-right:.85rem}
.subnav{
    position:absolute;top:calc(100% + .6rem);left:50%;transform:translate(-50%,8px);
    min-width:250px;background:var(--paper);border:1px solid var(--line);
    padding:.6rem 0;opacity:0;visibility:hidden;transition:all .35s var(--ease);
    box-shadow:0 24px 50px -28px rgba(12,12,13,.4);
}
.has-sub:hover .subnav,.has-sub:focus-within .subnav{opacity:1;visibility:visible;transform:translate(-50%,0)}
.subnav a{display:block;padding:.85rem 1.5rem;color:var(--ink-3);letter-spacing:.14em}
.subnav a::after{display:none}
.subnav a:hover{background:var(--paper-2);color:var(--ink)}
.subnav .sub-desc{display:block;font-family:var(--sans);font-size:.62rem;letter-spacing:.1em;text-transform:none;color:var(--muted);margin-top:.2rem}

.header-right{display:flex;align-items:center;gap:1.4rem}
.lang-switch a{
    font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);
    border:1px solid var(--line);padding:.45rem .8rem;transition:all var(--t);
}
.lang-switch a:hover{border-color:var(--ink);color:var(--ink)}
.header-cta{display:inline-flex}
.header-cta .btn{padding:.85rem 1.6rem;font-size:.66rem}

.burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;background:none;border:0;cursor:pointer;padding:0}
.burger span{display:block;width:22px;height:1px;background:var(--ink);transition:transform .4s var(--ease),opacity .3s var(--ease);margin-left:auto;margin-right:auto}
.burger.is-active span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger.is-active span:nth-child(2){opacity:0}
.burger.is-active span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* Mobile drawer */
.mobile-nav{
    position:fixed;inset:var(--header-h) 0 auto 0;z-index:110;
    background:var(--paper);border-top:1px solid var(--line);
    max-height:calc(100dvh - var(--header-h));overflow-y:auto;
    transform:translateY(calc(-100% - var(--header-h) - 12px));transition:transform .5s var(--ease);
    padding:1.5rem var(--gutter) 3rem;display:none;
}
.mobile-nav.is-open{transform:translateY(0)}
.mobile-nav{visibility:hidden}
.mobile-nav.is-open{visibility:visible}
.mobile-nav a{display:block;padding:1rem 0;border-bottom:1px solid var(--line);font-size:.82rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2)}
.mobile-nav .m-sub a{padding-left:1.2rem;font-size:.74rem;color:var(--muted);letter-spacing:.14em}
.mobile-nav .btn{margin-top:1.8rem;width:100%;justify-content:center}

/* ---------- 7. Hero ---------- */
.hero{
    position:relative;min-height:100svh;display:flex;align-items:center;
    background:var(--ink);color:var(--paper);overflow:hidden;
    padding-top:var(--header-h);
}
.hero-bg{position:absolute;inset:0;opacity:.5;pointer-events:none}
.hero-bg svg{width:100%;height:100%;object-fit:cover}
.hero::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:radial-gradient(115% 85% at 72% 32%,rgba(176,141,87,.16) 0%,transparent 62%);
}
.hero-inner{position:relative;z-index:3;padding-block:clamp(4rem,10vw,7rem);max-width:960px}
.hero h1{color:var(--paper);letter-spacing:.02em;font-weight:200}
.hero h1 .ital{font-style:italic;color:var(--gold-soft)}
.hero .eyebrow{color:rgba(251,250,248,.55)}
.hero-sub{margin-top:2rem;max-width:44ch;color:rgba(251,250,248,.74);font-size:clamp(1rem,.95rem + .35vw,1.22rem);line-height:1.7}
.hero-lines{display:flex;flex-wrap:wrap;gap:.9rem 2rem;margin-top:2.6rem;padding-top:2rem;border-top:1px solid var(--line-inv)}
.hero-lines span{font-size:.68rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(251,250,248,.6)}
.hero-lines span b{color:var(--gold-soft);font-weight:400}
.scroll-cue{
    position:absolute;left:50%;bottom:2.2rem;transform:translateX(-50%);z-index:4;
    display:flex;flex-direction:column;align-items:center;gap:.7rem;
    font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(251,250,248,.45);
}
.scroll-cue i{display:block;width:1px;height:44px;background:linear-gradient(to bottom,rgba(251,250,248,.5),transparent);animation:cue 2.4s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* Page hero (inner pages) */
.page-hero{
    background:var(--ink);color:var(--paper);position:relative;overflow:hidden;
    padding-top:calc(var(--header-h) + clamp(4rem,9vw,7.5rem));
    padding-bottom:clamp(3.5rem,8vw,6.5rem);
}
.page-hero .hero-bg{opacity:.42}
.page-hero h1{color:var(--paper);font-weight:200;max-width:19ch}
.page-hero .lede{margin-top:1.8rem;max-width:58ch;color:rgba(251,250,248,.75)}
.page-hero .wrap{position:relative;z-index:3}
.crumbs{font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(251,250,248,.48);margin-bottom:1.6rem}
.crumbs a{color:rgba(251,250,248,.7)}
.crumbs a:hover{color:var(--gold-soft)}
.crumbs span{margin:0 .55rem;opacity:.5}

/* ---------- 8. Marquee ---------- */
.marquee{
    background:var(--ink);color:rgba(251,250,248,.6);
    padding:1.15rem 0;overflow:hidden;white-space:nowrap;
    border-top:1px solid var(--line-inv);border-bottom:1px solid var(--line-inv);
}
.marquee-track{display:inline-flex;gap:3.5rem;animation:marq 38s linear infinite;will-change:transform}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee span{font-size:.68rem;letter-spacing:.34em;text-transform:uppercase;display:inline-flex;align-items:center;gap:3.5rem}
.marquee span::after{content:"✦";color:var(--gold);font-size:.6rem}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- 9. Division cards ---------- */
.division{
    position:relative;background:var(--paper);border:1px solid var(--line);
    padding:clamp(2rem,3.4vw,3rem);display:flex;flex-direction:column;
    transition:transform var(--t),box-shadow var(--t),border-color var(--t);
    overflow:hidden;
}
.division::before{
    content:"";position:absolute;inset:auto 0 0 0;height:2px;background:var(--gold);
    transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease);
}
.division:hover{transform:translateY(-6px);box-shadow:0 34px 60px -40px rgba(12,12,13,.45);border-color:var(--line-strong)}
.division:hover::before{transform:scaleX(1)}
.division .ico{width:66px;height:66px;margin-bottom:1.8rem}
.division .num{
    position:absolute;top:1.5rem;right:1.8rem;font-family:var(--serif);font-size:2.6rem;
    color:var(--stone);line-height:1;
}
.division h3{margin-bottom:.55rem}
.division .motto{font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin-bottom:1.3rem}
.division p{color:var(--muted);font-size:.95rem}
.division .link-more{margin-top:auto;padding-top:1.8rem;align-self:flex-start}
.division ul.mini{margin:1.4rem 0 0;display:flex;flex-wrap:wrap;gap:.5rem}
.division ul.mini li{font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border:1px solid var(--line);padding:.32rem .7rem}

/* ---------- 10. Value / feature grid ---------- */
.value{padding:2.2rem 0;border-top:1px solid var(--line)}
.value .ico{width:44px;height:44px;margin-bottom:1.5rem}
.value h4{margin-bottom:.7rem;font-family:var(--sans);font-size:.74rem;letter-spacing:.24em;text-transform:uppercase;font-weight:400;color:var(--ink)}
.value p{font-size:.9rem;color:var(--muted)}
.ink .value{border-color:var(--line-inv)}
.ink .value h4{color:var(--paper)}
.ink .value p{color:rgba(251,250,248,.6)}
.ink .value .ico path,.ink .value .ico circle,.ink .value .ico rect,.ink .value .ico line,.ink .value .ico polyline{stroke:var(--gold-soft)}

/* ---------- 11. Numbered / feature list ---------- */
.feature{display:grid;grid-template-columns:auto 1fr;gap:1.6rem;padding:2rem 0;border-bottom:1px solid var(--line)}
.feature:first-child{border-top:1px solid var(--line)}
.feature .n{font-family:var(--serif);font-size:1.5rem;color:var(--gold);line-height:1.2;min-width:2.2rem}
.feature h4{margin-bottom:.55rem}
.feature p{color:var(--muted);font-size:.94rem;margin:0}
.ink .feature{border-color:var(--line-inv)}
.ink .feature p{color:rgba(251,250,248,.62)}

.checklist li{position:relative;padding-left:1.9rem;margin-bottom:1rem;color:var(--ink-3);font-size:.96rem}
.checklist li::before{
    content:"";position:absolute;left:0;top:.5em;width:11px;height:6px;
    border-left:1px solid var(--gold);border-bottom:1px solid var(--gold);
    transform:rotate(-45deg);
}
.ink .checklist li{color:rgba(251,250,248,.72)}

/* ---------- 12. Stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line)}
.stat{background:var(--paper);padding:2.4rem 1.6rem;text-align:center}
.ink .stats{background:var(--line-inv)}
.ink .stat{background:var(--ink)}
.stat .fig{font-family:var(--serif);font-size:clamp(2rem,1.4rem + 2vw,3rem);color:var(--ink);line-height:1;display:block}
.ink .stat .fig{color:var(--paper)}
.stat .cap{font-size:.64rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin-top:.9rem;display:block}

/* ---------- 13. Media / art panels ---------- */
.art-panel{
    position:relative;background:var(--ink);overflow:hidden;
    aspect-ratio:4/5;display:flex;align-items:center;justify-content:center;
}
.art-panel svg{width:100%;height:100%}
.art-panel.light{background:var(--paper-2)}
.art-panel.wide{aspect-ratio:16/10}
.art-caption{margin-top:1rem;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}

/* ---------- 14. Accordion (FAQ) ---------- */
.acc{border-top:1px solid var(--line)}
.acc-item{border-bottom:1px solid var(--line)}
.acc-q{
    width:100%;text-align:left;background:none;border:0;cursor:pointer;
    padding:1.7rem 3rem 1.7rem 0;position:relative;
    font-family:var(--serif);font-size:clamp(1.1rem,1rem + .5vw,1.4rem);color:var(--ink);line-height:1.35;
}
.acc-q::after,.acc-q::before{content:"";position:absolute;right:.4rem;top:50%;background:var(--ink-3);transition:transform .4s var(--ease),opacity .3s var(--ease)}
.acc-q::after{width:14px;height:1px;transform:translateY(-50%)}
.acc-q::before{width:1px;height:14px;right:calc(.4rem + 6.5px);transform:translateY(-50%)}
.acc-item.is-open .acc-q::before{transform:translateY(-50%) rotate(90deg);opacity:0}
.acc-a{max-height:0;overflow:hidden;transition:max-height .55s var(--ease)}
.acc-a-inner{padding:0 3rem 1.9rem 0;color:var(--muted);font-size:.96rem}

/* ---------- 15. Journal cards ---------- */
.post{display:flex;flex-direction:column;border-top:1px solid var(--ink);padding-top:1.6rem;transition:opacity var(--t)}
.post .meta{font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:1rem}
.post h3{margin-bottom:.9rem;transition:color var(--t)}
.post:hover h3{color:var(--gold)}
.post p{color:var(--muted);font-size:.94rem}
.post .link-more{margin-top:1.6rem;align-self:flex-start}

.article-body{max-width:74ch;margin:0 auto}
.article-body h2{margin:2.8rem 0 1.1rem;font-size:clamp(1.6rem,1.3rem + 1.3vw,2.3rem)}
.article-body h3{margin:2rem 0 .8rem}
.article-body p{color:var(--ink-3)}
.article-body ul{margin:0 0 1.4rem}
.article-body ul li{position:relative;padding-left:1.5rem;margin-bottom:.7rem;color:var(--ink-3)}
.article-body ul li::before{content:"";position:absolute;left:0;top:.75em;width:6px;height:1px;background:var(--gold)}
.article-body blockquote{
    margin:2.6rem 0;padding:0 0 0 2rem;border-left:1px solid var(--gold);
    font-family:var(--serif);font-size:1.45rem;line-height:1.45;color:var(--ink);font-style:italic;
}
.article-body .note{background:var(--paper-2);padding:1.6rem 1.8rem;font-size:.9rem;color:var(--muted);margin:2.4rem 0}

/* ---------- 16. Contact / form ---------- */
.contact-form{display:grid;gap:1.4rem;grid-template-columns:1fr 1fr}
.contact-form .full{grid-column:1/-1}
.contact-form label{display:block;font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:.6rem}
.contact-form input,.contact-form select,.contact-form textarea{
    width:100%;background:transparent;border:0;border-bottom:1px solid var(--line-strong);
    padding:.85rem 0;font-size:.98rem;font-weight:300;color:var(--ink);border-radius:0;
    transition:border-color var(--t);
}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{outline:0;border-color:var(--gold)}
.contact-form textarea{min-height:130px;resize:vertical}
.contact-form select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink-3) 50%),linear-gradient(135deg,var(--ink-3) 50%,transparent 50%);background-position:calc(100% - 12px) 55%,calc(100% - 7px) 55%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.contact-form button[type=submit]{
    grid-column:1/-1;justify-self:start;
    padding:1.05rem 2.4rem;background:var(--ink);color:var(--paper);border:1px solid var(--ink);
    font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;cursor:pointer;transition:all var(--t);
}
.contact-form button[type=submit]:hover{background:transparent;color:var(--ink);transform:translateY(-2px)}
.captcha-row{grid-column:1/-1;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.captcha-row img,.captcha-row svg{border:1px solid var(--line);background:#fff}
.captcha-row input{max-width:170px}
.form-note{grid-column:1/-1;font-size:.78rem;color:var(--muted);line-height:1.6}

.info-block{padding:1.8rem 0;border-top:1px solid var(--line)}
.info-block .k{font-size:.64rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin-bottom:.7rem}
.info-block .v{font-family:var(--serif);font-size:1.3rem;color:var(--ink);line-height:1.4}
.info-block .v a:hover{color:var(--gold)}

/* ---------- 17. CTA band ---------- */
.cta-band{background:var(--ink);color:var(--paper);text-align:center;position:relative;overflow:hidden}
.cta-band .wrap{position:relative;z-index:2}
.cta-band h2{color:var(--paper);font-weight:200;max-width:18ch;margin:0 auto}
.cta-band .lede{max-width:52ch;margin:1.6rem auto 0;color:rgba(251,250,248,.72)}
.cta-band-art{position:absolute;inset:0;opacity:.28;pointer-events:none}

/* ---------- 18. Footer ---------- */
footer{background:var(--ink);color:rgba(251,250,248,.62);padding:clamp(3.5rem,7vw,5.5rem) 0 2rem;border-top:1px solid var(--line-inv)}
.footer-brand{display:flex;align-items:center;gap:.8rem;margin-bottom:1.6rem}
.footer-brand .logo-mark{width:42px;height:42px}
.footer-brand .logo-mark path,.footer-brand .logo-mark circle{stroke:var(--paper)}
.footer-brand .logo-word{color:var(--paper);font-size:1.3rem}
.footer-content{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:clamp(2rem,4vw,3.5rem);margin-bottom:3.5rem}
.footer-section h3{color:var(--paper);font-family:var(--sans);font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;font-weight:400;margin-bottom:1.5rem}
.footer-section p{color:rgba(251,250,248,.6);line-height:1.9;font-size:.9rem;margin-bottom:.6rem}
.footer-section a{color:rgba(251,250,248,.6);transition:color var(--t);font-size:.9rem}
.footer-section a:hover{color:var(--gold-soft)}
.footer-section strong{color:rgba(251,250,248,.85);font-weight:400}
.footer-tagline{font-family:var(--serif);font-size:1.15rem;line-height:1.6;color:rgba(251,250,248,.75);max-width:34ch;font-style:italic}
.footer-lines{
    display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem 2.2rem;
    padding:2.2rem 0;border-top:1px solid var(--line-inv);border-bottom:1px solid var(--line-inv);
    margin-bottom:2rem;
}
.footer-lines span{font-size:.64rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(251,250,248,.5)}
.footer-lines span b{color:var(--gold-soft);font-weight:400}
.footer-bottom{text-align:center;color:rgba(251,250,248,.45);font-size:.8rem}
.footer-bottom p{margin-bottom:.5rem}
.footer-bottom a{color:rgba(251,250,248,.6)}
.footer-partner{margin-top:1.4rem;font-size:.8rem;color:rgba(251,250,248,.5)}
.footer-partner a{color:var(--gold-soft)}
.footer-partner a:hover{color:var(--paper)}
.footer-legal{display:flex;gap:1.6rem;justify-content:center;flex-wrap:wrap;margin-top:1rem}
.footer-legal a{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase}
.disclaimer{font-size:.72rem;color:rgba(251,250,248,.38);max-width:78ch;margin:1.8rem auto 0;line-height:1.7;text-align:center}

/* ---------- 19. Reveal animation ---------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.is-in{opacity:1;transform:none}
.reveal.d1{transition-delay:.09s}.reveal.d2{transition-delay:.18s}.reveal.d3{transition-delay:.27s}
.reveal.d4{transition-delay:.36s}.reveal.d5{transition-delay:.45s}
@media (prefers-reduced-motion:reduce){
    .reveal{opacity:1;transform:none;transition:none}
    .marquee-track{animation:none}
    .scroll-cue i{animation:none}
    html{scroll-behavior:auto}
}

/* ---------- 20. Responsive ---------- */
@media (max-width:1080px){
    .footer-content{grid-template-columns:1fr 1fr}
    .g-4{grid-template-columns:repeat(2,1fr)}
    .stats{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:960px){
    :root{--header-h:68px}
    .nav-list,.header-cta{display:none}
    .burger{display:flex}
    .mobile-nav{display:block}
    .split,.split-40,.split-60{grid-template-columns:1fr;gap:2.5rem}
    .g-3{grid-template-columns:1fr}
    .art-panel{aspect-ratio:16/11}
    .split .art-panel{order:-1}
}
@media (max-width:640px){
    .g-2,.g-4{grid-template-columns:1fr}
    .contact-form{grid-template-columns:1fr}
    .logo-word{font-size:1.12rem;letter-spacing:.16em}
    .logo-word small{letter-spacing:.3em}
    .hero-lines{gap:.7rem 1.4rem}
    .footer-content{grid-template-columns:1fr;gap:2.4rem}
    .stats{grid-template-columns:1fr}
    .btn{width:100%;justify-content:center}
    .btn-row{flex-direction:column}
}

/* ---------- 21. Skip link ---------- */
.skip-link{
    position:absolute;left:-9999px;top:0;z-index:200;
    background:var(--ink);color:var(--paper);padding:.9rem 1.4rem;
    font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
}
.skip-link:focus{left:0}
:focus-visible{outline:1px solid var(--gold);outline-offset:3px}

/* ---------- 22. Buttons on dark hero / CTA surfaces ---------- */
.hero .btn,.page-hero .btn,.cta-band .btn{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.hero .btn:hover,.page-hero .btn:hover,.cta-band .btn:hover{background:transparent;color:var(--paper)}
.hero .btn-ghost,.page-hero .btn-ghost,.cta-band .btn-ghost{background:transparent;color:var(--paper);border-color:var(--line-inv)}
.hero .btn-ghost:hover,.page-hero .btn-ghost:hover,.cta-band .btn-ghost:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.hero .link-more,.page-hero .link-more,.cta-band .link-more{color:var(--paper);border-color:var(--line-inv)}
.hero .link-more:hover,.page-hero .link-more:hover,.cta-band .link-more:hover{color:var(--gold-soft);border-color:var(--gold-soft)}
.cta-band .eyebrow{color:rgba(251,250,248,.55)}
.cta-band .eyebrow--gold{color:var(--gold-soft)}
.cta-band .lede{color:rgba(251,250,248,.74)}

/* ---------- 23. Chinese typography adjustments ---------- */
html[lang="zh-Hans"] .hero h1 .ital,
html[lang="zh-Hans"] .footer-tagline,
html[lang="zh-Hans"] .serif-quote,
html[lang="zh-Hans"] .article-body blockquote,
html[lang="zh-Hans"] em{font-style:normal}
html[lang="zh-Hans"] .hero h1 .ital{color:var(--gold-soft)}
html[lang="zh-Hans"] h1,html[lang="zh-Hans"] h2,html[lang="zh-Hans"] h3{letter-spacing:.01em;line-height:1.22}
html[lang="zh-Hans"] h1{line-height:1.18}
html[lang="zh-Hans"] body,html[lang="zh-Hans"] p{letter-spacing:.015em}
html[lang="zh-Hans"] em{color:var(--gold)}
html[lang="zh-Hans"] .article-body blockquote{font-size:1.3rem;line-height:1.7}

/* ---------- 24. Header CTA over dark hero ---------- */
body.hero-dark .site-header:not(.is-solid):not(.is-open) .header-cta .btn{
    background:transparent;color:var(--paper);border-color:rgba(251,250,248,.42);
}
body.hero-dark .site-header:not(.is-solid):not(.is-open) .header-cta .btn:hover{
    background:var(--paper);color:var(--ink);border-color:var(--paper);
}
body.hero-dark .site-header:not(.is-solid):not(.is-open) .subnav{
    background:var(--ink);border-color:var(--line-inv);
}
body.hero-dark .site-header:not(.is-solid):not(.is-open) .subnav a{color:rgba(251,250,248,.8)}
body.hero-dark .site-header:not(.is-solid):not(.is-open) .subnav a:hover{background:rgba(251,250,248,.06);color:var(--paper)}
body.hero-dark .site-header:not(.is-solid):not(.is-open) .subnav .sub-desc{color:rgba(251,250,248,.45)}