#cv{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:40}
.hero{position:relative;height:100svh;min-height:680px;overflow:hidden}
.dibujo{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.texto{position:absolute;left:5.5%;top:22%;z-index:2;max-width:660px}
h1{font-family:YoungSerif;font-weight:400;font-size:clamp(40px,5vw,88px);line-height:1.12;letter-spacing:-.02em}
h1 .l{display:block}
.medida{position:relative;white-space:nowrap;display:inline-block}
.medida svg.cinta{position:absolute;left:-2%;top:80%;width:104%;height:.36em;overflow:visible;clip-path:inset(-20% 100% -20% 0)}
.apoyo{margin-top:46px;display:flex;align-items:center;gap:40px;flex-wrap:wrap}
.apoyo p{font-size:clamp(19px,1.5vw,23px);line-height:1.32;max-width:23ch}
.circulo{position:relative;font-weight:750;font-size:clamp(18px,1.35vw,21px);padding:8px 4px;isolation:isolate}
.circulo svg{position:absolute;inset:-34% -16%;width:132%;height:168%;overflow:visible;pointer-events:none}
.circulo path{fill:none;stroke:var(--grafito);stroke-width:1.5;stroke-linecap:round;stroke-dasharray:900;stroke-dashoffset:900}
.enlace{font-weight:750;font-size:clamp(17px,1.25vw,20px);border-bottom:1.5px solid var(--grafito);padding-bottom:2px}
svg .t{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.lapiz .t{stroke:var(--lapiz);stroke-width:1.1}
.lapiz .t.acento{stroke:var(--grafito)}
.limpio .t{stroke:var(--grafito);stroke-width:1.6}
.limpio .t.fino{stroke-width:1;stroke:#5F6369}
.limpio .t.acento{stroke:#D9A21B;stroke-width:2.2}
.limpio .t.grueso{stroke-width:3.5}
svg .tx{opacity:0}
.lapiz .tx{font-family:Reenie;fill:var(--lapiz)}
.limpio .tx{fill:var(--grafito);font-family:SofiaSans;font-weight:520}
.limpio .tx.mono{fill:#5F6369;font-variant-numeric:tabular-nums}
.limpio .tx.sans{font-weight:760}
.limpio .tx.grande{font-family:YoungSerif;font-weight:400}
#d-tv .limpio .tx.grande{font-size:74px}
svg .fl{opacity:0}
.lapiz .fl{fill:var(--lapiz)}
.limpio .fl{fill:var(--grafito)}
.limpio .fl.led,.limpio .fl.acento-f{fill:var(--cinta)}
.notas text,.nota-svg{font-family:Reenie;fill:var(--grafito)}
.notas .t{stroke:var(--grafito);stroke-width:1.4}
.disp{cursor:pointer}
.mesa-linea{fill:none;stroke:var(--lapiz);stroke-width:1.2;stroke-linecap:round;vector-effect:non-scaling-stroke}
.mov line,.mov path{stroke:var(--grafito);stroke-width:1.3;fill:none;stroke-linecap:round;vector-effect:non-scaling-stroke}
.sec{position:relative;padding:150px 6% 130px}
.sec h2{position:relative;font-family:YoungSerif;font-weight:400;font-size:clamp(38px,4.4vw,74px);line-height:1.08;letter-spacing:-.02em;max-width:16ch;padding-bottom:44px}
.sec .sub{font-size:clamp(18px,1.45vw,22px);line-height:1.45;max-width:44ch;margin-top:8px}
.nota{font-family:Reenie;font-size:28px;line-height:1;display:inline-block}
.dib{display:block;width:100%;height:auto;overflow:visible;cursor:pointer}
.mesa{position:relative;margin-top:60px;display:flex;flex-wrap:wrap;align-items:flex-start;gap:60px 70px}
.obj{position:relative;transform:rotate(var(--r,0deg))}
.obj.tv{width:min(420px,100%)}.obj.lap{width:min(380px,100%)}.obj.web{width:min(400px,100%)}.obj.tel{width:min(170px,100%)}
.obj:nth-child(2n){margin-top:70px}.obj:nth-child(3n){margin-top:20px}
.obj h3{font-family:YoungSerif;font-weight:400;font-size:clamp(26px,2.2vw,34px);margin-top:14px}
.obj .nota{color:#5F6369;margin-top:2px}
.obj p{font-size:16px;line-height:1.45;margin-top:8px;max-width:34ch}
.fases-svg{margin-top:50px}
.fases{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px;margin-top:6px}
.fase b{font-family:YoungSerif;font-weight:400;font-size:26px;display:block}
.fase .nota{color:#5F6369}
.fase p{font-size:16px;line-height:1.45;margin-top:8px}
.posit{display:inline-block;margin-top:34px;padding:22px 26px;background:var(--cinta);transform:rotate(-2deg);box-shadow:0 1px 2px rgba(35,36,39,.2),0 12px 22px rgba(35,36,39,.14)}
.posit span{display:block;font-family:Reenie;font-size:30px;line-height:1.05}
.medida{cursor:pointer}
.destacados{margin-top:60px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px}
.destacados .obj{width:auto}
.destacados .obj h3{font-size:clamp(30px,2.6vw,40px)}
.mesa .obj.tv{width:min(330px,100%)}.mesa .obj.web{width:min(320px,100%)}.mesa .obj.tel{width:min(140px,100%)}
.obj{--app:#D9A21B}
.obj .limpio .t.acento{stroke:var(--app)}
.obj .limpio .fl.acento-f,.obj .limpio .fl.led{fill:var(--app)}
.obj .limpio .tx.acento-tx{fill:var(--app)}
.obj .ver-prod{display:inline-block;margin-top:12px;font-weight:750;font-size:15px;border-bottom:1.5px solid var(--grafito)}
.obj .ir-prod{display:block}
.obj .nota{font-family:SofiaSans;font-style:italic;font-size:16px;color:var(--app);filter:brightness(.8)}
.clientes{margin-top:60px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px}
.cliente h3{font-family:YoungSerif;font-weight:400;font-size:clamp(24px,2.1vw,32px);margin-top:16px}
.cliente .rubro{font-style:italic;font-size:17px;margin-top:4px;color:#4A4D52}
.cliente a{display:inline-block;margin-top:10px;font-weight:700;font-size:15px;border-bottom:1.5px solid var(--grafito)}
.cliente .dib{max-width:260px}
.contacto-sec .cajas{margin-top:50px;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:70px;align-items:start}
.formulario{position:relative;display:flex;flex-direction:column;gap:20px;padding:34px;background:#F7F6F1;border:1.5px solid var(--grafito);box-shadow:0 2px 3px rgba(35,36,39,.12),0 18px 34px rgba(35,36,39,.12)}
.campo{display:flex;flex-direction:column;gap:7px}
.campo label{font-weight:700;font-size:15.5px}
.campo input,.campo select,.campo textarea{font:400 16px SofiaSans;color:var(--grafito);background:var(--hoja);border:1.5px solid var(--grafito);padding:12px 14px;border-radius:0;outline:none}
.campo textarea{min-height:110px;resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{box-shadow:0 0 0 3px rgba(242,194,48,.7)}
.correo{display:flex;align-items:center;gap:8px}.correo input{flex:1;min-width:0}.correo span{font-weight:700}
.campo .tira{height:10px;background:var(--cinta) repeating-linear-gradient(90deg,var(--grafito) 0 1px,transparent 1px 8px);background-size:100% 4px;background-repeat:repeat-x;border:1px solid var(--grafito);transform-origin:center}
.aviso-form{font-size:15px;color:#5F6369;min-height:1.2em}
.medir{position:relative;display:inline-block}
.medir svg.cinta{position:absolute;left:-1%;top:84%;width:102%;height:.34em;overflow:visible;clip-path:inset(-20% 100% -20% 0)}
#a-medida .sub{margin-top:10px}
.titulo-medida{max-width:19ch!important}
#a-medida .enlace{display:inline-block;margin-top:22px}
.vias{display:flex;flex-wrap:wrap;gap:18px;margin-top:28px}
.via{position:relative;display:flex;align-items:center;gap:14px;padding:16px 20px 16px 16px;background:#F7F6F1;border:1.5px solid var(--grafito);box-shadow:0 1px 2px rgba(35,36,39,.14),4px 8px 16px rgba(35,36,39,.12);transition:transform .3s var(--ease),box-shadow .3s var(--ease);min-width:230px}
.via:hover{transform:translate(-2px,-3px);box-shadow:0 1px 2px rgba(35,36,39,.14),6px 12px 22px rgba(35,36,39,.16)}
.via::before{content:"";position:absolute;left:18px;top:-9px;width:54px;height:16px;background:rgba(242,194,48,.85);border:1px solid rgba(35,36,39,.35);transform:rotate(-4deg)}
.via svg{width:38px;height:38px;flex:none}
.via b{display:block;font-weight:780;font-size:17px}
.via small{display:block;font-size:14.5px;color:#4A4D52;margin-top:2px}
.via .ir{margin-left:auto;font-weight:780;font-size:14px;border-bottom:1.5px solid var(--grafito);white-space:nowrap}
.formulario{max-width:520px}
.correo input{max-width:240px}
.enviar{position:relative;align-self:flex-start;font:780 17px SofiaSans;color:var(--grafito);background-color:var(--cinta);background-image:repeating-linear-gradient(90deg,var(--grafito) 0 1px,transparent 1px 8px);background-size:100% 6px;background-repeat:repeat-x;border:1.5px solid var(--grafito);padding:17px 44px 14px 24px;cursor:pointer;clip-path:polygon(0 0,100% 0,95% 20%,100% 40%,95% 60%,100% 80%,95% 100%,0 100%);transition:padding .3s var(--ease),transform .3s var(--ease)}
.enviar:hover{padding-right:62px}
.enviar:disabled{opacity:.6;cursor:wait}
.tira-v{position:fixed;height:12px;background-color:var(--cinta);background-image:repeating-linear-gradient(90deg,var(--grafito) 0 1px,transparent 1px 8px);background-size:100% 5px;background-repeat:repeat-x;border:1.5px solid var(--grafito);z-index:45;pointer-events:none;transform-origin:center}
@media (max-width:900px){
  .destacados,.clientes{grid-template-columns:1fr}
  .via{min-width:0;width:100%}
  .contacto-sec .cajas>*,.escena,.cliente,.obj{min-width:0}
  .formulario{padding:22px 18px}
  .correo select{max-width:46%}
  .hero{height:auto;min-height:0;display:flex;flex-direction:column;padding:36px 22px 30px 36px}
  .texto{position:static;max-width:none}
  .dibujo{position:static;height:auto;aspect-ratio:780/830;margin-top:26px;order:2}
  .sec{padding:100px 30px 90px 36px}
  .escenas,.contacto-sec .cajas{grid-template-columns:1fr;gap:50px}
  .fases{grid-template-columns:1fr 1fr}
  .obj:nth-child(n){margin-top:0}
}
