html:has(.page-lab){background:#302f2d}
.page-lab{--ink:#bd282e;--hover:#e24a4f;--muted:#a94b4e;--menu-muted:#8e4547;background:#302f2d;color:#bd282e}
.page-lab .skip-link{background:#bd282e;color:#302f2d}
.page-lab .site-header{background:transparent}
.page-lab .brand{position:relative}
.page-lab .brand img{opacity:0}
.page-lab .brand::after{content:"";position:absolute;inset:0;background:#bd282e;-webkit-mask:url("assets/basaltex-logo.svg") left center/contain no-repeat;mask:url("assets/basaltex-logo.svg") left center/contain no-repeat}
.page-lab .menu-panel{background:rgba(48,47,45,.18);color:#bd282e;-webkit-backdrop-filter:blur(17px);backdrop-filter:blur(17px)}
.page-lab.menu-open .menu-panel{background:rgba(48,47,45,.58)}
.page-lab .menu-panel-content a,.page-lab .menu-clock,.page-lab .menu-group-label{color:#bd282e}
.page-lab .menu-panel-content.is-interacting a:not(.is-active){color:#8e4547}
.page-lab .site-footer{color:#bd282e}
.page-lab a:focus-visible,.page-lab button:focus-visible{outline-color:#bd282e}

.lab-main{padding-top:139px}
.lab-intro{align-items:end;padding-bottom:53px}
.lab-intro .section-marker{grid-column:1/4;align-self:start;padding-top:8px}
.lab-intro h1{grid-column:4/10;font-family:var(--sans);font-size:clamp(64px,8.4vw,154px);font-weight:400;line-height:.84;letter-spacing:-.05em}
.lab-intro p{grid-column:10/13;max-width:29ch;padding:0 2px 3px 12px;font-family:var(--mono);font-size:var(--body-size);line-height:var(--body-leading)}
.lab-workspace{align-items:start;gap:0}
.lab-scene-wrap{grid-column:1/10;min-width:0}
.lab-scene{position:relative;width:100%;aspect-ratio:6000/3376;overflow:hidden;background:#242422}
.lab-scene img,.lab-scene canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.lab-scene img{object-fit:cover}
.lab-scene canvas{pointer-events:none;transition:opacity .26s ease}
.lab-scene.is-original canvas{opacity:0}
.lab-scene-tag{position:absolute;z-index:2;bottom:10px;left:10px;padding:5px 7px;background:rgba(48,47,45,.38);color:#eeeae2;font-family:var(--mono);font-size:10px;line-height:1.2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.lab-scene-caption{display:flex;justify-content:space-between;gap:16px;padding:8px 0 0;font-family:var(--mono);font-size:var(--body-size);line-height:var(--body-leading)}
.lab-controls{grid-column:10/13;position:sticky;top:105px;min-width:0;padding:0 0 0 28px;font-family:var(--mono);font-size:var(--body-size);line-height:var(--body-leading)}
.lab-control-intro{padding-bottom:43px}
.lab-control-intro>span{display:block;margin-bottom:13px}
.lab-control-intro p{max-width:28ch}
.lab-controls fieldset{min-width:0;margin:0;padding:0;border:0}
.lab-controls legend{display:block;width:100%;padding:0 0 13px}
.lab-models{margin-bottom:40px!important}
.lab-models button{display:flex;justify-content:space-between;gap:10px;width:100%;padding:8px 0;border:0;border-top:1px solid rgba(189,40,46,.42);background:transparent;color:#bd282e;text-align:left;cursor:pointer;transition:color .2s ease,padding-left .2s ease}
.lab-models button:last-child{border-bottom:1px solid rgba(189,40,46,.42)}
.lab-models button:hover,.lab-models button[aria-pressed="true"]{padding-left:8px;color:#e3575b}
.lab-models button[aria-pressed="true"] span:first-child::before{content:"↗ ";color:#bd282e}
.lab-colors legend{display:flex;justify-content:space-between;gap:10px}
#lab-color-name{max-width:54%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}
.lab-color-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}
.lab-color-grid button{position:relative;display:block;width:100%;aspect-ratio:1;border:0;background:var(--swatch,#aaa);cursor:pointer}
.lab-color-grid button::after{content:"";position:absolute;inset:-3px;border:1px solid transparent;pointer-events:none}
.lab-color-grid button:hover::after,.lab-color-grid button[aria-pressed="true"]::after{border-color:#bd282e}
.lab-actions{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;margin-top:40px}
.lab-actions button{padding:0;border:0;background:transparent;color:#bd282e;text-align:left;cursor:pointer}
.lab-actions button:hover{color:#e3575b}
.lab-endnote{align-items:start;margin-top:105px;padding-bottom:90px}
.lab-endnote p{grid-column:4/9;max-width:36ch}
.lab-endnote a{grid-column:10/13;justify-self:start;padding-left:28px}
.page-lab .site-footer{margin-top:0}

@media(max-width:1050px){
  .lab-intro h1{grid-column:3/10;font-size:clamp(60px,9vw,110px)}
  .lab-scene-wrap{grid-column:1/9}
  .lab-controls{grid-column:9/13;padding-left:20px}
  .lab-color-grid{gap:5px}
}
@media(max-width:760px){
  .lab-main{padding-top:103px}
  .lab-intro{row-gap:27px;padding-bottom:38px}
  .lab-intro .section-marker{grid-column:1/13;padding:0}
  .lab-intro h1{grid-column:1/13;font-size:clamp(66px,14vw,112px)}
  .lab-intro p{grid-column:1/12;padding:0}
  .lab-scene-wrap,.lab-controls{grid-column:1/13}
  .lab-controls{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px;padding:52px 0 0}
  .lab-control-intro,.lab-models,.lab-colors,.lab-actions{margin:0!important;padding:0}
  .lab-actions{grid-column:1/3;justify-content:flex-start;gap:25px}
  .lab-endnote{margin-top:95px;padding-bottom:80px}
  .lab-endnote p{grid-column:1/9}
  .lab-endnote a{grid-column:9/13;padding:0}
}
@media(max-width:500px){
  .lab-intro h1{font-size:clamp(54px,15.5vw,80px)}
  .lab-scene-wrap{margin-inline:-10px}
  .lab-scene{width:100vw;aspect-ratio:4/3}
  .lab-scene img,.lab-scene canvas{width:auto;max-width:none;height:100%;left:50%;transform:translateX(-50%)}
  .lab-scene-caption{padding:9px 10px 0;flex-wrap:wrap}
  .lab-controls{grid-template-columns:1fr;gap:33px;padding-top:48px}
  .lab-control-intro,.lab-models,.lab-colors,.lab-actions{grid-column:1}
  .lab-color-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
  .lab-endnote{row-gap:30px}
  .lab-endnote p,.lab-endnote a{grid-column:1/13}
}
@media(prefers-reduced-motion:reduce){.lab-scene canvas,.lab-models button{transition:none}}

/* Lab identity and visualizer */
.page-lab{--ink:#bd282e;--hover:#e2575c;--menu-muted:#8b4b4d}
.page-lab .site-header{align-items:center;padding-top:12px;padding-bottom:11px;background:rgba(48,47,45,.28);-webkit-backdrop-filter:blur(16px) saturate(125%);backdrop-filter:blur(16px) saturate(125%);border-bottom:1px solid rgba(189,40,46,.15)}
.page-lab .lab-brand{display:block;width:max-content;font-family:var(--mono);font-size:28px;font-weight:400;line-height:1;letter-spacing:-.055em;color:#bd282e}
.page-lab .lab-brand::after{display:none}
.page-lab .lab-parent{grid-column:3/4;align-self:center;font-family:var(--mono);font-size:var(--body-size);line-height:var(--body-leading);color:#bd282e}
.page-lab .header-links{align-self:center}
.page-lab.menu-open .lab-parent{opacity:0;visibility:hidden;pointer-events:none}
.page-lab.menu-open .lab-brand{color:transparent;width:118px;height:27px;background:#bd282e;-webkit-mask:url("assets/basaltex-logo.svg") left center/contain no-repeat;mask:url("assets/basaltex-logo.svg") left center/contain no-repeat}
.page-lab .menu-panel{background:rgba(48,47,45,.16);-webkit-backdrop-filter:blur(18px) saturate(115%);backdrop-filter:blur(18px) saturate(115%)}
.page-lab.menu-open .menu-panel{background:rgba(48,47,45,.46)}
.page-lab .site-footer{margin-top:95px}

.lab-loader{position:fixed;z-index:300;inset:0;display:grid;place-items:center;background:#050505;color:#bd282e;pointer-events:none;animation:lab-loader-out .6s 1.45s forwards}
.lab-loader span{position:relative;z-index:2;font:400 clamp(30px,4vw,54px)/1 var(--mono);letter-spacing:-.055em;animation:lab-loader-word 1.4s steps(1,end) both}
.lab-loader::before,.lab-loader::after{content:"";position:absolute;inset:0;background:rgba(189,40,46,.11);opacity:0;pointer-events:none}
.lab-loader::before{animation:lab-loader-flash 1.32s steps(1,end) both}
.lab-loader::after{background:#161112;animation:lab-loader-flash-alt 1.32s steps(1,end) both}
@keyframes lab-loader-word{0%,15%{opacity:0}16%,36%{opacity:1}37%,42%{opacity:.35}43%,100%{opacity:1}}
@keyframes lab-loader-flash{0%,20%,25%,51%,54%,100%{opacity:0}21%,24%{opacity:1}52%,53%{opacity:.6}}
@keyframes lab-loader-flash-alt{0%,39%,43%,78%,80%,100%{opacity:0}40%,42%{opacity:1}79%{opacity:.8}}
@keyframes lab-loader-out{to{opacity:0;visibility:hidden}}

.lab-main{padding-top:92px}
.lab-heading{align-items:end;padding-top:0;padding-bottom:16px;font-family:var(--mono);font-size:var(--body-size);line-height:var(--body-leading)}
.lab-heading h1{grid-column:1/5;font:inherit}
.lab-heading span{grid-column:8/13;justify-self:end;text-align:right}
.lab-scene-wrap{grid-column:1/10}
.lab-scene{aspect-ratio:2/1}
.lab-scene.is-portrait{aspect-ratio:1.55/1}
.lab-scene img{object-fit:fill}
.lab-scene.is-portrait img,.lab-scene.is-portrait canvas{left:50%;width:auto;height:100%;max-width:100%;transform:translateX(-50%)}
.lab-scene.is-portrait img{object-fit:contain}
.lab-scene-caption{padding-top:7px}
.lab-controls{top:86px;padding-left:23px}
.lab-controls fieldset{margin-bottom:27px!important}
.lab-controls legend{padding-bottom:9px}
.lab-environments button,.lab-models button{display:flex;justify-content:space-between;gap:10px;width:100%;padding:7px 0;border:0;border-top:1px solid rgba(189,40,46,.4);background:transparent;color:#bd282e;text-align:left;font:inherit;cursor:pointer;transition:color .2s ease,padding-left .2s ease}
.lab-environments button:last-child,.lab-models button:last-child{border-bottom:1px solid rgba(189,40,46,.4)}
.lab-environments button:hover,.lab-environments button[aria-pressed="true"],.lab-models button:hover,.lab-models button[aria-pressed="true"]{padding-left:7px;color:#e2575c}
.lab-environments button[aria-pressed="true"] span:first-child::before,.lab-models button[aria-pressed="true"] span:first-child::before{content:"↗ ";color:#bd282e}
.lab-colors legend{display:flex;justify-content:space-between;gap:10px}
.lab-actions{margin-top:28px}
.lab-color-grid button{filter:saturate(.82)}
.lab-color-grid button:hover{filter:none}

@media(max-width:1050px){
  .lab-scene-wrap{grid-column:1/9}
  .lab-controls{grid-column:9/13}
}
@media(max-width:760px){
  .page-lab .site-header{padding-top:15px;padding-bottom:10px}
  .page-lab .lab-brand{grid-column:1/4;grid-row:1;font-size:25px}
  .page-lab .lab-parent{grid-column:4/7;grid-row:1}
  .lab-main{padding-top:100px}
  .lab-heading{row-gap:6px;padding-bottom:13px}
  .lab-heading h1{grid-column:1/6}
  .lab-heading span{grid-column:6/13}
  .lab-scene-wrap,.lab-controls{grid-column:1/13}
  .lab-controls{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:23px;row-gap:25px;padding:32px 0 0}
  .lab-environments,.lab-models,.lab-colors,.lab-actions{margin:0!important;padding:0}
  .lab-environments{grid-column:1}
  .lab-models{grid-column:2}
  .lab-colors,.lab-actions{grid-column:1/3}
  .lab-color-grid{grid-template-columns:repeat(12,minmax(0,1fr))}
}
@media(max-width:500px){
  .page-lab .lab-parent{grid-column:5/8}
  .lab-main{padding-top:98px}
  .lab-heading span{font-size:10px}
  .lab-scene-wrap{margin-inline:-10px}
  .lab-scene{width:100vw;aspect-ratio:2/1}
  .lab-scene img,.lab-scene canvas{left:0;width:100%;max-width:100%;height:100%;transform:none}
  .lab-scene.is-portrait{aspect-ratio:3/4}
  .lab-scene.is-portrait img,.lab-scene.is-portrait canvas{left:50%;width:auto;max-width:100%;height:100%;transform:translateX(-50%)}
  .lab-scene-caption{padding-inline:10px}
  .lab-controls{grid-template-columns:1fr;gap:22px;padding-top:31px}
  .lab-environments,.lab-models,.lab-colors,.lab-actions{grid-column:1}
  .lab-color-grid{grid-template-columns:repeat(8,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){.lab-loader{display:none}.lab-environments button,.lab-models button{transition:none}}

/* Identidad y navegación de Lab */
.page-lab [hidden]{display:none!important}
.page-lab .site-header{align-items:start;padding-top:12px;padding-bottom:0;background:transparent;border:0;-webkit-backdrop-filter:none;backdrop-filter:none}
.page-lab .lab-title{grid-column:1/3;grid-row:1;position:relative;justify-self:start;width:max-content;margin:0;font-family:var(--sans);font-size:var(--product-heading-size);font-weight:400;line-height:1.03;letter-spacing:-.025em}
.page-lab .lab-title .lab-brand{display:inline-block;width:auto;font:inherit;line-height:inherit;letter-spacing:inherit;color:#bd282e}
.page-lab .lab-title sup{position:absolute;top:0;left:calc(100% + 2px);font-family:var(--mono);font-size:var(--body-size);font-weight:400;line-height:var(--body-leading);letter-spacing:-.01em;white-space:nowrap}
.page-lab .lab-title sup a{color:#bd282e}
.page-lab .lab-parent{display:inline;grid-column:auto;font:inherit}
.page-lab .site-header .lab-title,.page-lab .site-header .header-links a,.page-lab .site-header .menu-toggle{background:rgba(48,47,45,.18);-webkit-backdrop-filter:blur(16px) saturate(130%);backdrop-filter:blur(16px) saturate(130%);border:0;box-shadow:none}
.page-lab .site-header .lab-title{padding:3px 7px 4px}
.page-lab .site-header .header-links{align-self:start;overflow:visible}
.page-lab .site-header .header-links a{display:inline-block;width:max-content;padding:5px 7px 6px;animation:lab-header-pop .55s backwards}
.page-lab .site-header .header-links a:nth-child(1){animation-delay:2.12s}
.page-lab .site-header .header-links a:nth-child(2){animation-delay:2.2s}
.page-lab .site-header .header-links a:nth-child(3){animation-delay:2.28s}
.page-lab .site-header .menu-toggle{width:max-content;padding:5px 7px 6px;animation:lab-header-pop .55s 2.36s backwards}
.page-lab .site-header .lab-title{animation:lab-header-pop .55s 1.98s backwards}
.page-lab.menu-open .lab-title{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
.page-lab.menu-open .lab-title sup{display:none}
.page-lab.menu-open .lab-brand{display:block;width:118px;height:27px;font-size:0;background:#bd282e;-webkit-mask:url("assets/basaltex-logo.svg") left center/contain no-repeat;mask:url("assets/basaltex-logo.svg") left center/contain no-repeat}
@keyframes lab-header-pop{from{opacity:0;transform:translateY(9px);filter:blur(5px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}

.lab-loader{animation:lab-loader-out .55s 2.05s forwards}
.lab-loader .lab-loader-full,.lab-loader .lab-loader-short{position:absolute;z-index:2;display:block;width:max-content;font-family:var(--sans);font-size:var(--product-heading-size);font-weight:400;line-height:1.03;letter-spacing:-.025em;color:#bd282e}
.lab-loader .lab-loader-full{animation:lab-full-contract 1.12s cubic-bezier(.22,1,.36,1) forwards}
.lab-loader .lab-loader-short{opacity:0;animation:lab-short-emerge .8s .92s forwards}
.lab-loader .lab-loader-short sup{position:absolute;top:0;left:calc(100% + 2px);font-family:var(--mono);font-size:var(--body-size);font-weight:400;line-height:var(--body-leading);letter-spacing:-.01em;opacity:0;animation:lab-sup-emerge .42s 1.35s forwards}
.lab-loader::before{animation:lab-loader-flash 2s steps(1,end) both}
.lab-loader::after{animation:lab-loader-flash-alt 2s steps(1,end) both}
@keyframes lab-full-contract{0%,48%{opacity:1;transform:scale(1);filter:blur(0)}85%,100%{opacity:0;transform:scale(.42);filter:blur(8px)}}
@keyframes lab-short-emerge{0%{opacity:0;transform:scale(.64);filter:blur(6px)}70%,100%{opacity:1;transform:scale(1);filter:blur(0)}}
@keyframes lab-sup-emerge{to{opacity:1}}

.lab-main{padding-top:0}
.lab-index{min-height:calc(100svh - 130px);align-content:start;padding-top:17vh}
.lab-index-marker{grid-column:1/3;font-family:var(--mono);font-size:var(--body-size);line-height:var(--body-leading)}
.lab-tool-list{grid-column:7/13;display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.lab-tool{width:100%}
.lab-tool-trigger{display:block;width:max-content;max-width:100%;padding:0;border:0;background:transparent;color:#bd282e;text-align:left;font-family:var(--sans);font-size:var(--product-heading-size);font-weight:400;line-height:1.03;letter-spacing:-.025em;cursor:pointer;transition:color .2s ease}
.lab-tool-trigger:hover,.lab-tool-trigger[aria-expanded="true"]{color:#e3575b}
.lab-tool-list:hover .lab-tool-trigger:not(:hover):not([aria-expanded="true"]){color:#875053}
.lab-environment-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-height:0;margin:0;overflow:hidden;opacity:0;transform:translateY(-12px);transition:max-height .44s cubic-bezier(.22,1,.36,1),margin .44s ease,opacity .3s ease,transform .44s cubic-bezier(.22,1,.36,1)}
.lab-tool-visualizer:hover .lab-environment-choices,.lab-tool-visualizer:focus-within .lab-environment-choices,.lab-tool-visualizer.is-open .lab-environment-choices{max-height:360px;margin:18px 0 20px;opacity:1;transform:translateY(0)}
.lab-environment-choices button{min-width:0;padding:0;border:0;background:transparent;color:#bd282e;text-align:left;cursor:pointer;font-family:var(--mono);font-size:var(--body-size);line-height:var(--body-leading)}
.lab-environment-choices img{display:block;width:100%;height:clamp(130px,17vw,230px);object-fit:cover;filter:saturate(.76);transition:filter .3s ease,transform .5s cubic-bezier(.22,1,.36,1)}
.lab-environment-choices button:nth-child(2) img{object-position:center 33%}
.lab-environment-choices button:hover img{filter:saturate(1);transform:scale(1.02)}
.lab-environment-choices button span{display:block;padding-top:7px}
.lab-environment-choices button[aria-pressed="true"] span{color:#e3575b}
.lab-tool-active .lab-index{min-height:0;padding-top:105px;padding-bottom:20px}
.lab-tool-active .lab-index-marker{align-self:start}
.lab-tool-active .lab-tool-list{gap:2px}
.lab-workspace,.lab-calculator{scroll-margin-top:80px}
.lab-scene-caption{align-items:start}
.lab-scene-caption button{padding:0;border:0;background:transparent;color:#bd282e;font:inherit;cursor:pointer}
.lab-scene-caption button:hover{color:#e3575b}
.lab-controls{top:84px}
.lab-controls .lab-models{margin-bottom:27px!important}
.page-lab .site-footer{margin-top:50px}

.lab-calculator{min-height:55svh;align-content:start;padding-top:10px;padding-bottom:80px;font-family:var(--mono);font-size:var(--body-size);line-height:var(--body-leading)}
.lab-calculator-fields{grid-column:7/10;display:grid;gap:12px;padding-right:22px}
.lab-calculator-fields label{display:grid;grid-template-columns:1fr 36px;gap:4px;align-items:end}
.lab-calculator-fields label span{text-align:right}
.lab-calculator-fields input{grid-column:1/3;width:100%;min-width:0;padding:7px 0;border:0;border-bottom:1px solid rgba(189,40,46,.45);border-radius:0;background:transparent;color:#bd282e;font:inherit;outline:none}
.lab-calculator-fields input:focus{border-bottom-color:#bd282e}
.lab-calculator-result{grid-column:10/13;display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding-left:10px}
.lab-calculator-result strong{font-family:var(--sans);font-size:var(--product-heading-size);font-weight:400;line-height:1}
.lab-calculator-result small{max-width:20ch;margin-top:20px;font:inherit}
@media(max-width:760px){
  .page-lab .site-header .lab-title{grid-column:1/5;grid-row:1;padding:2px 6px 3px}
  .page-lab .site-header .menu-toggle{grid-column:10/13;grid-row:1;justify-self:end}
  .lab-index{padding-top:22vh}
  .lab-index-marker{grid-column:1/13;margin-bottom:25px}
  .lab-tool-list{grid-column:2/13}
  .lab-tool-active .lab-index{padding-top:104px}
  .lab-environment-choices img{height:150px}
  .lab-calculator-fields{grid-column:1/7}
  .lab-calculator-result{grid-column:7/13}
}
@media(max-width:500px){
  .lab-index{padding-top:20vh}
  .lab-tool-list{grid-column:1/13}
  .lab-environment-choices{gap:8px}
  .lab-environment-choices img{height:130px}
  .lab-tool-active .lab-index{padding-top:91px}
  .lab-scene-caption{display:grid;grid-template-columns:1fr 1fr;gap:6px}
  .lab-scene-caption button{justify-self:end}
  .lab-scene-caption span:last-child{grid-column:1/3}
  .lab-calculator{row-gap:27px}
  .lab-calculator-fields,.lab-calculator-result{grid-column:1/13;padding:0}
}
@media(prefers-reduced-motion:reduce){.lab-loader,.lab-loader span{animation:none}.lab-header-pop,.lab-tool-trigger,.lab-environment-choices,.lab-environment-choices img{transition:none}}