/* MEGAWEB INDEPENDIENTE — TEMA PAPEL / SEPIA
   Diseñado para lectura larga, calma visual y navegación editorial. */
:root{
  --paper:#f2ead8; --paper-deep:#e7dcc3; --paper-card:#f8f1e2;
  --ink:#2f281f; --ink-soft:#5c5144; --muted:#75695a;
  --line:#cfc1a8; --accent:#8a5a2b; --accent-2:#b47a43;
  --accent-ink:#fffaf0; --danger:#9a3d2f; --danger-bg:#f4dfd7;
  --shadow:0 16px 40px rgba(75,55,30,.12);
  --shadow-sm:0 8px 22px rgba(75,55,30,.09);
  --radius:14px; --radius-sm:9px; --radius-lg:20px; --max:1180px;
  --font-display:'Space Grotesk',Georgia,serif;
  --font-body:Inter,system-ui,-apple-system,'Segoe UI',sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{scroll-behavior:smooth;background:var(--paper)}
body{
 background:var(--paper);
 color:var(--ink);
 font-family:var(--font-body);line-height:1.78;
 -webkit-font-smoothing:antialiased;
}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.16;
 background-image:radial-gradient(rgba(70,50,25,.22) .55px,transparent .7px);
 background-size:7px 7px;mix-blend-mode:multiply;z-index:9999}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
