/*
Theme Name: Pasillo
Description: Tema propio de Dónde se compra.
Version: 1.0
Text Domain: pasillo
*/
@font-face{font-family:Barlow;font-weight:400;font-display:swap;src:url(fonts/Barlow-400.woff2) format("woff2")}
@font-face{font-family:Barlow;font-weight:600;font-display:swap;src:url(fonts/Barlow-600.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:700;font-display:swap;src:url(fonts/BarlowCondensed-700.woff2) format("woff2")}
:root{--bg:#f4f6f9;--surface:#fff;--ink:#11151c;--muted:#4c5564;--line:#d5dae3;--accent:#0b3fb3;--on-accent:#fff;--accent-soft:#e6ecfa;--mark:#f2b705;--on-mark:#11151c;--r:4px;--gap:64px}
:root[data-theme=dark]{--bg:#0e1320;--surface:#171e2f;--ink:#eef1f7;--muted:#aab3c4;--line:#2d3750;--accent:#9db8ff;--on-accent:#0e1320;--accent-soft:#1f2a45}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0e1320;--surface:#171e2f;--ink:#eef1f7;--muted:#aab3c4;--line:#2d3750;--accent:#9db8ff;--on-accent:#0e1320;--accent-soft:#1f2a45}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.6 Barlow,system-ui,sans-serif;overflow-wrap:break-word}
a{color:var(--accent)}img{max-width:100%;height:auto}
h1,h2,h3,.sign{font-family:"Barlow Condensed",Barlow,sans-serif;font-weight:700;line-height:1.08;letter-spacing:.005em}
h1{font-size:clamp(38px,5.2vw,62px);margin:0 0 14px}h2{font-size:32px;margin:44px 0 12px}h3{font-size:23px;margin:26px 0 6px}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:var(--surface);padding:8px;z-index:9}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
/* header */
.top{background:var(--surface);border-bottom:3px solid var(--accent);position:sticky;top:0;z-index:5}
.top .wrap{display:flex;align-items:center;gap:18px;min-height:64px}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);font:700 27px/1 "Barlow Condensed",sans-serif;white-space:nowrap}
.brand svg{width:30px;height:30px;flex:none}.brand svg .w{stroke:var(--accent)}.brand svg .p{fill:#0b3fb3}
.nav{display:flex;gap:2px;margin-left:auto}
.nav a{padding:10px 11px;text-decoration:none;color:var(--ink);font-weight:600;border-bottom:3px solid transparent;font-size:16px}
.nav a:hover{color:var(--accent)}.nav a[aria-current]{color:var(--accent);border-color:var(--accent)}
.ico{background:none;border:1px solid var(--line);color:var(--ink);border-radius:var(--r);min-width:42px;height:42px;cursor:pointer;display:inline-grid;place-items:center;font:inherit}
.ico:hover{border-color:var(--accent)}.ico svg{width:20px;height:20px}
#menuBtn{display:none}
.searchbar{background:var(--surface);border-bottom:1px solid var(--line);padding:12px 0}.searchbar[hidden]{display:none}
/* search */
.finder{position:relative}.finder form{display:flex;gap:8px}
.finder input{flex:1;min-width:0;height:52px;padding:0 14px;font:inherit;font-size:18px;border:2px solid var(--ink);border-radius:var(--r);background:var(--surface);color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 20px;background:var(--accent);color:var(--on-accent);border:0;border-radius:var(--r);font:700 20px "Barlow Condensed",sans-serif;cursor:pointer;text-decoration:none}
.btn:hover{filter:brightness(1.12)}
.sug{position:absolute;left:0;right:0;top:100%;margin-top:4px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 8px 24px rgba(0,0,0,.18);z-index:6;list-style:none;padding:4px;margin-left:0}
.sug[hidden]{display:none}.sug a{display:block;padding:10px;text-decoration:none;color:var(--ink);border-radius:3px}.sug a:hover,.sug a.on{background:var(--accent-soft)}.sug small{color:var(--muted);display:block}.sug .none{padding:10px;color:var(--muted)}
/* home hero */
.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;padding:36px 0 var(--gap);align-items:start}.hero>*{min-width:0}
.lede{font-size:20px;color:var(--muted);margin:0 0 20px;max-width:34em}.tries{margin:14px 0 0;color:var(--muted);font-size:16px}
.plate-h{position:relative;padding-top:30px}.plate-h:before,.plate-h:after{content:"";position:absolute;top:0;height:32px;width:3px;background:var(--ink)}.plate-h:before{left:18%}.plate-h:after{right:18%}
.plate{background:var(--accent);color:var(--on-accent);border-radius:6px;padding:24px 26px}
.plate .k{font:700 18px "Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.09em;opacity:.9}
.plate .q{font:700 clamp(30px,3.6vw,42px)/1.05 "Barlow Condensed",sans-serif;margin:4px 0 12px}
.plate mark{background:var(--mark);color:var(--on-mark);padding:0 .22em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.plate>a{display:inline-flex;align-items:center;min-height:44px}.brand{min-height:44px}.seeall{display:inline-flex;align-items:center;min-height:44px;font-weight:600}.aisle .gly{width:34px;height:34px;color:var(--accent);margin-bottom:6px}.plate ol{margin:14px 0 14px;padding-left:22px}.plate li{margin:4px 0}.plate a{color:inherit;font-weight:600}
/* aisles */
.sec{margin-bottom:var(--gap)}.sec>h2:first-child{margin-top:0}.seehead{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.aisles{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}.aisles>*{min-width:0}
.aisle{background:var(--surface);border:1px solid var(--line);border-top:6px solid var(--accent);border-radius:var(--r);padding:16px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column}
.aisle:hover{border-color:var(--accent)}.aisle .no{font:700 16px "Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.aisle h3{margin:2px 0 6px;font-size:30px}.aisle p{margin:0 0 10px;color:var(--muted);font-size:16px}.aisle .ex{font-size:15px;margin-top:auto}.aisle .cta{color:var(--accent);font-weight:600;margin-top:8px}
.band{background:var(--accent);color:var(--on-accent);padding:40px 0;margin-bottom:var(--gap)}.band h2{margin:0 0 18px}
.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.tools>*{min-width:0}.tools a{color:inherit;text-decoration:none;display:block;border-left:3px solid var(--mark);padding-left:14px}.tools b{font:700 25px/1.1 "Barlow Condensed",sans-serif;display:block;margin-bottom:4px}.tools a:hover b{text-decoration:underline}
.ruled{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}.ruled li{border-bottom:1px solid var(--line)}.ruled a{display:flex;justify-content:space-between;gap:16px;padding:13px 2px;text-decoration:none;color:var(--ink);font-weight:600}.ruled a:hover{color:var(--accent)}.ruled small{color:var(--muted);font-weight:400;white-space:nowrap}
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;border-top:1px solid var(--line);padding-top:22px}.trust b{display:block}.trust p{margin:4px 0 0;color:var(--muted);font-size:16px}
/* inner */
.crumbs{font-size:15px;color:var(--muted);padding-top:16px;padding-bottom:8px}.crumbs a{color:var(--muted);display:inline-block;padding:10px 0}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;align-items:start;padding-bottom:var(--gap)}
.prose{max-width:760px}.prose table{border-collapse:collapse;width:100%;font-size:16px;display:block;overflow-x:auto}.prose th,.prose td{border-bottom:1px solid var(--line);padding:9px 10px;text-align:left;vertical-align:top}.prose th{border-bottom:2px solid var(--ink);font-weight:600;white-space:nowrap}
.prose .related{margin-top:40px}
.gh{font-size:clamp(26px,3vw,34px)}.answer{background:var(--accent);color:var(--on-accent);border-radius:6px;padding:20px 24px;margin:0 0 26px;font-size:18px;line-height:1.45}.answer .lead{font:700 clamp(31px,3.5vw,40px)/1.12 "Barlow Condensed",sans-serif;margin:0 0 10px}.answer .sub{margin:0}.answer .k{display:block;font:700 17px "Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.09em;opacity:.9;margin-bottom:4px}
.meta{color:var(--muted);font-size:15px;margin:0 0 18px}
.rail{position:sticky;top:84px;display:grid;gap:22px;font-size:16px}.rail h2{font-size:22px;margin:0 0 8px}.rail ul{list-style:none;margin:0;padding:0}.rail li{border-top:1px solid var(--line)}.rail li a{display:block;padding:8px 0;text-decoration:none;color:var(--ink)}.rail li a:hover{color:var(--accent)}
.more{margin:22px 0}.pager{display:flex;gap:8px;flex-wrap:wrap;margin:26px 0}.pager a,.pager span{min-width:42px;min-height:42px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r);text-decoration:none;text-align:center}.pager .current{background:var(--accent);color:var(--on-accent)}
/* tools */
.tool{background:var(--surface);border:1px solid var(--line);border-top:6px solid var(--accent);border-radius:var(--r);padding:20px;margin:0 0 26px}
.tool label{display:block;font-weight:600;font-size:15px;margin-bottom:4px}.tool input,.tool select{width:100%;height:46px;padding:0 10px;font:inherit;border:1px solid var(--muted);border-radius:var(--r);background:var(--bg);color:var(--ink)}
.row{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:12px}.row>*{min-width:0}
.pres{border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:12px}.pres b{display:block;margin-bottom:6px}
.out{background:var(--accent-soft);border-left:5px solid var(--accent);padding:14px 16px;margin-top:14px;border-radius:var(--r)}.out strong.big{font:700 34px/1.1 "Barlow Condensed",sans-serif;display:block}.err{color:inherit;font-weight:600}
.best{font-weight:600}.linkbtn{background:none;border:1px solid var(--accent);color:var(--accent);min-height:42px;padding:0 14px;border-radius:var(--r);font:inherit;font-weight:600;cursor:pointer}
/* forms */
.cform label{display:block;font-weight:600;margin:12px 0 4px}.cform input,.cform textarea{width:100%;padding:11px;font:inherit;border:1px solid var(--muted);border-radius:var(--r);background:var(--surface);color:var(--ink)}.hp{position:absolute;left:-9999px}
.note{padding:12px 14px;background:var(--accent-soft);border-radius:var(--r);margin:12px 0}
/* footer */
.foot{background:var(--surface);border-top:3px solid var(--accent);padding:34px 0 22px;font-size:16px}.foot .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:26px}.foot .cols>*{min-width:0}.foot b{display:block;font:700 20px "Barlow Condensed",sans-serif;margin-bottom:6px}.foot ul{list-style:none;margin:0;padding:0}.foot li a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);text-decoration:none}.foot li a:hover{color:var(--accent)}.foot .fine{color:var(--muted);margin:20px 0 0;font-size:15px}
@media(max-width:1020px){.nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--surface);flex-direction:column;border-bottom:3px solid var(--accent);padding:6px 12px}.nav.open{display:flex}.nav a{padding:12px 6px}#menuBtn{display:inline-grid}.tb{margin-left:auto}.layout{grid-template-columns:minmax(0,1fr);gap:26px}.rail{position:static}.prose{max-width:none}}
@media(max-width:820px){:root{--gap:44px}.hero{grid-template-columns:minmax(0,1fr);gap:24px;padding-top:20px}.aisles{grid-template-columns:repeat(2,minmax(0,1fr))}.tools,.trust{grid-template-columns:minmax(0,1fr)}.foot .cols{grid-template-columns:repeat(2,minmax(0,1fr))}.foot .cols>:first-child{grid-column:1/-1}}
@media(max-width:480px){body{font-size:16.5px}.finder form{flex-direction:row}.btn{padding:0 14px}.aisle{padding:12px}.aisle h3{font-size:25px}.ruled a{flex-direction:column;gap:0}h2{font-size:28px}.brand{font-size:23px}}
/* R1 fixes 2026-11-03 */
.inner{padding-top:10px}.inner>h1:first-child{margin-top:6px}
.answer .chip{display:inline-block;margin-left:8px;padding:1px 8px;border:1px solid currentColor;border-radius:3px;font:600 14px/1.5 Barlow,sans-serif;letter-spacing:.02em;text-transform:none;vertical-align:2px}
.ad-slot{display:none}.ad-slot.on{display:block;min-height:250px;margin:26px 0}
.toc-m{display:none}
.ruled a>span{min-width:0}.ruled a em{display:block;font-style:normal;font-weight:400;color:var(--muted);font-size:16px;margin-top:2px}
html.js .rows.collapsed li.x{display:none}html.js .rows.collapsed.filtering li.x{display:block}.rows li.f-hide{display:none!important}
.showall{margin-top:14px}.grp{margin-top:34px}.grp[hidden]{display:none}.grp h2{margin:0 0 10px}.grp h2 small{font:400 17px Barlow,sans-serif;color:var(--muted);margin-left:6px}
.filt{margin:0 0 8px;max-width:560px}.filt label{display:block;font-weight:600;font-size:15px;margin-bottom:4px}.filt input{width:100%;height:48px;padding:0 12px;font:inherit;border:1px solid var(--muted);border-radius:var(--r);background:var(--surface);color:var(--ink)}.filt .meta{margin:8px 0 0}
.jump{margin:16px 0 0;color:var(--muted);font-size:16px}.jump a{display:inline-block;padding:8px 0;font-weight:600}
.feat{margin:30px 0 0}.feat h2{margin:0 0 12px}.featrow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.fcard{background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--accent);border-radius:var(--r);padding:14px 16px;text-decoration:none;color:var(--ink)}.fcard:hover{border-color:var(--accent)}.fcard b{display:block;font:700 22px/1.15 "Barlow Condensed",sans-serif;margin-bottom:6px}.fcard span{color:var(--muted);font-size:16px}
.h-aisles{margin:34px 0 14px}
.related .more{margin:14px 0 0}
/* reserved height = rendered height before any input (measured 2026-11-03), so the JS-built form causes no layout shift */
.tool[data-tool=unidad]{min-height:447px}.tool[data-tool=medidas],.tool[data-tool=material]{min-height:416px}
@media(max-width:600px){.tool[data-tool=unidad]{min-height:639px}.tool[data-tool=medidas]{min-height:622px}.tool[data-tool=material]{min-height:635px}}
@media(max-width:1020px){.toc-m{display:block;margin:0 0 22px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}.toc-m[hidden]{display:none}.toc-m summary{cursor:pointer;padding:12px 14px;font-weight:600;min-height:44px}.toc-m ul{list-style:none;margin:0;padding:0 14px 8px}.toc-m li{border-top:1px solid var(--line)}.toc-m li a{display:block;padding:9px 0;text-decoration:none;color:var(--ink)}.toc-d{display:none}}
@media(max-width:820px){.featrow{grid-template-columns:minmax(0,1fr)}}
@media(max-width:480px){.prose th,.prose td{min-width:150px}.prose table{border:1px solid var(--line);border-radius:var(--r)}}
