/* Bocetos del portal araucania.tours. Se carga después de site.css (mismo sistema de diseño de la landing). */

.sample{background:var(--accent-soft);color:var(--ink);font-size:.86rem;text-align:center;padding:7px var(--gutter);position:relative;z-index:60}
.sample a{color:var(--accent);font-weight:600}
.page-portal .top{position:sticky;top:0;color:var(--ink);background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
.page-portal .brand{color:var(--accent)}
.page-portal .nav a.on{color:var(--accent);opacity:1}
.user-btn{display:inline-flex;align-items:center;gap:8px}

/* buscador */
.search{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,.8fr) auto;gap:8px;background:var(--surface);color:var(--ink);border-radius:calc(var(--r-card) + 4px);padding:8px;box-shadow:var(--shadow);border:1px solid var(--line)}
.search label{display:grid;gap:2px;padding:8px 14px;border-radius:12px;cursor:text}
.search label:hover{background:var(--surface-2)}
.search span{font-size:.78rem;font-weight:600;color:var(--muted)}
.search input,.search select{border:0;background:transparent;font:inherit;color:var(--ink);padding:0;min-width:0;outline:none}
.search .btn{align-self:stretch;border-radius:14px;padding:0 1.4em}
@media (max-width:900px){.search{grid-template-columns:minmax(0,1fr)}.search .btn{padding:.9em}}

