/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */

.hide {
  display: none;
}


/* HOME */


:root{color-scheme:light;--bg:#ffffff;--fg:#1c2420;--mut:#5b665f;--card:#ffffff;--line:#e2e5df;--acc:#c2410c}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
header.hero{position:relative;display:flex;align-items:flex-end;min-height:min(60vh,440px);padding:48px 16px 40px;color:#fff;background:#3a4a40 url("https://deamiles.cl/assets/home-6a79b7464551ba8a00080336a266da8b05c0d2fd68241d5d0b04fe5391620f7f.jpeg") center/cover no-repeat}
header.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.72),rgba(0,0,0,.25) 65%,rgba(0,0,0,.15))}
.hero-in{position:relative;max-width:900px;margin:0 auto;width:100%}
.hero h1{font-size:clamp(2rem,6vw,3.2rem);margin:0 0 8px;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.hero .lead{margin:0;max-width:560px;font-size:1.1rem;color:rgba(255,255,255,.92);text-shadow:0 1px 8px rgba(0,0,0,.4)}
main{max-width:900px;margin:0 auto;padding:24px 16px 64px}
nav{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
nav a{padding:6px 14px;border:1px solid var(--line);border-radius:99px;color:var(--fg);text-decoration:none;font-size:.9rem}
nav a:hover{border-color:var(--acc);color:var(--acc)}
article{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;margin-bottom:32px}
.tag{color:var(--acc);font-weight:700;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase}
h2{margin:2px 0 4px;font-size:1.7rem}
.date{color:var(--mut);margin:0 0 14px}
.stats{display:flex;gap:12px;flex-wrap:wrap;margin:14px 0}
.stat{flex:1 1 120px;border:1px solid var(--line);border-radius:12px;padding:10px 14px}
.stat b{display:block;font-size:1.5rem;line-height:1.2}
.stat span{color:var(--mut);font-size:.8rem}
.gal{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin:16px 0}
.gal img{width:100%;height:190px;object-fit:cover;border-radius:12px;display:block;background:var(--line)}
.gal figcaption{color:var(--mut);font-size:.8rem;margin-top:4px}
.gal figure{margin:0}
iframe{width:100%;height:440px;border:1px solid var(--line);border-radius:12px;background:var(--line)}
.btns{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.btn{display:inline-block;padding:9px 16px;border-radius:10px;border:1px solid var(--acc);color:var(--acc);text-decoration:none;font-weight:600;font-size:.92rem}
.btn.main{background:var(--acc);color:#fff}
.note{background:rgba(194,65,12,.08);border-left:3px solid var(--acc);padding:8px 12px;border-radius:6px;font-size:.9rem;color:var(--mut)}