.depth-world{--ink:#152023;--ivory:#f2e8d8;--gold:#aa8b52;background:var(--ivory);padding:110px 0 0;overflow:clip;color:var(--ink)}
.depth-world .intro{margin:10px auto 0;padding:0 20px}
.depth-world .intro h1{font-size:clamp(48px,6.5vw,100px);font-weight:400}
.depth-world .intro p{font-size:18px;letter-spacing:.12em;margin-top:14px}
.depth-world .modes{width:max-content;max-width:95%;border:1px solid #b5a58b45;border-radius:99px;padding:3px;gap:0;margin:22px auto 20px;z-index:6}
.depth-world .modes button{font-size:16px;min-height:44px;padding:10px 25px;border-radius:99px}
.depth-world .modes button[aria-selected=true]{background:#192527;color:var(--ivory);box-shadow:inset 0 1px 0 #ffffff30,0 3px 8px #17212215}
.depth-world .modes button:after{display:none}
.depth-world .explorer{display:grid;grid-template-columns:65% 35%;position:relative;isolation:isolate;min-height:510px;background:none}
.depth-world .stage{width:100%;height:510px;margin:0;overflow:visible;z-index:1;perspective:none;position:relative}
.depth-world .layer{position:absolute;inset:0}
.depth-product{position:absolute;will-change:transform,opacity;pointer-events:none;isolation:isolate}
.depth-product.pos-0{left:20%;width:23%;height:68%;bottom:13%;z-index:3}
.depth-product.pos-1{left:47%;width:23%;height:48%;bottom:18%;z-index:2}
.depth-product.pos-2{left:71%;width:19%;height:41%;bottom:25%;z-index:1}
.depth-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;z-index:2;filter:drop-shadow(2px 3px 2px #271e1830)}
.contact-shadow{position:absolute;bottom:-3px;left:8%;width:84%;height:17px;border-radius:50%;background:radial-gradient(ellipse,#231b18a6 0%,#231b1866 35%,#231b1800 72%);filter:blur(3px);z-index:1}
.cast-shadow{position:absolute;bottom:-9px;left:20%;width:100%;height:24px;border-radius:50%;background:radial-gradient(ellipse,#2a211b55,#2a211b00 70%);filter:blur(7px);transform:skewX(-35deg);z-index:0}
.reflection-plane{position:absolute;top:calc(100% - 1px);left:0;width:100%;height:clamp(18px,4vw,52px);overflow:hidden;opacity:.13;mask-image:linear-gradient(#0008,transparent);-webkit-mask-image:linear-gradient(#0008,transparent);pointer-events:none;z-index:0}.reflection-image{position:absolute;inset:0;width:100%;height:var(--reflection-source-height,300px);object-fit:contain;object-position:center bottom;transform:scaleY(-1);filter:blur(1px)}
.depth-world .information{margin:0;padding:25px 40px 20px 0;min-height:0;color:#f4ead7;z-index:3}
.depth-world .frame-outline{display:none}
.depth-world .copy{padding:0}
.depth-world .copy h2{font-size:clamp(31px,3.7vw,57px);letter-spacing:-.045em;margin-bottom:12px;overflow-wrap:normal}
.depth-world .description{font-size:16px;color:#e7decf;line-height:1.6;max-width:440px}
.depth-world .summary{margin:27px 0 23px}
.depth-world .eyebrow{color:#d2c7b4;font-size:14px;letter-spacing:.03em}
.depth-world .norms{color:#f1e6d3;font-size:15px;line-height:1.8;max-width:440px}
.depth-world .note{color:#c5c1b7;font-size:14px;max-width:410px}
.depth-world .pill.primary{border-color:#f0e4cd;background:linear-gradient(160deg,#f1e5cd,#e2d2b5);color:#142023;box-shadow:inset 0 1px 0 #fff9ed,0 5px 14px #0003;padding:11px 23px;min-height:48px}
.depth-world .pill.secondary{border:0;border-bottom:1px solid #eee3d57a;border-radius:0;background:none;box-shadow:none;color:#eee2d0;padding:7px 0;min-height:44px}
.depth-world .selector-wrap{margin:0;padding:12px 6%;background:#ece0ca;gap:24px;position:relative;z-index:5;min-height:65px;border-top:1px solid #ffffff80}
.depth-world .categories{gap:44px}
.depth-world .categories button{font-size:16px;color:#535a54;min-height:44px}
.depth-world .categories button[aria-pressed=true]{color:#192527;border-color:var(--gold)}
.depth-world .missing{margin:10px auto 0;min-height:44px}
.depth-world footer{padding:20px 6%;margin:0}
.depth-world .single-object{left:24%;width:53%;height:70%;bottom:14%;object-position:center bottom}
.depth-world .folder-label{left:62%;bottom:34%}
@media(min-width:1700px){.depth-world .explorer,.depth-world .stage{min-height:580px;height:580px}.depth-world .information{padding-right:6vw}}
@media(min-width:761px) and (max-width:1100px){.depth-world .explorer{grid-template-columns:60% 40%;min-height:460px}.depth-world .stage{height:460px}.depth-world .information{padding-right:24px}.depth-world .copy h2{font-size:36px}.depth-world .norms{font-size:14px}.depth-product.pos-0{left:14%;width:27%;height:61%;bottom:17%}.depth-product.pos-1{left:43%;width:27%;height:43%;bottom:21%}.depth-product.pos-2{left:70%;width:23%;height:36%;bottom:28%}}
@media(max-width:760px){
 .depth-world{padding-top:98px;background:#f2e8d8}
 .depth-world #explorador{display:flex;flex-direction:column}
 .depth-world .intro{order:1;margin:8px 0 0;padding:0 14px}
 .depth-world .intro h1{font-size:clamp(35px,8.8vw,58px)}
 .depth-world .intro p{font-size:16px;letter-spacing:.03em;margin:12px 0 15px}
 .depth-world .modes{order:2;position:relative;top:auto;align-self:center;width:auto;margin:0 auto 18px;background:#f1e8d8;box-shadow:none;gap:0;padding:3px}
 .depth-world .modes button{font-size:14px;padding:10px 18px;flex:none}
 .depth-world .explorer{order:3;display:flex;flex-direction:column;min-height:0;background:none;isolation:isolate}
 .depth-world .stage{order:0;width:100%;height:340px;min-height:0;align-self:center;margin:0;overflow:visible}
 .depth-product.pos-0{left:9%;width:28%;height:68%;bottom:17%;z-index:3}
 .depth-product.pos-1{left:39%;width:28%;height:49%;bottom:23%;z-index:2}
 .depth-product.pos-2{left:70%;width:23%;height:40%;bottom:31%;z-index:1}
 .depth-world .single-object{left:17%;width:66%;height:75%;bottom:15%}
 .depth-world .folder-label{left:62%;bottom:34%}
 .depth-world .information{order:1;position:relative;width:100%;padding:10px 7% 30px;min-height:0;background:linear-gradient(170deg,#1e2a2d,#111c1f);margin:0;border-radius:0;color:#f4ead7}
 .depth-world .copy{padding:16px 0 0}
 .depth-world .copy h2{font-size:clamp(32px,8vw,43px);overflow-wrap:anywhere}
 .depth-world .description{font-size:16px;line-height:1.6}
 .depth-world .summary{margin:22px 0}
 .depth-world .norms{font-size:15px}
 .depth-world .actions{display:flex;align-items:stretch;gap:9px}
 .depth-world .pill.secondary{align-self:flex-start;width:auto;padding:8px 0}
 .depth-world .selector-wrap{order:4;margin:0;padding:8px 4%;gap:8px;min-height:65px;width:100%;background:#ece0ca}
 .depth-world .categories{justify-content:center;gap:24px;overflow-x:auto;flex-wrap:nowrap}
 .depth-world .categories button{font-size:14px}
 .depth-world .missing{order:5;color:#263334;min-height:44px}
 .depth-world footer{padding:14px 6% 25px;font-size:12px;flex-wrap:wrap;gap:12px}
 .contact-shadow{height:13px;filter:blur(2px)}
 .cast-shadow{height:18px;filter:blur(5px)}
}
@media(max-width:370px){.depth-world .modes button{padding:10px 14px}.depth-world .stage{height:300px}.depth-world .explorer{background-size:auto 300px}}

/* Full composition: the architectural opening flows behind the heading rather than starting in a rectangle. */
.depth-world .scene-shell{position:relative;isolation:isolate;background:url('assets/depth-environment-v2.webp') center top/100% 100% no-repeat;padding-top:1px}
.depth-world .intro,.depth-world .modes,.depth-world .explorer{position:relative}
.depth-world .modes{background:#f2e8d8d9;backdrop-filter:blur(12px)}
.depth-world .information{padding-left:28px;padding-right:38px;isolation:isolate}
.depth-world .information:before{display:none}
.depth-world .copy h2{font-size:clamp(30px,2.9vw,46px);line-height:1.15;overflow-wrap:anywhere}
.depth-world .description{color:#f4eadb;font-size:17px}
.depth-world .eyebrow{color:#e3d7c4;font-size:15px}
.depth-world .norms{display:flex;gap:8px;flex-wrap:wrap;color:#fff1dc;font-size:15px;line-height:1.65}
.norm-badge{display:inline-block;padding:5px 9px;border:1px solid #f0e0c540;border-radius:5px;background:#111c1fc9;white-space:nowrap}
.depth-world .note{color:#e4dbce;font-size:15px;line-height:1.6}
.depth-world .pill.secondary{color:#f4eadb}
.contact-shadow{left:18%;width:64%;height:12px;bottom:-2px;background:radial-gradient(ellipse,#21181085,#21181040 38%,transparent 72%);filter:blur(2px)}
.cast-shadow{left:28%;width:70%;height:16px;bottom:-4px;background:radial-gradient(ellipse,#30231938,transparent 68%);filter:blur(4px)}
@media(min-width:761px) and (max-width:1100px){.depth-world .information{padding-left:28px;padding-right:26px}.depth-world .copy h2{font-size:31px}.depth-world .description{font-size:16px}.norm-badge{font-size:14px}}
@media(max-width:760px){
 .depth-world .scene-shell{order:3;width:100%;display:flex;flex-direction:column;background-position:left top;background-size:100% 570px;background-repeat:no-repeat;background-color:#152023}
 .depth-world .intro{order:0;margin:0;padding:12px 16px 0;background:#f2e8d8}
 .depth-world .modes{order:1;position:relative;align-self:center;max-width:94%;margin:0 auto 10px;background:#f2e8d8}
 .depth-world .explorer{order:2;display:flex;flex-direction:column;background:none;min-height:0}
 .depth-world .stage{height:320px;order:0}
 .depth-world .information{order:1;padding:22px 7% 32px;background:#152023;border:0;isolation:isolate}
 .depth-world .information:before{display:none}
 .depth-world .copy{padding:0}
 .depth-world .copy h2{font-size:clamp(31px,8vw,43px)}
 .depth-world .description{font-size:17px}
 .depth-world .note{font-size:15px}
 .depth-world .selector-wrap{order:4}
 .depth-world .depth-product.pos-0{height:67%;bottom:17%}
 .depth-world .depth-product.pos-1{height:47%;bottom:22%}
 .depth-world .depth-product.pos-2{height:39%;bottom:29%}
 .reflection-plane{height:26px;opacity:.1}
 .contact-shadow{height:9px}.cast-shadow{height:12px}
 .depth-world .missing{color:#263334}
}

@media(max-width:760px){.depth-world .information{margin-top:-10px;border-top-left-radius:55% 24px;padding-top:28px}.depth-world .depth-product.pos-1{left:36%;width:26%}.depth-world .depth-product.pos-2{left:65%;width:23%}}

/* One continuous dark field follows the opening; no isolated text backdrop. */
.shape-defs{position:absolute;overflow:hidden;pointer-events:none}
.depth-world .explorer{grid-template-columns:62% 38%;align-items:center;min-height:540px}

.depth-world .stage{height:540px}
.depth-world .information{padding:30px clamp(28px,4vw,70px) 32px clamp(45px,5vw,80px);background:none;min-width:0}
.depth-world .information:before{display:none!important}
.depth-world .copy{max-width:440px}
.depth-world .copy h2{font-size:clamp(30px,3.05vw,48px);line-height:1.17;overflow-wrap:normal;letter-spacing:-.04em}
.depth-world .description{font-size:18px;line-height:1.6;color:#f4eadb}
.depth-world .eyebrow{font-size:16px;color:#e9dfd0}
.depth-world .summary{margin:23px 0 24px}
.depth-world .norms{font-size:16px;gap:8px;line-height:1.6;max-width:none}
.depth-world .norm-badge{font-size:15px;border-color:#e9dfd057;background:#ffffff06;padding:6px 10px}
.depth-world .note{font-size:16px;color:#e9dfd0;line-height:1.6}
.depth-world .pill{font-size:17px}
.depth-world .pill.secondary{color:#f4eadb}
@media(min-width:761px) and (max-width:1150px){
 .depth-world .explorer{grid-template-columns:60% 40%;min-height:560px}
 .depth-world .stage{height:560px}
 .depth-world .information{padding-left:clamp(50px,7vw,80px);padding-right:26px}
 .depth-world .copy h2{font-size:31px;overflow-wrap:anywhere}
 .depth-world .description{font-size:17px}
 .depth-world .norm-badge{font-size:15px}
}
@media(max-width:760px){
 .depth-world{padding-top:100px}
 .depth-world .header{left:4%;right:4%;padding:12px 16px;border-radius:21px;gap:12px}
 .depth-world .header .brand span{font-size:22px}.depth-world .header .brand small{font-size:12px}
 .depth-world .menu-toggle{display:flex;align-items:center;gap:12px;border:1px solid #30332c38;background:#ffffff42;border-radius:999px;padding:8px 14px;min-height:44px;font-size:14px}
 .depth-world .header nav{display:none;position:absolute;right:0;top:calc(100% + 9px);width:240px;max-width:80vw;padding:10px;flex-direction:column;border-radius:20px;background:#f7f0e6f5;box-shadow:0 12px 28px #33291d23}
 .depth-world .header.menu-open nav{display:flex}.depth-world .header nav button{display:block;font-size:16px;min-height:48px;text-align:left;padding:10px 15px}
 .depth-world .scene-shell{display:flex;flex-direction:column;background-size:100% 570px;background-position:left top;background-repeat:no-repeat;background-color:#152023}
 .depth-world .intro{order:0;margin:0;padding:12px 16px 0;background:#f2e8d8;text-align:center}
 .depth-world .intro h1{font-size:clamp(35px,8.8vw,58px)}.depth-world .intro p{font-size:17px;letter-spacing:.03em}
 .depth-world .modes{order:1;position:relative;top:auto;align-self:center;width:max-content;max-width:94%;margin:0 auto 10px;padding:3px;gap:0;background:#f2e8d8}
 .depth-world .modes button{font-size:15px;padding:10px 16px;min-height:44px}
 .depth-world .explorer{order:2;display:flex;flex-direction:column;min-height:0;background:none}
 .depth-world .explorer:before{display:none}
 .depth-world .stage{order:0;width:100%;height:330px;margin:0;flex-shrink:0}
 .depth-world .information{order:1;width:100%;margin:-12px 0 0;padding:32px 7% 36px;background:#152023;border-top-left-radius:55% 26px;min-height:0}
 .depth-world .copy{padding:0;max-width:none}
 .depth-world .copy h2{font-size:clamp(32px,8vw,43px);overflow-wrap:anywhere}
 .depth-world .description{font-size:18px;line-height:1.6}
 .depth-world .note,.depth-world .eyebrow{font-size:16px}
 .depth-world .actions{align-items:stretch;gap:12px}.depth-world .pill{min-height:48px}
 .depth-world .pill.secondary{align-self:flex-start;width:auto}
 .depth-world .depth-product.pos-0{left:9%;width:28%;height:67%;bottom:17%}
 .depth-world .depth-product.pos-1{left:36%;width:26%;height:47%;bottom:22%}
 .depth-world .depth-product.pos-2{left:65%;width:23%;height:39%;bottom:29%}
 .depth-world .selector-wrap{padding:10px 4%;gap:8px;width:100%;min-width:0}
 .depth-world .categories{flex:1;gap:24px;overflow:auto;flex-wrap:nowrap;justify-content:center}
 .depth-world .categories button{font-size:15px;white-space:nowrap;min-height:44px;flex-shrink:0}
 .depth-world .step{width:36px;height:44px;flex-shrink:0}
 .depth-world .missing{font-size:15px;min-height:44px}
 .depth-world .single-object{left:17%;width:66%;height:75%;bottom:15%}
 .depth-world .folder-label{left:62%;bottom:34%}
 .reflection-plane{height:26px;opacity:.1}
}

@media(min-width:761px) and (pointer:fine){.depth-world .information{container-type:inline-size}.depth-world .copy h2{font-size:clamp(28px,11cqw,48px)}}

/* Keep the essentials and the whole product scene together in the phone viewport. */
@media(max-width:760px){
 .depth-world{--stage-height:clamp(170px,25svh,215px);padding-top:86px}
 .depth-world .header{padding:9px 14px;top:max(9px,env(safe-area-inset-top))}
 .depth-world .header .brand span{font-size:21px}.depth-world .header .brand small{font-size:11px}
 .depth-world .scene-shell{background-size:100% calc(var(--stage-height) + 156px)}
 .depth-world .intro{padding:4px 16px 0}
 .depth-world .intro h1{font-size:clamp(32px,8vw,42px);line-height:1.1}
 .depth-world .intro p{font-size:16px;margin:7px 0 10px;line-height:1.3}
 .depth-world .modes{margin:0 auto 3px;padding:2px}
 .depth-world .modes button{padding:8px 14px;min-height:42px;font-size:14px}
 .depth-world .stage{height:var(--stage-height)}
 .depth-world .depth-product.pos-0{left:8%;width:27%;height:72%;bottom:16%;z-index:3}
 .depth-world .depth-product.pos-1{left:32%;width:27%;height:49%;bottom:22%;z-index:2}
 .depth-world .depth-product.pos-2{left:43%;width:22%;height:37%;bottom:31%;z-index:1}
 .depth-world .reflection-plane{height:18px;opacity:.1}
 .depth-world .information{margin-top:-6px;padding:18px 6% 17px;border-top-left-radius:55% 16px}
 .depth-world .copy h2{font-size:clamp(28px,7.5vw,35px);line-height:1.15;margin:0 0 7px}
 .depth-world .description{font-size:16px;line-height:1.4;margin:0}
 .depth-world .summary{margin:12px 0 13px}
 .depth-world .eyebrow{font-size:14px}
 .depth-world .norms{margin:6px 0;gap:6px;font-size:14px;line-height:1.4}
 .depth-world .norm-badge{font-size:14px;padding:5px 8px}
 .depth-world .note{font-size:14px;line-height:1.4;margin:5px 0}
 .depth-world .actions{gap:5px}
 .depth-world .pill{font-size:16px;min-height:44px;padding:9px 16px}
 .depth-world .pill.secondary{min-height:44px;padding:6px 0}
 .depth-world .selector-wrap{padding:4px 4%;min-height:52px}
 .depth-world .categories{padding:0;gap:20px}
 .depth-world .categories button{font-size:14px;min-height:44px;padding:8px 0}
 .depth-world .missing{margin:2px auto 0}
 .depth-world .single-object{left:15%;width:61%;height:72%;bottom:17%}
}
@media(max-width:760px) and (max-height:700px){
 .depth-world{--stage-height:clamp(140px,24svh,168px);padding-top:80px}
 .depth-world .intro p{display:none}
 .depth-world .intro h1{font-size:32px;margin:0 0 10px}
 .depth-world .scene-shell{background-size:100% calc(var(--stage-height) + 115px)}
 .depth-world .description,.depth-world .note,.depth-world .pill.secondary{display:none}
 .depth-world .information{padding-top:15px;padding-bottom:15px}
 .depth-world .copy h2{font-size:28px}
 .depth-world .summary{margin:10px 0 12px}
}
@media(max-width:760px){
 .depth-world .depth-product.pos-2{height:28%}
 .depth-world .depth-product.pos-2 .contact-shadow{left:28%;width:44%;height:8px}
 .depth-world .depth-product.pos-2 .cast-shadow{left:35%;width:46%;height:10px}
}

/* Separate physical depth from a steep progression of object sizes. */
@media(min-width:761px){
 .depth-world{--stage-height:clamp(420px,calc(100svh - 340px),650px);padding-top:96px}
 .depth-world .scene-shell{display:block;background-size:100% 100%;background-color:transparent}
 .depth-world .intro{margin:4px auto 0;padding:0 24px;background:none}
 .depth-world .intro h1{font-size:clamp(58px,6.4vw,96px)}
 .depth-world .intro p{font-size:19px;margin:10px 0 13px;letter-spacing:.07em}
 .depth-world .modes{position:relative;top:auto;margin:14px auto 12px;align-self:auto}
 .depth-world .explorer{display:grid;grid-template-columns:62% 38%;align-items:center;min-height:var(--stage-height)}
 .depth-world .stage{width:100%;height:var(--stage-height);margin:0}
 .depth-world .information{width:auto;min-width:0;margin:0;padding:24px 4vw 28px 5vw;background:none;border-radius:0}
 .depth-world .copy{max-width:440px}
 .depth-world .copy h2{font-size:clamp(30px,3vw,48px)}
 .depth-world .actions{align-items:flex-start}
 .depth-world .pill{width:auto}
 .depth-world .depth-product.pos-0{left:9%;width:28%;height:76%;bottom:12%}
 .depth-world .depth-product.pos-1{left:40%;width:27%;height:55%;bottom:16%}
 .depth-world .depth-product.pos-2{left:71%;width:24%;height:44%;bottom:18%}
 .depth-world .depth-product.pos-2 .contact-shadow{left:18%;width:64%;height:12px}
 .depth-world .depth-product.pos-2 .cast-shadow{left:28%;width:70%;height:16px}
 .depth-world .selector-wrap{margin:0;padding:8px 6%;min-height:58px}
 .depth-world .header .menu-toggle{display:none}
 .depth-world .header nav{display:flex;position:static;flex-direction:row;background:none;box-shadow:none;width:auto;padding:0}
 .depth-world footer{padding:12px 6% 18px}
}
@media(min-width:761px) and (max-width:1100px){
 .depth-world .explorer{grid-template-columns:60% 40%}
 .depth-world .information{padding-left:7vw;padding-right:3vw}
 .depth-world .copy h2{font-size:30px}
 .depth-world .intro h1{font-size:clamp(52px,6.4vw,72px)}
 .depth-world .depth-product.pos-0{left:7%;width:28%;height:71%;bottom:12%}
 .depth-world .depth-product.pos-1{left:38%;width:27%;height:52%;bottom:16%}
 .depth-world .depth-product.pos-2{left:69%;width:25%;height:43%;bottom:18%}
}
@media(max-width:760px){
 .depth-world{--stage-height:clamp(190px,27svh,235px)}
 .depth-world .scene-shell{background-size:150% calc(var(--stage-height) + 156px);background-position:left top}
 .depth-world .depth-product.pos-0{left:7%;width:25%;height:75%;bottom:16%}
 .depth-world .depth-product.pos-1{left:37%;width:25%;height:56%;bottom:18%}
 .depth-world .depth-product.pos-2{left:69%;width:23%;height:51%;bottom:22%}
 .depth-world .depth-product.pos-2 .contact-shadow{left:18%;width:64%;height:10px}
 .depth-world .depth-product.pos-2 .cast-shadow{left:28%;width:70%;height:12px}
}
@media(max-width:760px) and (max-height:700px){
 .depth-world{--stage-height:clamp(150px,25svh,175px)}
 .depth-world .scene-shell{background-size:150% calc(var(--stage-height) + 115px)}
}
@media(min-width:761px){
 .depth-world .depth-product.pos-2{height:56%;bottom:8%;z-index:3}
 .depth-world .depth-product.pos-2 .reflection-plane{height:28px}
 .depth-world .depth-product.pos-1{z-index:1;bottom:20%}
 .depth-world .depth-product.pos-0{z-index:2}
}

/* Approved white junction: the background itself carries the continuous shape. */
.depth-world .scene-shell{background-image:url('assets/depth-environment-v3.webp')}
.depth-world .explorer:before{display:none}
.depth-world .copy{clip-path:none;will-change:clip-path}
.depth-world .copy h2,.depth-world .copy .description,.depth-world .copy .summary,.depth-world .copy .actions{transform-origin:left center}
@media(min-width:761px){
 .depth-world .information{padding-top:36px;padding-bottom:28px}
 .depth-world .norm-badge{background:#15202380}
 .depth-world .scene-shell{background-size:100% 100%}
}
@media(max-width:760px){
 .depth-world .scene-shell{background-color:#152023}
 .depth-world .stage{touch-action:pan-y}
 .depth-world .information{background:#152023}
}
@media(prefers-reduced-motion:reduce){.depth-world .copy{will-change:auto}}

/* Large folders and physical labels remain inside the illuminated opening. */
.depth-world .single-object{left:9%;width:80%;height:88%;bottom:9%}
.depth-world .folder-label{left:67%;bottom:40%;font-size:14px}
.depth-world .categories{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;min-width:0;max-width:100%;justify-content:flex-start;gap:clamp(18px,2.5vw,40px)}
.depth-world .categories::-webkit-scrollbar{display:none}
.depth-world .categories button{flex-shrink:0;white-space:nowrap}
@media(max-width:760px){
 .depth-world .single-object{left:6%;width:88%;height:92%;bottom:10%}
 .depth-world .folder-label{left:70%;bottom:42%;font-size:12px}
 .depth-world .categories{justify-content:flex-start;gap:22px}
}
/* Keep the broad tools proportional rather than forcing appliance silhouettes. */
@media(min-width:761px){
 .depth-world .layer[data-group="Herramientas"] .pos-0{height:69%}
 .depth-world .layer[data-group="Herramientas"] .pos-2{height:50%;bottom:10%}
 .depth-world .layer[data-group="Telecomunicaciones"] .pos-1{height:61%}
 .depth-world .layer[data-group="Eléctricos diversos"] .pos-2{height:44%;bottom:14%}
}

/* Viewport budget includes heading, modes and category navigation. */
@media(min-width:761px){
 .depth-world{padding-top:106px;--stage-height:clamp(300px,calc(100svh - 450px),540px)}
 .depth-world .intro h1{font-size:clamp(52px,5.2vw,78px);line-height:1.04;margin:0}
 .depth-world .intro p{margin:8px 0;font-size:17px}
 .depth-world .modes{margin:10px auto 8px}
 .depth-world .explorer{min-height:var(--stage-height);height:auto}
 .depth-world .stage{height:var(--stage-height);min-height:0}
 .depth-world .information{padding-top:20px;padding-bottom:20px}
 .depth-world .selector-wrap{min-height:54px;padding-top:4px;padding-bottom:4px}
 .depth-world .missing{margin:8px auto 12px}
}
.about-section{display:grid;grid-template-columns:1.05fr 1fr;gap:9%;padding:80px 8%;scroll-margin-top:100px;background:#e9ddc9;color:#152023;border-top:1px solid #aa8b5240}
.about-eyebrow{font-size:12px;letter-spacing:.12em;color:#75603f}
.about-lead h2{font:400 clamp(38px,4vw,64px)/1.08 Georgia,serif;letter-spacing:-.035em;margin:24px 0}
.about-lead h2 em{font-weight:400;color:#746044}
.about-lead p{font-size:18px;line-height:1.65;max-width:520px;margin:0 0 26px}
.about-lead .pill.primary{background:#152023;color:#f2e8d8;min-height:48px;gap:30px;padding:14px 24px}
.about-work{display:grid;align-content:center}
.about-role{padding:22px 26px;border-bottom:1px solid #aa8b5250}
.about-role span{font-size:11px;letter-spacing:.14em;color:#75603f}
.about-role h3{font:400 28px/1.15 Georgia,serif;margin:10px 0}
.about-role p{font-size:16px;line-height:1.6;margin:0;max-width:500px}
.about-role-focus{background:#152023;color:#f2e8d8;border-radius:18px;margin:12px 0;border:none;box-shadow:0 12px 30px #15202312}
.about-role-focus span{color:#c5a46e}
@media(max-width:760px){.about-section{grid-template-columns:1fr;gap:22px;padding:42px 6%}.about-lead h2{font-size:38px;margin:18px 0}.about-lead p{font-size:16px}.about-role{padding:20px}.about-role h3{font-size:25px}}

@media(min-width:761px) and (max-height:800px){
 .depth-world .intro h1{font-size:58px}
 .depth-world .intro p{margin:5px 0}
 .depth-world .modes{margin:6px auto}
 .depth-world .information{padding-top:12px;padding-bottom:12px}
 .depth-world .copy h2{font-size:32px}
 .depth-world .summary{margin:14px 0}
 .depth-world .actions{gap:6px}
}

/* Light follows interaction rather than looping across the entire page. */
.depth-world .pill.primary,.road-continue{position:relative;isolation:isolate;overflow:hidden;transition:box-shadow .3s,transform .3s,border-color .3s}
.depth-world .pill.primary::before,.road-continue::before{content:'';position:absolute;inset:-60% -40%;z-index:-1;pointer-events:none;background:linear-gradient(105deg,transparent 42%,#fff5dd70 50%,transparent 58%);transform:translateX(-85%) rotate(8deg);transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.depth-world .pill.primary:hover::before,.depth-world .pill.primary:focus-visible::before,.road-continue:hover:not(:disabled)::before,.road-continue:focus-visible::before{transform:translateX(85%) rotate(8deg)}
.depth-world .pill.primary:hover,.depth-world .pill.primary:focus-visible,.road-continue:hover:not(:disabled),.road-continue:focus-visible{border-color:#dec58c;box-shadow:0 0 0 1px #dec58c70,0 0 18px #c5a46e45,inset 0 0 10px #f4e4bc20;transform:translateY(-2px)}
.depth-world .pill.primary:active,.road-continue:active:not(:disabled){transform:translateY(0) scale(.98)}
.depth-world .pill span:last-child{transition:transform .3s}
.depth-world .pill:hover span:last-child,.depth-world .pill:focus-visible span:last-child{transform:translateX(3px)}
.depth-world .step{transition:background .25s,box-shadow .25s,transform .25s}
.depth-world .step:hover,.depth-world .step:focus-visible{background:#ffffff60;box-shadow:0 0 14px #aa8b5235;transform:scale(1.08)}
.depth-world .categories button{transition:color .25s,text-shadow .25s}
.depth-world .categories button:hover,.depth-world .categories button:focus-visible{text-shadow:0 0 12px #aa8b5260;color:#152023}
.about-role{transition:transform .3s,border-color .3s}
@media(hover:hover){.about-role:hover{transform:translateX(5px);border-color:#aa8b52}}
@media(prefers-reduced-motion:reduce){.depth-world .pill.primary,.road-continue,.depth-world .pill span:last-child,.depth-world .step,.depth-world .categories button,.about-role{transition:none;transform:none!important}.depth-world .pill.primary::before,.road-continue::before{display:none}}

/* Keep the original short copy contained in the approved composition. */
.depth-world .copy{min-width:0;max-width:100%;box-sizing:border-box}
.depth-world .description{text-align:justify;text-justify:inter-word;hyphens:auto;overflow-wrap:break-word}
.depth-world .copy h2{max-width:100%;overflow-wrap:break-word;hyphens:auto}
.depth-world .norms{flex-wrap:wrap;max-width:100%}
.depth-world .norm-badge{max-width:100%;white-space:normal;overflow-wrap:anywhere}
.depth-world .actions .pill{max-width:100%;box-sizing:border-box;white-space:normal}
@media(min-width:761px){.depth-world .explorer{height:auto;align-items:center}.depth-world .information{min-width:0;height:auto;padding-top:64px;padding-bottom:28px}.depth-world .copy h2{font-size:clamp(28px,2.8vw,44px)}}
@media(max-width:760px){.depth-world .information{box-sizing:border-box;height:auto;min-width:0}.depth-world .copy h2{font-size:clamp(28px,7.5vw,35px)}}

.legal-links{display:flex;flex-wrap:wrap;gap:18px}.legal-links a{text-underline-offset:4px}

.contact-section{display:grid;grid-template-columns:1fr 1.2fr;gap:60px;padding:80px 6% 100px;background:#f2e8d8;color:#152023;scroll-margin-top:110px}
.contact-eyebrow{font-size:12px;letter-spacing:.17em;text-transform:uppercase;color:#806735}.contact-lead h2{font-family:Georgia,serif;font-size:clamp(34px,4vw,56px);line-height:1.1;font-weight:400;margin:18px 0}.contact-lead p{font-size:17px;line-height:1.6;max-width:440px}
.contact-channels{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;min-width:0}.contact-channel{position:relative;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:26px 24px 26px 0;border-bottom:1px solid #aa8b5250;text-decoration:none;min-width:0}.contact-channel>span:first-child{font-size:13px;color:#58605f}.contact-channel strong{font-size:17px;line-height:1.5;overflow-wrap:anywhere;font-weight:400}.contact-arrow{position:absolute;right:0;top:32px;color:#806735;transition:transform .25s}.contact-channel:hover .contact-arrow{transform:translate(3px,-3px)}
.whatsapp-fixed{position:fixed;left:max(20px,env(safe-area-inset-left));bottom:max(20px,env(safe-area-inset-bottom));z-index:500;display:flex;align-items:center;gap:20px;padding:15px 22px;min-height:50px;border-radius:999px;background:#152023;color:#f2e8d8;border:1px solid #aa8b52;box-shadow:0 6px 25px #15202330;text-decoration:none;font-size:15px;line-height:1.2;transition:box-shadow .25s,transform .25s}.whatsapp-fixed:hover{box-shadow:0 6px 28px #15202350;transform:translateY(-2px)}.whatsapp-fixed:focus-visible{outline:2px solid #aa8b52;outline-offset:5px}.depth-world footer{padding-bottom:100px}
@media(max-width:760px){.contact-section{grid-template-columns:1fr;gap:20px;padding:52px 6% 80px}.contact-channels{grid-template-columns:1fr}.contact-channel{padding-top:20px;padding-bottom:20px}.whatsapp-fixed{left:14px;bottom:max(14px,env(safe-area-inset-bottom));padding:13px 18px;font-size:14px;min-height:48px}.header nav{gap:12px}}
@media(prefers-reduced-motion:reduce){.whatsapp-fixed,.contact-arrow{transition:none;transform:none}}

@property --edge-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
.whatsapp-fixed::before{content:'';position:absolute;inset:-1px;padding:1.5px;border-radius:inherit;background:conic-gradient(from var(--edge-angle),transparent 0deg,#aa8b5240 230deg,#e4c583 290deg,#fff4cf 315deg,transparent 350deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none;animation:contact-edge 6s linear infinite}
@keyframes contact-edge{to{--edge-angle:360deg}}
.cookie-notice{position:fixed;right:20px;bottom:20px;z-index:510;width:min(430px,calc(100vw - 40px));padding:22px 24px;background:#f8f2e7;color:#152023;border:1px solid #aa8b5260;border-radius:20px;box-shadow:0 12px 40px #15202325}
.cookie-notice[hidden]{display:none}.cookie-notice h2{font-family:Georgia,serif;font-size:23px;font-weight:400;line-height:1.2;margin:0 0 10px}.cookie-notice p{font-size:14px;line-height:1.5;margin:0 0 16px}.cookie-notice>div{display:flex;align-items:center;justify-content:space-between;gap:16px}.cookie-notice a{font-size:14px;text-underline-offset:4px}.cookie-notice button{border:1px solid #aa8b52;border-radius:999px;padding:10px 18px;background:#152023;color:#f2e8d8;min-height:44px}.legal-links button{border:0;background:none;padding:0;text-decoration:underline;font-size:inherit;min-height:32px;text-underline-offset:4px}
@media(max-width:760px){.cookie-notice{left:14px;right:14px;bottom:78px;width:auto;max-height:calc(100svh - 160px);overflow:auto;padding:18px 20px}.cookie-notice h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){.whatsapp-fixed::before{animation:none;--edge-angle:35deg}}

/* Social links expand as in the selected reference, within the brand palette. */
.social-links{grid-column:1/-1;display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:26px 0}.social-pill{display:flex;align-items:center;gap:0;flex:0 0 auto;width:56px;height:56px;padding:0 16px;overflow:hidden;border-radius:999px;border:1px solid #aa8b5260;background:#152023;color:#f2e8d8;box-shadow:inset 0 1px 0 #ffffff15;text-decoration:none;transition:width .45s cubic-bezier(.2,.8,.2,1),gap .35s,transform .35s,box-shadow .35s,background .35s}.social-symbol{flex:0 0 24px;width:24px;text-align:center;line-height:1;font-family:Arial,sans-serif}.social-facebook{font-weight:700;font-size:29px}.social-linkedin{font-weight:700;font-size:21px}.social-name{white-space:nowrap;opacity:0;transform:translateX(8px);font-size:15px;transition:opacity .25s,transform .35s}.social-pill:hover,.social-pill:focus-visible{width:158px;gap:13px;background:linear-gradient(115deg,#152023,#30434b);box-shadow:0 5px 18px #15202320,inset 0 0 0 1px #d0b47b50;transform:translateY(-3px)}.social-pill:hover .social-name,.social-pill:focus-visible .social-name{opacity:1;transform:none}.social-pill:focus-visible{outline:2px solid #aa8b52;outline-offset:5px}
.whatsapp-fixed{--magnet-x:0px;--magnet-y:0px;transform:translate(var(--magnet-x),var(--magnet-y));transition:transform .18s ease-out,box-shadow .25s;background:linear-gradient(115deg,#101c20,#24373e)}.whatsapp-fixed:hover{transform:translate(var(--magnet-x),var(--magnet-y));box-shadow:0 7px 28px #15202345}.whatsapp-fixed::before{padding:1.5px;background:conic-gradient(from var(--edge-angle),#aa8b5225 0deg,#6f889340 100deg,#f4ead7 145deg,#c5a46e 175deg,#aa8b5225 205deg,#fff1cf 310deg,#aa8b5225 350deg);animation-duration:5s}.whatsapp-fixed>span:first-child{transform:translate(calc(var(--magnet-x)*.15),calc(var(--magnet-y)*.15));transition:transform .18s}
@media(hover:none),(pointer:coarse){.social-pill{width:158px;gap:13px}.social-name{opacity:1;transform:none}.social-pill:active{background:#30434b;transform:scale(.97)}}
@media(prefers-reduced-motion:reduce){.social-pill,.social-name,.whatsapp-fixed,.whatsapp-fixed>span:first-child{transition:none;transform:none}.whatsapp-fixed::before{animation:none}}

/* Brand color improves recognition; touch expansion is driven by an explicit tap. */
.contact-channels{display:block}.social-links{gap:12px;padding:20px 0;max-width:100%;min-height:100px;align-content:center}.social-pill{--channel-color:#152023;--open-width:170px;width:56px;max-width:100%;gap:0;background:#fffaf3;color:var(--channel-color);border-color:#c7bfae;box-shadow:0 3px 12px #15202312}.social-pill:hover{width:56px;gap:0;background:#fffaf3;color:var(--channel-color);transform:none}.social-pill .social-name,.social-pill:hover .social-name{opacity:0;transform:translateX(8px);font-size:14px}.social-pill .social-symbol{flex:0 0 24px;display:flex;align-items:center;justify-content:center}.channel-whatsapp{--channel-color:#128c7e;--open-width:204px}.channel-facebook{--channel-color:#1877f2}.channel-linkedin{--channel-color:#0a66c2}.channel-gmail{--channel-color:#b3261e;--open-width:340px}
.social-pill.is-open,.social-pill:focus-visible{width:var(--open-width);gap:12px;background:var(--channel-color);color:white;border-color:var(--channel-color);box-shadow:0 6px 18px #15202322}.social-pill.is-open .social-name,.social-pill:focus-visible .social-name{opacity:1;transform:none}.channel-gmail.is-open,.channel-gmail:focus-visible{background:#fffaf7;color:#152023;border-color:#ea4335}.channel-gmail .social-name{font-size:13px;white-space:normal;overflow-wrap:anywhere;line-height:1.3}.contact-tap-hint{font-size:13px;color:#58605f;margin:4px 0;line-height:1.5}.whatsapp-fixed{background:linear-gradient(115deg,#18b967,#25d366);color:#082a1d;border-color:#a9efc9;box-shadow:0 6px 24px #083b2940;gap:12px}.whatsapp-fixed:hover{box-shadow:0 8px 28px #083b2955}.whatsapp-fixed::before{background:conic-gradient(from var(--edge-angle),#ffffff15 0deg,#91efba60 110deg,#fff 145deg,#c9ffe0 175deg,#ffffff15 205deg,#fff 310deg,#ffffff15 350deg)}.fixed-wa-symbol{display:flex;align-items:center}.whatsapp-fixed>span:last-child{margin-left:5px}
@media(hover:hover) and (pointer:fine){.social-pill:hover{width:var(--open-width);gap:12px;background:var(--channel-color);color:#fff;transform:translateY(-3px)}.social-pill:hover .social-name{opacity:1;transform:none}.channel-gmail:hover{background:#fffaf7;color:#152023;border-color:#ea4335}.contact-tap-hint{display:none}}
@media(hover:none),(pointer:coarse){.social-pill:not(.is-open){width:56px;gap:0}.social-pill:not(.is-open) .social-name{opacity:0;transform:translateX(8px)}.social-pill.is-open{width:var(--open-width);gap:12px}.social-pill.is-open .social-name{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.social-pill,.social-name{transition:none}.social-pill:hover{transform:none}}