::selection{background:#c8aa7d;color:#211a13}
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--paper-deep)}
::-webkit-scrollbar-thumb{background:#bba98d;border-radius:20px;border:2px solid var(--paper-deep)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--ink);line-height:1.18;letter-spacing:-.025em}
h1{font-size:clamp(2rem,5vw,3.55rem)}
h2{font-size:clamp(1.45rem,3vw,2.2rem);margin-bottom:12px}
h3{font-size:1.08rem;margin-bottom:7px}
p{color:var(--ink-soft)}
strong,b{color:var(--ink)}
section{padding:56px 0;border-bottom:1px solid var(--line)}
main>section:last-child{border-bottom:0}

/* Cabecera editorial */
.v7-top,.urgency-band{background:#3f3326;color:#f5ead7;border:0}
.v7-top .wrap{min-height:38px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.82rem}
header,.v7-header{
 position:sticky;top:0;z-index:80;background:rgba(242,234,216,.94);
 backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
 border-bottom:1px solid var(--line);box-shadow:0 3px 16px rgba(70,50,30,.06)
}
.nav-bar,.v7-nav{display:flex;align-items:center;justify-content:space-between;gap:20px;
 max-width:var(--max);margin:auto;padding:15px 24px;min-height:70px}
.logo,.v7-logo{font-family:var(--font-display);font-weight:700;font-size:1.18rem;color:var(--ink);white-space:nowrap}
.logo span,.v7-logo span{color:var(--accent)}
nav.main-nav,.v7-links{display:flex;gap:20px;align-items:center;font-size:.9rem;font-weight:600}
nav.main-nav a,.v7-links a{color:var(--ink-soft)}
nav.main-nav a:hover,.v7-links a:hover{color:var(--accent)}
.menu-toggle{display:none;background:none;border:0;color:var(--ink);font-size:1.5rem;cursor:pointer}
@media(max-width:900px){
 .nav-bar,.v7-nav{position:relative}
 nav.main-nav,.v7-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--paper-card);border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
 nav.main-nav.open,.v7-links.open{display:flex}
 nav.main-nav a,.v7-links a{padding:14px 24px;border-bottom:1px solid var(--line)}
 .menu-toggle{display:block}
}
.mega-hero,.zone-hero,.answer-hero,.v7-hero{
 padding:68px 0 52px;
 background:linear-gradient(180deg,#f7efdf 0%,var(--paper) 100%);
 border-bottom:1px solid var(--line)
}
.mega-hero h1,.zone-hero h1,.v7-hero h1{max-width:930px;margin:12px 0 18px}
.mega-hero p,.zone-hero p,.answer-hero .answer,.v7-hero p{max-width:780px;font-size:1.08rem}
.eyebrow,.v7-kicker{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.13em;font-size:.72rem;color:var(--accent);font-weight:700;margin-bottom:12px}
.crumbs,.breadcrumb{font-size:.8rem;color:var(--muted);margin-bottom:18px}
.crumbs a,.breadcrumb a{color:var(--ink-soft);text-decoration:underline;text-decoration-color:var(--line)}
.grid,.card-grid,.v7-grid,.urgent-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px;margin-top:24px}
.grid{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.urgent-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.symptom-grid,.trust-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:24px}
.card,.mega-card,.v7-card,.fact-card,.urgent-card,.trust-item,.symptom{
 background:rgba(248,241,226,.82);border:1px solid var(--line);border-radius:var(--radius);
 padding:22px;box-shadow:var(--shadow-sm)
}
a.card:hover,a.mega-card:hover,a.v7-card:hover,.urgent-card:hover{transform:translateY(-2px);border-color:#a9865d;background:#fbf5e8}
.mega-card p,.v7-card p{font-size:.94rem}
.notice,.v7-notice,.price-box,.answer-first{
 border-left:3px solid var(--accent);background:#eadfc9;padding:20px 22px;border-radius:var(--radius-sm);margin:22px 0
}
.v7-danger,.danger-box{border-left-color:var(--danger);background:var(--danger-bg)}
.v7-danger strong{color:var(--danger)}
.btn,.v7-btn{font-family:var(--font-display);font-weight:700;padding:13px 20px;border-radius:10px;
 display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);
 transition:.18s ease}
.btn-primary,.v7-btn.primary{background:var(--accent);color:#fffaf0;border-color:var(--accent)}
.btn-secondary,.v7-btn.secondary{background:var(--paper-card);color:var(--ink);border-color:var(--line)}
.btn:hover,.v7-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.content-grid{display:grid;grid-template-columns:1.45fr .75fr;gap:28px}
.two-col{display:grid;grid-template-columns:1.3fr .7fr;gap:40px}
.side-box,.local-box{background:var(--paper-card);border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.side-box{position:sticky;top:96px;height:fit-content}
.side-box a{display:block;padding:10px 0;border-bottom:1px solid var(--line);color:var(--ink-soft)}
.faq-item{border-top:1px solid var(--line);padding:18px 0}
.faq-item h3,.faq-q{color:var(--accent)}
table{border-collapse:collapse;width:100%;background:var(--paper-card)}
th,td{border:1px solid var(--line);padding:11px;text-align:left}
th{font-family:var(--font-display);background:#e8dcc4}
code,pre{background:#e6dbc7;color:#3c3024;border:1px solid var(--line);border-radius:8px}
pre{padding:18px;overflow:auto}
.v7-footer{background:#3f3326;color:#eadfce;padding:42px 0}
.v7-footer p,.v7-footer a{color:#d8cbb8}
.v7-mobilebar{display:none!important}
.mega-search{display:flex;gap:10px;margin-top:22px;max-width:760px}
.mega-search input{flex:1;padding:15px 17px;border:1px solid var(--line);border-radius:10px;background:#fbf5e8;color:var(--ink);font:inherit}
.mega-search button{padding:0 18px;border:0;border-radius:10px;background:var(--accent);color:#fff;font-weight:700}
.ai-shell{display:grid;grid-template-columns:260px 1fr;gap:18px;margin-top:24px}
.ai-panel,.ai-chat{background:var(--paper-card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.ai-panel{padding:18px}
.ai-panel button{display:block;width:100%;text-align:left;padding:11px;border:1px solid transparent;background:transparent;border-radius:8px;color:var(--ink-soft);cursor:pointer}
.ai-panel button:hover,.ai-panel button.active{background:#eadfc9;border-color:var(--line);color:var(--ink)}
.ai-chat{min-height:460px;padding:22px;display:flex;flex-direction:column}
.ai-messages{flex:1;display:flex;flex-direction:column;gap:12px}
.ai-msg{max-width:82%;padding:13px 16px;border-radius:12px;background:#eadfc9;color:var(--ink-soft)}
.ai-msg.user{align-self:flex-end;background:#d6c3a4;color:#30261c}
.ai-input{display:flex;gap:9px;margin-top:18px}
.ai-input input{flex:1;padding:13px;border:1px solid var(--line);border-radius:9px;background:#fffaf0;font:inherit}
.ai-input button{border:0;border-radius:9px;background:var(--accent);color:#fff;padding:0 18px;font-weight:700}
.knowledge-map{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:22px}
.knowledge-node{padding:17px;background:#f8f1e2;border:1px solid var(--line);border-radius:10px}
.knowledge-node small{display:block;color:var(--muted);margin-top:4px}
@media(max-width:850px){.grid,.v7-grid,.urgent-grid{grid-template-columns:1fr 1fr}.symptom-grid,.trust-strip,.knowledge-map{grid-template-columns:1fr 1fr}.content-grid,.two-col,.ai-shell{grid-template-columns:1fr}}
@media(max-width:560px){.wrap{padding:0 18px}.grid,.v7-grid,.urgent-grid,.symptom-grid,.trust-strip,.knowledge-map{grid-template-columns:1fr}.mega-hero,.zone-hero,.v7-hero{padding:48px 0 40px}.ai-chat{min-height:400px}}


/* SEO/local-contact enhancement: one consistent business NAP and mobile conversion bar */
.seo-contact-bar{display:flex;align-items:center;justify-content:center;gap:.7rem;flex-wrap:wrap;padding:.7rem 1rem;background:#0c1c17;color:#fff;font-size:.95rem}
.seo-contact-bar a{color:inherit;text-decoration:none;font-weight:700}
.seo-contact-bar .seo-call,.seo-contact-bar .seo-wa{padding:.5rem .8rem;border-radius:999px}
.seo-contact-bar .seo-call{background:#fff;color:#0c1c17}
.seo-contact-bar .seo-wa{background:#b7ef4a;color:#0c1c17}
.seo-zone-intro{max-width:820px}
.seo-zone-meta{display:flex;gap:.6rem;flex-wrap:wrap;margin:.8rem 0 0}
.seo-zone-meta span{padding:.35rem .65rem;border:1px solid rgba(255,255,255,.18);border-radius:999px}
@media(max-width:700px){
  .seo-contact-bar{position:fixed;left:0;right:0;bottom:0;z-index:9999;box-shadow:0 -6px 20px rgba(0,0,0,.18);padding:.55rem .65rem}
  .seo-contact-bar .seo-label{display:none}
  body{padding-bottom:64px}
}


/* V8 HYBRID AI */
.ai-quick{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}
.ai-quick button{border:1px solid var(--line);background:var(--paper-card);color:var(--ink);border-radius:999px;padding:9px 13px;cursor:pointer}
.ai-quick button:hover{border-color:var(--accent);transform:translateY(-1px)}
.ai-status{font-size:.78rem;color:var(--muted);margin-top:12px;line-height:1.4}
.ai-safety{margin-top:14px;padding:10px 12px;border-radius:9px;font-weight:700;font-size:.86rem}
.ai-safety.normal{background:#e7eddc;color:#3b5524}
.ai-safety.alta{background:#f2e3c3;color:#7a4d13}
.ai-safety.critica{background:#f4d7d0;color:#7c2318}
.ai-sources{margin-top:16px}
.ai-sources strong{display:block;font-size:.82rem;margin-bottom:5px}
.ai-sources a{display:block;padding:7px 0;border-bottom:1px solid var(--line);font-size:.82rem;color:var(--ink-soft)}
.ai-meta{display:block;margin-top:7px;font-size:.72rem;opacity:.65}
.ai-panel hr{border:0;border-top:1px solid var(--line);margin:16px 0}


/* =========================================================
   V9 — MOBILE-FIRST ADAPTIVE ENGINE
   Designed for phones first, then tablets/desktops.
   No horizontal overflow, safe viewport handling, large
   touch targets, readable text and adaptive AI chat.
   ========================================================= */

:root{
  --mobile-gutter: clamp(14px, 4vw, 28px);
  --mobile-touch: 48px;
}

/* Safe areas for modern phones */
html{
  overflow-x:hidden;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{
  overflow-x:hidden;
  width:100%;
  min-width:0;
  padding-bottom:env(safe-area-inset-bottom);
}
img,svg,video,iframe{
  max-width:100%;
  height:auto;
}
button,a,input,textarea,select{
  touch-action:manipulation;
}
a,button{
  -webkit-tap-highlight-color:transparent;
}

/* Global containers */
.wrap{
  width:min(1180px, calc(100% - (var(--mobile-gutter) * 2)));
  margin-inline:auto;
}
.v7-header,
.v7-nav,
.v7-links,
.v7-hero,
.v7-grid,
.ai-shell,
.content-grid,
.knowledge-map{
  min-width:0;
  max-width:100%;
}

/* Mobile header */
.v7-nav{
  min-height:64px;
  padding-left:max(var(--mobile-gutter), env(safe-area-inset-left));
  padding-right:max(var(--mobile-gutter), env(safe-area-inset-right));
  gap:12px;
}
.v7-logo{
  min-width:0;
  max-width:calc(100% - 58px);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.menu-toggle{
  display:none;
  min-width:var(--mobile-touch);
  min-height:var(--mobile-touch);
  border:0;
  border-radius:12px;
}

/* Contact bar: wraps instead of overflowing */
.seo-contact-bar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:8px 12px;
  padding:8px var(--mobile-gutter);
  text-align:center;
}
.seo-contact-bar a{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* Hero typography scales automatically */
.v7-hero h1{
  font-size:clamp(2rem, 8vw, 4.5rem);
  line-height:1.02;
  overflow-wrap:anywhere;
}
.v7-hero p,
.v7-card p,
.content-grid p{
  overflow-wrap:anywhere;
}
.v7-cta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.v7-btn{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* AI interface */
.ai-shell{
  display:grid;
  grid-template-columns:minmax(220px,280px) minmax(0,1fr);
  gap:16px;
}
.ai-chat,
.ai-panel,
.ai-messages{
  min-width:0;
}
.ai-messages{
  overflow-wrap:anywhere;
}
.ai-msg{
  max-width:min(90%, 760px);
  overflow-wrap:anywhere;
}
.ai-input{
  display:flex;
  gap:8px;
}
.ai-input input{
  min-width:0;
  flex:1;
  min-height:52px;
}
.ai-input button{
  min-width:110px;
  min-height:52px;
}
.ai-panel button{
  min-height:46px;
}

/* Cards and grids never create horizontal scrolling */
.v7-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.content-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(220px,320px);
  gap:24px;
}
.knowledge-map{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.knowledge-node{
  min-width:0;
  overflow-wrap:anywhere;
}

/* Phones */
@media (max-width: 760px){
  :root{
    --mobile-gutter:16px;
  }

  .v7-header{
    position:relative;
  }
  .v7-nav{
    min-height:60px;
  }
  .v7-links{
    display:none;
  }
  .menu-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-left:auto;
  }

  .seo-contact-bar{
    font-size:.86rem;
    justify-content:stretch;
  }
  .seo-label{
    width:100%;
  }
  .seo-call,
  .seo-wa{
    flex:1 1 140px;
  }

  .v7-hero{
    padding-top:clamp(32px, 10vw, 72px);
    padding-bottom:clamp(30px, 9vw, 64px);
  }
  .v7-hero h1{
    max-width:100%;
    letter-spacing:-.025em;
  }

  .v7-cta{
    flex-direction:column;
  }
  .v7-btn{
    width:100%;
  }

  .v7-grid,
  .content-grid,
  .ai-shell{
    grid-template-columns:1fr;
  }

  .ai-panel{
    order:2;
  }
  .ai-chat{
    order:1;
  }

  .ai-quick{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .ai-quick button{
    min-height:48px;
    border-radius:14px;
    padding:9px 8px;
    font-size:.86rem;
  }

  .ai-messages{
    min-height:280px;
    max-height:52vh;
  }
  .ai-msg{
    max-width:94%;
    padding:12px 13px;
  }
  .ai-input{
    position:sticky;
    bottom:0;
    z-index:20;
    padding:8px 0 calc(8px + env(safe-area-inset-bottom));
    background:var(--paper, #fff);
  }
  .ai-input input{
    font-size:16px; /* prevents iOS zoom */
  }
  .ai-input button{
    min-width:92px;
  }

  .knowledge-map{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .side-box a{
    min-height:48px;
    display:flex;
    align-items:center;
  }
}

/* Very small phones */
@media (max-width:390px){
  :root{
    --mobile-gutter:12px;
  }
  .ai-quick{
    grid-template-columns:1fr;
  }
  .ai-input{
    gap:6px;
  }
  .ai-input button{
    min-width:82px;
    padding-inline:10px;
  }
  .knowledge-map{
    grid-template-columns:1fr;
  }
  .seo-call,.seo-wa{
    flex-basis:100%;
  }
}

/* Landscape phones */
@media (max-height:520px) and (orientation:landscape){
  .v7-hero{
    padding-block:24px;
  }
  .ai-messages{
    max-height:45vh;
  }
}

/* Tablets */
@media (min-width:761px) and (max-width:1020px){
  .v7-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .knowledge-map{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* Accessibility / motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto !important;
    transition-duration:.001ms !important;
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
  }
}

/* Avoid text clipping and fixed-width leftovers */
pre,code,table{
  max-width:100%;
}
pre{
  overflow:auto;
}
table{
  display:block;
  overflow-x:auto;
}
input,textarea,select{
  max-width:100%;
}

@media (max-width:760px){
  .v7-links.mobile-open{
    display:flex;
    position:absolute;
    left:0;
    right:0;
    top:100%;
    z-index:100;
    flex-direction:column;
    gap:2px;
    padding:10px var(--mobile-gutter) 14px;
    background:var(--paper,#fff);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    box-shadow:0 12px 24px rgba(0,0,0,.08);
  }
  .v7-links.mobile-open a{
    min-height:48px;
    display:flex;
    align-items:center;
    padding:8px 10px;
    border-radius:10px;
  }
}
