/* First-screen direction: graphite, paper, lime. Scoped to the homepage intro. */
body[data-page="home"] .site-header { --ink:#292b26; --dark:#292b26; --paper:#f5f4ee; background:rgba(245,244,238,.94); border-color:#dfe0d7; }
body[data-page="home"] .site-header .brand-name { display:block; color:#292b26; font-family:'Segoe UI',system-ui,sans-serif; font-size:23px; letter-spacing:-1px; }
body[data-page="home"] .site-header .brand-name > span { display:inline; color:#78912b; }
body[data-page="home"] .site-header .brand-name small { display:block; margin-top:5px; color:#777b6c; font-size:8px; letter-spacing:.02em; }
body[data-page="home"] .site-header .brand-mark { background:#292b26; border-radius:12px; }
body[data-page="home"] .site-header .nav-link { color:#6c7163; font-size:13px; }
body[data-page="home"] .site-header .nav-link.active { color:#292b26; }
body[data-page="home"] .site-header .nav-cta { background:#292b26; border-radius:11px; color:#fff; }
body[data-page="home"] .site-header .language-switch { border-color:#dedfd5; background:transparent; }
body[data-page="home"] .site-header .language-button.active { background:#292b26; color:#e3f6a7; }
body[data-page="home"] .site-header .menu-toggle { background:#fff; border-color:#dedfd5; }
.intro-lab { --charcoal:#292b26; --lime:#d5f56c; position:relative; overflow:hidden; padding:64px 0 0; background:#f5f4ee; color:var(--charcoal); font-family:'Segoe UI',system-ui,sans-serif; }
.intro-lab *, .intro-lab *::before, .intro-lab *::after { box-sizing:border-box; }
.intro-shell { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:0 30px; width:min(1280px,calc(100% - 80px)); }
.intro-copy { position:relative; z-index:2; align-self:center; padding:15px 0 34px; animation:intro-enter .8s both; }
.intro-eyebrow { display:inline-flex; align-items:center; gap:10px; color:#686e5d; font-size:11px; font-weight:600; letter-spacing:.075em; text-transform:uppercase; }
.intro-eyebrow i { width:8px; height:8px; border-radius:50%; background:#a2be4e; box-shadow:0 0 0 5px #e7edcf; }
.intro-copy h1 { margin:28px 0 26px; font-family:inherit; font-size:clamp(49px,5.65vw,81px); font-weight:600; line-height:1.015; letter-spacing:-.063em; }
.intro-copy h1 > span, .intro-copy h1 > em { display:block; }
.intro-copy h1 > em { position:relative; width:fit-content; font-style:normal; z-index:0; }
.intro-copy h1 > em::after { display:none; }
.intro-lead { max-width:450px; margin:0; color:#6b7162; font-size:16px; line-height:1.75; }
.intro-actions { display:flex; flex-wrap:wrap; align-items:center; gap:15px 25px; margin-top:30px; }
.intro-primary, .intro-secondary { display:inline-flex; min-height:54px; align-items:center; justify-content:center; gap:20px; padding:0 22px; border:1px solid #d5f56c; border-radius:11px; background:#d5f56c; color:#292b26; font-size:13px; font-weight:600; transition:background .25s,transform .25s,box-shadow .25s; }
.intro-primary > span { display:inline-block; color:#292b26; font-size:17px; }
.intro-primary:hover { transform:translateY(-3px); background:#e3fba4; box-shadow:0 10px 22px #71843d18; }
.intro-secondary { border-color:#cdd3bf; background:#fafbf6; color:#59634a; }
.intro-secondary:hover { border-color:#292b26; transform:translateY(-2px); }
.intro-note { display:flex; gap:10px; align-items:center; margin:22px 0 0; color:#8a9080; font-size:11px; }
.intro-note > span { color:#747e59; font-size:20px; }
.intro-scene { --mx:0px; --my:0px; position:relative; min-width:0; min-height:544px; align-self:center; isolation:isolate; animation:intro-enter 1s .12s both; }
.intro-scene-grid { position:absolute; z-index:-2; inset:8% -8% 15%; border-radius:50%; background-image:linear-gradient(#aab09416 1px,transparent 1px),linear-gradient(90deg,#aab09416 1px,transparent 1px); background-size:28px 28px; mask-image:radial-gradient(ellipse,#000,transparent 70%); }
.intro-halo { position:absolute; z-index:-1; width:75%; aspect-ratio:1; top:4%; right:-4%; border:1px solid #d9dfc9; border-radius:50%; background:radial-gradient(circle,#e7f0c3,transparent 68%); }
.intro-halo::before { position:absolute; inset:10%; border:1px dashed #cad4ad; border-radius:50%; content:''; animation:intro-orbit 50s linear infinite; }
.intro-halo::after { position:absolute; top:12%; left:15%; width:12px; height:12px; border:4px solid #eff2e3; border-radius:50%; background:#99ad54; box-sizing:content-box; content:''; }
.intro-coordinate { position:absolute; top:8px; right:0; color:#969b89; font-size:8px; font-weight:600; letter-spacing:.16em; }
.intro-composition { position:absolute; inset:16px 0 99px; transform:translate(var(--mx),var(--my)); transition:transform .5s cubic-bezier(.2,.7,.2,1); }
.intro-back-sheet { position:absolute; top:10%; right:1%; width:80%; height:80%; border:1px solid #c4cbb2; border-radius:19px; background:#dfe5cf; transform:rotate(9deg); transition:transform .8s,background .8s; }
.intro-window { position:absolute; top:11%; left:3%; width:89%; overflow:hidden; border:1px solid #353a2d1c; border-radius:18px; background:#fff; box-shadow:0 30px 55px #4b503421; transform:rotate(-5deg); transition:transform .8s cubic-bezier(.2,.7,.2,1),box-shadow .8s; }
.intro-toolbar { display:flex; height:34px; align-items:center; justify-content:space-between; padding:0 15px; border-bottom:1px solid #e9ece2; color:#9a9f8d; font-size:9px; }
.intro-toolbar >span:first-child { display:flex; gap:4px; }
.intro-toolbar i { width:5px; height:5px; border-radius:50%; background:#d9dfca; }
.intro-toolbar i:first-child { background:#b5c779; }
.intro-toolbar b { font-size:8px; font-weight:500; letter-spacing:.06em; }
.intro-window-body { padding:18px 21px 21px; background:#fafbf6; transition:background .8s; }
.intro-mini-nav { display:flex; gap:13px; align-items:center; }
.intro-mini-nav >b { margin-right:auto; color:#333d27; font-size:19px; letter-spacing:-2px; }
.intro-mini-nav >i { width:24px; height:3px; border-radius:4px; background:#b6bfaa; }
.intro-mini-nav >span { width:35px; height:13px; border-radius:5px; background:#d5f56c; transition:background .8s; }
.intro-mini-content { position:relative; display:flex; min-height:210px; align-items:center; }
.intro-mini-copy { position:relative; z-index:1; width:58%; padding:24px 0 15px; }
.intro-mini-copy small { color:#8b9675; font-size:6px; letter-spacing:.12em; }
.intro-mini-copy strong { display:block; margin:10px 0 17px; color:#2f3727; font-size:clamp(30px,3.2vw,45px); font-weight:600; line-height:1.02; letter-spacing:-.05em; }
.intro-mini-copy strong em { color:#8ca344; font-weight:500; }
.intro-mini-copy >i { display:block; width:79%; height:4px; margin-top:5px; border-radius:5px; background:#d4dcca; }
.intro-mini-copy >i:nth-of-type(2) { width:57%; }
.intro-mini-copy >b { display:block; width:54px; height:19px; margin-top:17px; border-radius:5px; background:#d0eb80; transition:background .8s; }
.intro-sculpture { position:absolute; top:0; right:-7%; width:66%; height:100%; object-fit:contain; animation:intro-sculpture 7s ease-in-out infinite; transition:filter .8s,opacity .8s; }
.intro-mini-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.intro-mini-cards >div { min-height:58px; padding:11px; border:1px solid #e1e7d7; border-radius:9px; background:#f1f4e9; }
.intro-mini-cards i { display:block; width:12px; height:12px; margin-bottom:9px; border-radius:4px; background:#b4ca7c; }
.intro-mini-cards b, .intro-mini-cards span { display:block; width:85%; height:4px; border-radius:3px; background:#bec9ac; }
.intro-mini-cards span { width:58%; height:3px; margin-top:5px; background:#d5dec9; }
.intro-window-footer { display:flex; align-items:center; justify-content:space-between; gap:9px; height:28px; padding:0 15px; border-top:1px solid #e8eddf; color:#9aa18d; font-size:6px; letter-spacing:.1em; }
.intro-window-footer i { flex:1; height:1px; background:#e3e9d8; }
.intro-palette { position:absolute; z-index:2; top:0; left:0; width:155px; padding:12px; border:1px solid #e4e7da; border-radius:12px; background:#fff; box-shadow:0 13px 28px #4b503416; transform:rotate(-8deg); transition:opacity .7s,transform .7s; animation:intro-palette 6s ease-in-out infinite; }
.intro-palette >div { display:flex; height:30px; gap:5px; }
.intro-palette i { flex:1; border-radius:5px; background:#292b26; }
.intro-palette i:nth-child(2) { background:#d5f56c; }
.intro-palette i:nth-child(3) { background:#e8eadf; }
.intro-palette >span { display:block; margin-top:8px; color:#7b8569; font-size:9px; }
.intro-launch { position:absolute; z-index:3; right:-1%; bottom:0; display:flex; align-items:center; gap:9px; padding:14px; border:1px solid #d6dcc9; border-radius:13px; background:#fff; box-shadow:0 17px 34px #4b503420; transition:transform .75s,opacity .75s; }
.intro-launch >i { display:grid; width:29px; height:29px; place-items:center; border-radius:50%; background:#e9eedb; color:#8ea14e; font-size:13px; font-style:normal; transition:background .7s,color .7s; }
.intro-launch b { display:block; color:#4d5940; font-size:11px; font-weight:600; }
.intro-launch div >span { display:block; margin-top:5px; color:#9aa18e; font-size:6px; letter-spacing:.1em; }
.intro-launch svg { width:44px; height:25px; margin-left:7px; fill:none; stroke:#b6c58d; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.intro-pointer { position:absolute; z-index:4; right:30%; bottom:27%; width:30px; transform:rotate(-10deg); transition:right 1s,bottom 1s,opacity .8s; animation:intro-pointer 4s ease-in-out infinite; }
.intro-pointer svg { display:block; width:27px; height:30px; fill:#262b20; stroke:#fff; stroke-width:1.5; filter:drop-shadow(0 3px 3px #0002); }
.intro-pointer span { display:block; width:47px; margin:1px 0 0 18px; padding:4px 7px; border-radius:4px; background:#292b26; color:#e6f7b5; font-size:8px; }
.intro-stage-control { position:absolute; right:0; bottom:0; left:0; z-index:5; }
.intro-stage-buttons { display:flex; gap:4px; width:fit-content; margin-inline:auto; padding:5px; border:1px solid #dce0d1; border-radius:13px; background:#ecefe4; }
.intro-stage-buttons button { display:flex; align-items:center; gap:9px; min-height:37px; padding:0 14px; border:0; border-radius:9px; background:transparent; color:#858d77; font-family:inherit; font-size:12px; cursor:pointer; transition:color .25s,background .25s,box-shadow .25s; }
.intro-stage-buttons button >span { color:#a5ac97; font-size:8px; }
.intro-stage-buttons button[aria-pressed="true"] { background:#fff; color:#313a27; box-shadow:0 2px 7px #424a2920; }
.intro-stage-buttons button[aria-pressed="true"] >span { color:#829a40; }
.intro-stage-buttons button:hover { color:#292b26; }
.intro-stage-buttons button:focus-visible { outline:2px solid #8da541; outline-offset:2px; }
.intro-stage-description { margin:13px 0 0; color:#7e896c; font-size:12px; line-height:1.5; text-align:center; }
.intro-scene[data-phase="idea"] .intro-window { transform:rotate(-3deg) translate(-6px,4px); box-shadow:0 20px 40px #4b503417; }
.intro-scene[data-phase="idea"] .intro-window-body { background:#f1f2ec; }
.intro-scene[data-phase="idea"] .intro-sculpture { filter:grayscale(1); opacity:.25; }
.intro-scene[data-phase="idea"] .intro-mini-nav >span, .intro-scene[data-phase="idea"] .intro-mini-copy >b { background:#d5dccb; }
.intro-scene[data-phase="idea"] .intro-palette { opacity:0; transform:translateY(15px) rotate(-8deg); animation:none; }
.intro-scene[data-phase="idea"] .intro-launch { opacity:0; transform:translateY(15px); }
.intro-scene[data-phase="idea"] .intro-pointer { right:63%; bottom:37%; opacity:.35; }
.intro-scene[data-phase="launch"] .intro-window { transform:rotate(-1deg) translateY(-5px); }
.intro-scene[data-phase="launch"] .intro-back-sheet { transform:rotate(5deg); background:#d9e9ae; }
.intro-scene[data-phase="launch"] .intro-launch { transform:translateY(-6px); }
.intro-scene[data-phase="launch"] .intro-launch >i { background:#d5f56c; color:#3c4928; }
.intro-scene[data-phase="launch"] .intro-pointer { right:12%; bottom:9%; opacity:0; }
.intro-assurance { display:grid; grid-column:1 / -1; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; margin-top:43px; padding:23px 0; border-top:1px solid #dfe2d3; }
.intro-assurance >div { display:flex; align-items:center; gap:13px; min-width:0; }
.intro-assurance >div >span { color:#a2aa91; font-size:10px; }
.intro-assurance p { margin:0; color:#747e63; font-size:12px; }
.intro-assurance i { margin-left:auto; color:#a7b48c; font-size:15px; font-style:normal; }
@keyframes intro-enter { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
@keyframes intro-underline { from { transform:rotate(-1.2deg) scaleX(0); } to { transform:rotate(-1.2deg) scaleX(1); } }
@keyframes intro-orbit { to { transform:rotate(360deg); } }
@keyframes intro-sculpture { 0%,100% { transform:translateY(0) rotate(-3deg); } 50% { transform:translateY(-8px) rotate(3deg); } }
@keyframes intro-palette { 0%,100% { translate:0 0; } 50% { translate:0 -7px; } }
@keyframes intro-pointer { 0%,100% { translate:0 0; } 50% { translate:5px -5px; } }
@media (max-width:1100px) {
 .intro-shell { width:calc(100% - 64px); gap:0 20px; }
 .intro-copy h1 { font-size:clamp(50px,5.5vw,70px); }
 .intro-scene { min-height:510px; }
 .intro-window-body { padding:14px 17px 17px; }
 .intro-mini-content { min-height:180px; }
 .intro-mini-copy strong { font-size:35px; }
 .intro-palette { width:128px; }
 .intro-launch { padding:11px; }
}
@media (max-width:850px) and (min-width:761px) {
 .intro-lab { padding-top:45px; }
 .intro-shell { gap:0 12px; }
 .intro-copy h1 { font-size:48px; }
 .intro-lead { font-size:14px; }
 .intro-scene { min-height:450px; }
 .intro-mini-content { min-height:150px; }
 .intro-mini-copy strong { font-size:30px; }
 .intro-mini-cards >div { min-height:47px; padding:8px; }
 .intro-palette { width:112px; }
 .intro-launch { right:0; gap:6px; }
 .intro-launch svg { display:none; }
 .intro-stage-buttons button { padding-inline:10px; }
 .intro-primary { padding-inline:18px; }
 .intro-actions { gap:12px 20px; }
}
@media (max-width:760px) {
 body[data-page="home"] .site-header .brand-name { font-size:21px; }
 body[data-page="home"] .site-header .main-nav { background:#f5f4ee; }
 .intro-lab { padding-top:42px; }
 .intro-shell { width:min(560px,calc(100% - 40px)); grid-template-columns:minmax(0,1fr); }
 .intro-copy { padding:0; }
 .intro-eyebrow { font-size:10px; }
 .intro-copy h1 { margin:25px 0 22px; font-size:clamp(44px,9.3vw,65px); line-height:1.045; }
 .intro-lead { max-width:500px; font-size:15px; line-height:1.75; }
 .intro-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:25px; }
 .intro-primary { min-height:52px; padding-inline:21px; }
 .intro-note { margin-top:18px; }
 .intro-scene { width:100%; max-width:520px; min-height:510px; margin:35px auto 0; }
 .intro-composition { inset:17px 0 96px; }
 .intro-mini-content { min-height:190px; }
 .intro-mini-copy strong { font-size:40px; }
 .intro-palette { width:140px; }
 .intro-assurance { gap:15px; margin-top:30px; padding:22px 0; }
 .intro-assurance >div { align-items:flex-start; gap:8px; }
 .intro-assurance p { max-width:110px; font-size:11px; line-height:1.5; }
 .intro-assurance i { display:none; }
}
@media (max-width:420px) {
 .intro-shell { width:calc(100% - 32px); }
 .intro-copy h1 { font-size:clamp(41px,10.5vw,46px); }
 .intro-actions { gap:10px; }
 .intro-primary,.intro-secondary { min-height:50px; padding-inline:13px; gap:10px; font-size:12px; }
 .intro-scene { min-height:423px; margin-top:31px; }
 .intro-composition { inset:13px 0 91px; }
 .intro-window { width:91%; left:2%; border-radius:14px; }
 .intro-toolbar { height:27px; padding-inline:11px; }
 .intro-window-body { padding:12px 14px 14px; }
 .intro-mini-nav { gap:9px; }
 .intro-mini-nav >b { font-size:16px; }
 .intro-mini-content { min-height:148px; }
 .intro-mini-copy { padding:16px 0 12px; }
 .intro-mini-copy strong { margin:8px 0 12px; font-size:31px; }
 .intro-mini-copy small { font-size:5px; }
 .intro-mini-copy >b { width:43px; height:15px; margin-top:12px; }
 .intro-mini-cards >div { min-height:46px; padding:8px; border-radius:7px; }
 .intro-mini-cards i { width:9px; height:9px; margin-bottom:6px; }
 .intro-window-footer { height:23px; padding-inline:11px; font-size:5px; }
 .intro-palette { top:2px; width:112px; padding:9px; border-radius:10px; }
 .intro-palette >div { height:21px; }
 .intro-palette >span { font-size:8px; }
 .intro-launch { gap:7px; padding:10px; }
 .intro-launch >i { width:25px; height:25px; }
 .intro-launch b { font-size:9px; }
 .intro-launch svg { width:33px; margin-left:2px; }
 .intro-pointer { width:22px; }
 .intro-pointer svg { width:22px; height:25px; }
 .intro-stage-buttons button { min-height:36px; padding-inline:11px; gap:8px; }
 .intro-stage-description { font-size:11px; }
 .intro-coordinate { font-size:6px; }
}
@media (prefers-reduced-motion:reduce) {
 .intro-lab *, .intro-lab *::before, .intro-lab *::after { animation:none!important; transition:none!important; }
 .intro-composition { transform:none; }
}