/* 22-inch touch kiosk. Layout follows the viewport, not a device model. */
:root{--bg:#f5f4ef;--ink:#272822;--muted:#5e6258;--line:#dedfd5;--brand:#be2019;--accent:#be2019}
.topbar{height:88px;background:#fff;color:var(--ink);padding:0 3.5%;border-bottom:1px solid var(--line);gap:20px}.logo{width:64px;height:64px}.topbar .claim{font-size:22px;font-weight:650}.btn-home{min-height:60px;border:1px solid #d3d6cb;border-radius:12px;padding:12px 26px;font-size:22px;background:#f5f6f0}.btn-home:active{background:#e4e8dc}
main{height:calc(100% - 88px)}.wrap{max-width:1600px;padding:30px 40px 140px}.kiosk-home{max-width:1800px;height:auto;min-height:100%;padding:24px 44px 18px;display:grid;grid-template-rows:auto auto minmax(min-content,1fr) auto;gap:20px}
.kiosk-welcome{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;gap:24px}.welcome-tag{font-size:17px;font-weight:750;letter-spacing:2px;color:var(--brand)}.kiosk-welcome h1{font-size:clamp(40px,3.6vw,66px);font-weight:750;line-height:1.12;letter-spacing:-2px;margin:10px 0}.kiosk-welcome h1 span{color:var(--brand)}.kiosk-welcome p{font-size:23px;color:var(--muted);line-height:1.4}.welcome-symbol{width:110px;height:110px;display:grid;place-items:center;border-radius:28px;background:#ede5d8;color:#97764a;transform:rotate(-5deg);flex-shrink:0}.welcome-symbol .ic{font-size:62px}
.kiosk-search{padding:20px 26px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 6px 20px #2a322a05}.kiosk-search h2{font-size:23px;font-weight:650;margin-bottom:12px}.searchbox{margin:0;max-width:none;border:2px solid #bcc3b0;border-radius:12px;padding:6px 6px 6px 20px;box-shadow:none;gap:14px}.searchbox .lens{font-size:30px}.searchbox input{font-size:25px;padding:16px 2px;min-height:64px}.searchbox input::placeholder{color:#676f60}.btn-go{border-radius:9px;box-shadow:none;font-size:23px;min-height:66px;padding:14px 30px;display:flex;align-items:center;justify-content:center;gap:26px}.searchbox:focus-within,.searchbox.focus{border-color:var(--brand);box-shadow:0 0 0 4px #be201915}.search-example{font-size:19px;color:var(--muted);margin-top:12px;line-height:1.4}
.kiosk-projects{display:grid;grid-template-rows:auto minmax(min-content,1fr) auto;gap:14px;min-height:0}.projects-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.projects-heading h2{font-size:26px;letter-spacing:-.5px}.projects-heading>span{font-size:19px;color:var(--muted)}.projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(90px,1fr));gap:14px;margin:0}.project-pages{display:flex;align-items:center;justify-content:center;gap:26px}.project-pages button{display:flex;align-items:center;justify-content:center;gap:12px;min-height:60px;min-width:210px;padding:12px 22px;background:#fff;border:1px solid #bfc7b4;border-radius:12px;font-size:21px;font-weight:600}.project-pages button:disabled{opacity:.38;cursor:default}.project-pages span{font-size:20px;color:#5e6655;min-width:70px;text-align:center}.kiosk-footer{display:flex;align-items:center;justify-content:center;gap:14px;color:#575f50;font-size:19px;padding-top:10px;border-top:1px solid var(--line);line-height:1.4}.kiosk-footer .ic{color:var(--brand);font-size:26px}
button,input{touch-action:manipulation}button:focus-visible,input:focus-visible{outline:4px solid #216aad;outline-offset:4px}.key{min-height:62px}.kb{padding-bottom:18px}.kb-row{gap:8px}.key{min-width:0;flex:1;max-width:100px}.key.wide{min-width:100px}.key.ok{min-width:150px}.key.space{max-width:480px}.head h2{font-size:40px}.group-head h3{font-size:25px}.purpose{font-size:20px}.role{font-size:16px}.location-info{font-size:18px}
@media(orientation:portrait){.topbar{height:104px;padding:0 36px}.logo{height:76px;width:76px}.topbar .claim{font-size:25px}main{height:calc(100% - 104px)}.kiosk-home{padding:36px 40px 30px;gap:30px;min-height:100%;grid-template-rows:auto auto minmax(min-content,1fr) auto}.kiosk-welcome{padding:16px 2px}.welcome-tag{font-size:21px}.kiosk-welcome h1{font-size:clamp(48px,6.6vw,76px);max-width:12ch;line-height:1.08;margin:18px 0}.kiosk-welcome p{font-size:27px;max-width:30ch}.welcome-symbol{width:140px;height:140px}.welcome-symbol .ic{font-size:80px}.kiosk-search{padding:26px}.kiosk-search h2{font-size:27px;margin-bottom:20px}.searchbox input{font-size:27px;min-height:82px}.btn-go{min-height:82px;font-size:26px;padding:18px 26px}.search-example{font-size:23px;margin-top:18px}.projects-heading h2{font-size:32px}.projects-heading>span{display:none}.kiosk-projects{gap:22px}.projects{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(120px,1fr));gap:20px}.project-pages{gap:28px}.project-pages button{min-height:78px;min-width:240px;font-size:25px}.project-pages span{font-size:24px}.kiosk-footer{font-size:23px;padding-top:20px}.key{height:80px;font-size:28px}.kb-row{gap:7px}.key.wide{min-width:90px}.key.ok{min-width:140px}}
@media(orientation:landscape) and (max-height:850px){.topbar{height:72px}.logo{width:54px;height:54px}.topbar .claim{font-size:20px}main{height:calc(100% - 72px)}.kiosk-home{padding:14px 32px;gap:12px;min-height:100%}.welcome-tag{font-size:15px}.kiosk-welcome h1{font-size:40px;margin:6px 0}.kiosk-welcome p{font-size:20px}.welcome-symbol{width:82px;height:82px}.welcome-symbol .ic{font-size:46px}.kiosk-search{padding:14px 20px}.kiosk-search h2{font-size:20px;margin-bottom:8px}.searchbox input{font-size:22px;min-height:54px;padding:10px 0}.btn-go{min-height:56px;font-size:21px}.search-example{font-size:17px;margin-top:8px}.projects-heading h2{font-size:22px}.project-pages button{min-height:52px;font-size:19px}.kiosk-footer{font-size:17px;padding-top:8px}.kiosk-projects{gap:10px}}
@media(max-width:700px){.topbar{padding:0 18px;gap:12px}.topbar .claim{font-size:18px}.btn-home{padding:10px 14px;font-size:18px}.kiosk-home{padding:22px 18px;min-height:100%;gap:24px}.welcome-symbol{display:none}.kiosk-welcome h1{font-size:48px}.kiosk-welcome p{font-size:22px}.kiosk-search{padding:18px}.kiosk-search h2{font-size:22px}.searchbox{flex-wrap:wrap;padding:10px}.searchbox input{min-height:56px;font-size:22px}.btn-go{width:100%;min-height:60px}.search-example{font-size:18px}.project-pages{gap:10px}.project-pages button{min-width:0;flex:1;font-size:18px;padding:10px;min-height:60px}.project-pages span{font-size:18px;min-width:50px}.kiosk-footer{font-size:19px}.projects{gap:12px}.key{font-size:20px;height:58px}.key.wide{min-width:60px}.key.ok{min-width:90px}.kb-row{gap:4px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}
.key.wide,.key.ok{max-width:none;flex:0 0 auto;padding:0 18px}.key.wide{min-width:145px}.key.ok{min-width:175px}.key.space{min-width:130px}
@media(max-width:700px){.key.wide{min-width:78px;padding:0 6px;font-size:16px}.key.ok{min-width:100px;padding:0 8px;font-size:18px}.key.space{min-width:80px}}
.keyboard-open .kiosk-home{display:block;height:auto;min-height:0}.keyboard-open .kiosk-search{margin-top:22px}.keyboard-open .kiosk-projects,.keyboard-open .kiosk-footer{display:none}
/* Project setup: one prominent action, supporting information below. */
.plan-heading{display:flex;align-items:center;gap:24px;margin:32px 0 28px}.plan-emblem{width:88px;height:88px;display:grid;place-items:center;background:#e8eddf;color:#607348;border-radius:22px;flex-shrink:0}.plan-emblem .ic{font-size:46px}.plan-eyebrow{font-size:16px;font-weight:750;letter-spacing:1.5px;color:#68725e}.plan-heading h2{font-size:40px;line-height:1.12;letter-spacing:-1.1px;margin:9px 0 12px}.plan-heading p{font-size:21px;color:#62695c;line-height:1.4}.measure-ask{display:grid;grid-template-columns:minmax(0,1fr) minmax(410px,.9fr);gap:30px;align-items:center;padding:30px;background:#fff;border:1px solid #d7dece;border-radius:20px;margin:0;box-shadow:0 5px 18px #2b382b05;border-top:5px solid #758764}.measure-step{display:block;font-size:15px;font-weight:750;letter-spacing:1.5px;color:#68765a;margin-bottom:13px}.measure-ask .title{display:block;font-size:27px;font-weight:700;line-height:1.25;margin-bottom:12px}.measure-ask .hint{font-size:20px;line-height:1.5;margin:0;color:#656c5e;max-width:55ch}.measure-ask .row{display:flex;align-items:stretch;gap:12px;flex-wrap:wrap}.measure-value{display:flex;align-items:center;border:2px solid #b8c3a9;border-radius:12px;min-height:78px;flex:1;min-width:170px;overflow:hidden;background:#fafbf7}.measure-ask input{border:none;background:transparent;width:100%;min-width:0;padding:16px;font-size:30px;flex:1;outline-offset:-4px}.measure-ask .unit{padding-right:20px;font-size:23px;white-space:nowrap;color:#637154}.measure-ask .btn-go{font-size:22px;min-height:78px;padding:18px 22px;gap:18px;flex:1;white-space:nowrap}.measure-value:focus-within{border-color:var(--brand)}.project-advice{display:flex;align-items:flex-start;gap:15px;background:none;border:none;padding:22px 8px;margin-bottom:12px;color:#5f6757}.project-advice>.ic{font-size:27px;color:#8a753d;flex-shrink:0}.project-advice strong{display:block;font-size:19px;color:#424d38;margin-bottom:5px}.project-advice p{font-size:20px;line-height:1.5;max-width:85ch}
@media(orientation:portrait),(max-width:1000px){.plan-heading{align-items:flex-start}.plan-heading h2{font-size:36px}.measure-ask{grid-template-columns:1fr;gap:26px}.measure-controls{width:100%}.measure-ask .row{flex-wrap:nowrap}.measure-value{flex:1}.measure-ask .btn-go{flex:1}.project-advice{padding:22px 4px}}
@media(max-width:700px){.plan-heading{gap:14px}.plan-emblem{width:60px;height:60px;border-radius:14px}.plan-emblem .ic{font-size:32px}.plan-heading h2{font-size:29px}.plan-eyebrow{font-size:14px}.plan-heading p{font-size:19px}.measure-ask{padding:22px;gap:20px}.measure-ask .title{font-size:25px}.measure-ask .row{flex-direction:column}.measure-ask .hint,.project-advice p{font-size:19px}.measure-ask .btn-go{width:100%}}
/* Botones de proyecto del inicio: placa roja de la marca, nombre, primeros materiales y datos de la guía. */
.project{position:relative;overflow:hidden;min-height:96px;padding:18px 18px 18px 20px;gap:18px;align-items:center;border:1px solid #eee4dd;border-radius:22px;background:linear-gradient(135deg,#fff 0%,#fff 55%,#fff4f1 100%);box-shadow:0 1px 2px rgba(60,20,10,.05),0 12px 26px -14px rgba(140,30,20,.22);transition:transform .16s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease)}
.project .wm{position:absolute;right:-14px;bottom:-30px;font-size:132px;line-height:1;color:var(--brand);opacity:.05;pointer-events:none}
.project .ico{position:relative;width:66px;height:66px;border-radius:20px;background:linear-gradient(150deg,#e8352b,#b3140e);color:#fff;font-size:34px;box-shadow:0 10px 18px -10px rgba(190,32,25,.75),inset 0 1px 0 rgba(255,255,255,.28)}
.project .label{position:relative;display:flex;flex-direction:column;gap:6px;min-width:0}
.project .label b{font-size:23px;font-weight:750;line-height:1.15;letter-spacing:-.45px;color:var(--ink)}
.project .preview{font-size:15px;line-height:1.3;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.project .meta{font-size:13px;font-weight:750;letter-spacing:.3px;text-transform:uppercase;color:var(--brand);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.project .go{position:relative;display:grid;place-items:center;flex:0 0 auto;width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid #ecdcd5;color:var(--brand);font-size:22px;transition:background .2s var(--ease),color .2s var(--ease)}
.project:active{transform:scale(.985);border-color:var(--brand);box-shadow:0 0 0 4px rgba(190,32,25,.14)}
.project:active .go{background:var(--brand);border-color:var(--brand);color:#fff}
@media(orientation:landscape) and (max-height:850px){.project{min-height:0;padding:12px 14px 12px 16px;gap:14px}.project .ico{width:54px;height:54px;border-radius:16px;font-size:28px}.project .label b{font-size:20px}.project .preview{font-size:14px}.project .label{gap:4px}.project .meta{font-size:12px}}
@media(orientation:portrait){.project{flex-direction:column;align-items:flex-start;justify-content:space-between;padding:26px;gap:16px}.project .ico{width:84px;height:84px;border-radius:24px;font-size:44px}.project .label{gap:9px;padding-right:4px}.project .label b{font-size:30px}.project .preview{font-size:19px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.project .meta{font-size:16px}.project .go{position:absolute;top:26px;right:26px;width:54px;height:54px;font-size:26px}.project .wm{font-size:190px;right:-20px;bottom:-40px}}
@media(max-width:700px){.project{padding:16px;gap:12px}.project .ico{width:50px;height:50px;border-radius:15px;font-size:25px}.project .label b{font-size:20px}.project .go,.project .wm{display:none}}
.welcome-symbol{background:linear-gradient(150deg,#e8352b,#b3140e);color:#fff;box-shadow:0 14px 26px -14px rgba(190,32,25,.7)}