/* portada del portal */
.p-hero{position:relative;color:#fff;isolation:isolate;overflow:hidden;padding:clamp(80px,12vw,150px) 0 clamp(40px,6vw,64px)}
.p-hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.p-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(6,18,11,.35),rgba(6,18,11,.72))}
.p-hero h1{font-size:clamp(2.2rem,1.3rem + 3.6vw,3.8rem);max-width:16ch}
.p-hero p{margin:14px 0 28px;font-size:1.15rem;color:#e6efe7;max-width:52ch}

/* espacios publicitarios */
.ad{position:relative;border:1.5px dashed color-mix(in srgb,var(--accent) 55%,var(--line));border-radius:var(--r-card);background:color-mix(in srgb,var(--accent-soft) 55%,var(--surface));display:flex;align-items:center;gap:18px;padding:18px 22px}
.ad-tag{position:absolute;top:-11px;left:16px;background:var(--bg);padding:0 8px;font-size:.74rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ad-code{margin-left:auto;font:600 .78rem/1 "Figtree",sans-serif;color:var(--accent);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-pill);padding:6px 10px;white-space:nowrap}
.ad .ico{width:30px;height:30px;color:var(--accent);flex:none}
.ad b{display:block;font-family:"Montserrat",sans-serif}
.ad p{color:var(--muted);font-size:.95rem}
.ad-strip{margin-top:-28px;position:relative;z-index:2}
.ad-box{flex-direction:column;align-items:flex-start;min-height:250px;justify-content:center}
.ad-box .ad-code{margin:12px 0 0}
@media (max-width:640px){.ad{flex-wrap:wrap}.ad-code{margin-left:0}}

/* tarjetas de producto */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));gap:20px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;display:flex;flex-direction:column;text-decoration:none;transition:transform .3s var(--ease),box-shadow .3s}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.card .media{position:relative;aspect-ratio:4/3;background:var(--surface-2)}
.card .media img{width:100%;height:100%;object-fit:cover}
.card .body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.card .meta{display:flex;flex-wrap:wrap;gap:6px 14px;color:var(--muted);font-size:.86rem}
.card .meta span{display:inline-flex;align-items:center;gap:5px}
.card .meta .ico{width:16px;height:16px}
.card h3{font-size:1.06rem}
.card .price{margin-top:auto;padding-top:8px;font-size:.92rem;color:var(--muted)}
.card .price b{font:800 1.15rem/1 "Montserrat",sans-serif;color:var(--ink)}
.card.sponsored{border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}
.flag{display:inline-flex;align-items:center;gap:5px;font-size:.78rem;font-weight:600;border-radius:var(--r-pill);padding:4px 9px;background:var(--surface-2);color:var(--muted);width:max-content}
.flag.ok{background:var(--accent-soft);color:var(--accent)}
.flag.warn{background:#fff3d6;color:#7a4b00}
:root[data-theme="dark"] .flag.warn{background:#3a2c0c;color:#ffd27a}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .flag.warn{background:#3a2c0c;color:#ffd27a}}
.flag .ico{width:14px;height:14px}

/* encabezado de territorio y listado */
.t-hero{position:relative;color:#fff;isolation:isolate;overflow:hidden;padding:clamp(70px,9vw,110px) 0 36px}
.t-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.t-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(6,18,11,.78),rgba(6,18,11,.25))}
.t-hero h1{font-size:clamp(2rem,1.3rem + 3vw,3.2rem)}
.t-hero p{margin-top:12px;max-width:58ch;color:#e6efe7}
.crumbs{font-size:.88rem;margin-bottom:14px;opacity:.9}
.crumbs a{text-decoration:none}
.listing{display:grid;grid-template-columns:260px minmax(0,1fr);gap:32px;padding:36px 0 80px}
.filters{position:sticky;top:96px;align-self:start;display:grid;gap:22px}
.filters h3{font-size:.95rem;margin-bottom:8px}
.filters label{display:flex;align-items:center;gap:10px;font-size:.95rem;color:var(--muted);padding:4px 0}
.filters input[type=checkbox]{accent-color:var(--accent);width:18px;height:18px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:1.5px solid var(--line);border-radius:var(--r-pill);padding:.45em .9em;font-size:.9rem;font-weight:600;background:transparent;color:var(--ink)}
.chip.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.list-head{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:20px}
.list-head p{color:var(--muted)}
.list-head select{font:inherit;border:1.5px solid var(--line);border-radius:var(--r-field);padding:.5em .8em;background:var(--surface);color:var(--ink)}
.grid-ad{grid-column:1/-1}
@media (max-width:900px){.listing{grid-template-columns:minmax(0,1fr)}.filters{position:static}}

/* ficha de producto */
.gallery{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:10px;height:clamp(300px,42vw,500px);border-radius:var(--r-card);overflow:hidden;margin-top:24px}
.gallery img{width:100%;height:100%;object-fit:cover}
.gallery img:first-child{grid-row:span 2}
@media (max-width:700px){.gallery{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;height:auto}.gallery img{aspect-ratio:4/3}.gallery img:not(:first-child){display:none}}
.product{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:48px;padding:32px 0 80px}
.product h1{font-size:clamp(1.8rem,1.2rem + 2.4vw,2.6rem)}
.facts-row{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 8px}
.block{padding:28px 0;border-top:1px solid var(--line)}
.block h2{font-size:1.3rem;margin-bottom:12px}
.block p,.block li{color:var(--muted)}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.ticks li{display:flex;gap:10px}
.ticks .ico{color:var(--accent);margin-top:.2em}
.ticks.no .ico{color:var(--muted)}
.steps{counter-reset:s;list-style:none;padding:0;margin:0;display:grid;gap:14px}
.steps li{position:relative;padding-left:44px}
.steps li::before{counter-increment:s;content:counter(s);position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-weight:700;font-size:.9rem}
.steps b{color:var(--ink)}
.notice{display:flex;gap:12px;background:var(--surface-2);border-radius:var(--r-field);padding:14px 16px;color:var(--ink)}
.notice .ico{color:var(--accent);margin-top:.15em}
.empty{border:1.5px dashed var(--line);border-radius:var(--r-card);padding:26px;text-align:center;color:var(--muted)}
.empty .ico{width:34px;height:34px;color:var(--accent);margin:0 auto 8px}
.seller{display:flex;gap:16px;align-items:center}
.avatar{width:56px;height:56px;border-radius:50%;background:var(--deep);color:#8fd894;display:grid;place-items:center;font:800 1.2rem/1 "Montserrat",sans-serif;flex:none}
.book{position:sticky;top:96px;align-self:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);padding:24px;box-shadow:var(--shadow)}
.book .from{color:var(--muted)}
.book .from b{font:800 1.8rem/1 "Montserrat",sans-serif;color:var(--ink)}
.book .field{margin-top:14px}
.slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.slot{border:1.5px solid var(--line);border-radius:var(--r-field);padding:.6em;text-align:center;font-weight:600;font-size:.92rem;background:transparent;color:var(--ink)}
.slot small{display:block;font-weight:400;color:var(--muted);font-size:.78rem}
.slot.on{border-color:var(--accent);background:var(--accent-soft)}
.slot[disabled]{opacity:.45;text-decoration:line-through}
.qty{display:flex;align-items:center;justify-content:space-between;border:1.5px solid var(--line);border-radius:var(--r-field);padding:6px 6px 6px 14px}
.qty button{width:36px;height:36px;border-radius:50%;border:1.5px solid var(--line);background:transparent;color:var(--ink);font-size:1.2rem}
.total{display:flex;justify-content:space-between;margin:18px 0 14px;padding-top:14px;border-top:1px solid var(--line);font-weight:600}
.book .btn{width:100%;justify-content:center}
.fine{font-size:.84rem;color:var(--muted);margin-top:12px;display:flex;gap:8px}
.fine .ico{width:16px;height:16px;margin-top:.15em;flex:none}
@media (max-width:980px){.product{grid-template-columns:minmax(0,1fr)}.book{position:static}.two{grid-template-columns:minmax(0,1fr)}}

/* checkout */
.checkout{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:40px;padding:40px 0 80px}
.panel-box{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);padding:24px}
.panel-box + .panel-box{margin-top:18px}
.panel-box h2{font-size:1.2rem;margin-bottom:14px}
.sum-row{display:flex;justify-content:space-between;gap:16px;padding:8px 0;color:var(--muted)}
.sum-row b{color:var(--ink)}
.sum-row.big{font-size:1.1rem;color:var(--ink);font-weight:700;border-top:1px solid var(--line);margin-top:6px;padding-top:14px}
.mini{display:flex;gap:14px;align-items:center;margin-bottom:16px}
.mini img{width:84px;height:64px;object-fit:cover;border-radius:10px}
.progress{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px;font-size:.92rem;color:var(--muted)}
.progress span{display:inline-flex;align-items:center;gap:6px}
.progress .on{color:var(--accent);font-weight:600}
@media (max-width:980px){.checkout{grid-template-columns:minmax(0,1fr)}}

/* paneles (vendedor, admin, turista) */
.app{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:calc(100dvh - 34px)}
.side{background:var(--deep);color:var(--on-deep);padding:22px 16px;display:flex;flex-direction:column;gap:4px}
.side .brand{color:#fff;margin:0 8px 22px}
.side .brand svg{height:19px}
.side a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;text-decoration:none;color:var(--on-deep-muted);font-weight:500}
.side a:hover{background:rgba(255,255,255,.06);color:#fff}
.side a.on{background:rgba(67,194,74,.16);color:#fff}
.side .ico{width:20px;height:20px}
.side .sep{margin:14px 12px 6px;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(238,244,239,.5)}
.side .bottom{margin-top:auto}
.main{padding:28px clamp(16px,3vw,40px) 60px;min-width:0}
.main-head{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;margin-bottom:24px}
.main-head h1{font-size:clamp(1.5rem,1.1rem + 1.4vw,2rem)}
.main-head p{color:var(--muted);margin-top:4px}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:24px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);padding:18px 20px}
.kpi span{color:var(--muted);font-size:.9rem}
.kpi b{display:block;font:800 1.7rem/1.1 "Montserrat",sans-serif;margin-top:6px}
.kpi small{color:var(--muted);font-size:.84rem}
.cols{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:20px}
.alert{display:flex;flex-wrap:wrap;gap:14px;align-items:center;background:#fff3d6;color:#5c3a00;border-radius:var(--r-card);padding:16px 20px;margin-bottom:22px}
:root[data-theme="dark"] .alert{background:#3a2c0c;color:#ffe2a3}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .alert{background:#3a2c0c;color:#ffe2a3}}
.alert .ico{width:26px;height:26px;flex:none}
.alert .btn{margin-left:auto;padding:.6em 1.1em}
.alert > div{flex:1 1 240px}
.table-wrap{overflow-x:auto}
table.t{width:100%;border-collapse:collapse;font-size:.94rem}
.t th{text-align:left;font-weight:600;color:var(--muted);font-size:.84rem;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.t td{padding:12px;border-bottom:1px solid var(--line);vertical-align:middle;white-space:nowrap}
.t tr:last-child td{border-bottom:0}
.t .r{text-align:right}
.cal{display:grid;grid-template-columns:120px repeat(8,minmax(56px,1fr));font-size:.82rem;border:1px solid var(--line);border-radius:var(--r-field);overflow:hidden;min-width:640px}
.cal div{padding:8px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.cal .h{background:var(--surface-2);font-weight:600;color:var(--muted);text-align:center}
.cal .n{font-weight:600}
.cal .busy{background:var(--accent);color:var(--accent-ink);font-weight:600}
.cal .hold{background:var(--accent-soft);color:var(--accent);font-weight:600}
.bar-chart{display:flex;align-items:flex-end;gap:8px;height:150px;padding-top:10px}
.bar-chart div{flex:1;background:var(--accent);border-radius:6px 6px 0 0;opacity:.85}
.bar-labels{display:flex;gap:8px;font-size:.78rem;color:var(--muted);margin-top:6px}
.bar-labels span{flex:1;text-align:center}
@media (max-width:1100px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.cols{grid-template-columns:minmax(0,1fr)}}
@media (max-width:820px){.app{grid-template-columns:minmax(0,1fr)}.side{flex-direction:row;overflow-x:auto;padding:10px;gap:4px;position:sticky;top:0;z-index:20}.side .brand,.side .sep,.side .bottom{display:none}.side a{white-space:nowrap;padding:8px 12px}}
@media (max-width:480px){.kpis{grid-template-columns:minmax(0,1fr)}}

/* anúnciate */
.spaces{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.space{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);padding:22px;display:flex;flex-direction:column;gap:12px}
.space h3{font-size:1.15rem}
.space p{color:var(--muted)}
.space .where{display:block;border-radius:12px;background:var(--surface-2);padding:12px;aspect-ratio:16/7;position:relative;overflow:hidden}
.where i{position:absolute;display:block;border-radius:4px;background:color-mix(in srgb,var(--muted) 22%,transparent)}
.where i.hl{background:var(--accent)}
.space .price{font-weight:600;color:var(--muted);font-size:.92rem;margin-top:auto}
.space:first-child{grid-column:span 2;flex-direction:row;align-items:center;gap:28px}
.space:first-child .where{flex:0 0 46%}
@media (max-width:900px){.spaces{grid-template-columns:minmax(0,1fr)}.space:first-child{grid-column:auto;flex-direction:column;align-items:stretch}.space:first-child .where{flex:none}}
.how{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;counter-reset:h}
.how div{counter-increment:h;border-top:3px solid var(--accent);padding-top:14px}
.how div::before{content:counter(h);font:800 1.6rem/1 "Montserrat",sans-serif;color:var(--accent)}
.how b{display:block;margin-top:8px}
.how p{color:var(--muted);font-size:.94rem;margin-top:4px}
@media (max-width:900px){.how{grid-template-columns:minmax(0,1fr)}}

/* índice de bocetos */
.toc{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:18px}
.toc a{display:flex;flex-direction:column;gap:8px;text-decoration:none;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);padding:22px;transition:transform .3s var(--ease),box-shadow .3s}
.toc a:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.toc .ico{width:30px;height:30px;color:var(--accent)}
.toc h2{font-size:1.15rem}
.toc p{color:var(--muted);font-size:.95rem}
p,li,td{overflow-wrap:break-word}
.join .btn-ghost{color:#fff}
