
*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,Helvetica,sans-serif}body{background:#f4f5f7;color:#071226;overflow-x:hidden}a{text-decoration:none;color:inherit}.banner{background:#000;line-height:0}.banner img{width:100%;display:block}.menu{min-height:92px;background:#030303;display:flex;align-items:center;justify-content:center;position:sticky;top:0;z-index:50;border-top:1px solid #222;border-bottom:1px solid #222}.menu-inner{display:flex;align-items:center;gap:28px;max-width:1500px;overflow-x:auto}.menu a{color:white;text-transform:uppercase;font-weight:900;font-size:18px;letter-spacing:1px;padding:0 24px;border-right:1px solid #333}.menu a.active,.menu a:hover{color:#ed1c24}.icons{color:#ed1c24;font-size:32px;display:flex;gap:24px}.container{max-width:1380px;margin:0 auto}main{padding:54px 7% 90px}.btn{display:inline-block;background:#ed1c24;color:white;border-radius:999px;padding:14px 26px;text-transform:uppercase;font-weight:900;letter-spacing:.8px}.btn.secondary{background:#151923}.hero{display:grid;grid-template-columns:380px 1fr;gap:34px;background:linear-gradient(135deg,#050505,#151923);color:white;border-radius:28px;padding:34px;box-shadow:0 20px 44px rgba(0,0,0,.22);margin-bottom:64px}.hero-cover{height:430px;border-radius:22px;overflow:hidden}.hero-cover img{width:100%;height:100%;object-fit:cover}.eyebrow{color:#ed1c24;text-transform:uppercase;font-weight:900;letter-spacing:1px;margin-bottom:12px;display:block}.hero h1{font-size:46px;line-height:1.05;margin-bottom:16px}.hero p{color:#cbd5e1;font-size:18px;line-height:1.7;margin-bottom:22px}.actions{display:flex;gap:14px;flex-wrap:wrap}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}.section-head h2{font-size:31px}.section-head p{color:#64748b;margin-top:6px}.grid{display:grid;grid-template-columns:repeat(6,1fr);gap:24px}.card{background:white;border-radius:18px;overflow:hidden;box-shadow:0 12px 30px rgba(15,23,42,.11);transition:.25s}.card:hover{transform:translateY(-7px)}.cover{height:260px;position:relative;overflow:hidden;background:#111827}.cover img{width:100%;height:100%;object-fit:cover}.badge{position:absolute;top:12px;left:12px;background:#ed1c24;color:white;font-size:11px;font-weight:900;text-transform:uppercase;padding:7px 10px;border-radius:999px}.info{padding:17px}.info span{color:#ed1c24;text-transform:uppercase;font-weight:900;font-size:11px}.info h3{font-size:17px;margin:8px 0 7px;line-height:1.25}.info p{color:#64748b;font-size:13px}.work-body{background:#0b0f17;color:white}.work-main{padding:52px 7% 80px}.work{max-width:1250px;margin:0 auto;display:grid;grid-template-columns:360px 1fr;gap:42px;background:#111827;border-radius:28px;padding:34px}.work-cover{height:520px;border-radius:20px;overflow:hidden}.work-cover img{width:100%;height:100%;object-fit:cover}.work h1{font-size:46px}.meta{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}.meta span{background:#0b0f17;border:1px solid #222;padding:10px 14px;border-radius:999px;font-weight:800}.desc{color:#d1d5db;font-size:18px;line-height:1.75;margin:24px 0}.chapters{max-width:1250px;margin:36px auto 0;background:#111827;border-radius:24px;padding:28px}.chapter{display:flex;justify-content:space-between;background:#0b0f17;border:1px solid #222;padding:18px 20px;border-radius:14px;margin-bottom:12px;color:white;font-weight:800}.chapter:hover{border-color:#ed1c24}.reader-body{background:#050505;color:white}.reader-top{background:#000;display:flex;justify-content:space-between;align-items:center;padding:14px 22px;position:sticky;top:0;z-index:99;border-bottom:1px solid #222}.reader-btn{background:#151515;color:white;border:1px solid #333;padding:10px 14px;border-radius:999px;font-weight:900;cursor:pointer}.reader-title{text-align:center}.reader-title span{display:block;color:#999;font-size:12px}.reader{max-width:760px;margin:0 auto;padding:20px 0 40px}.episode-info{text-align:center;padding:22px 18px 28px;color:#aaa}.episode-info h1{color:white;font-size:28px;margin-bottom:8px}.page img{width:100%;display:block;margin:0 auto;background:white}.reader-footer{max-width:760px;margin:24px auto 70px;display:flex;gap:12px;padding:0 14px}.reader-footer a{flex:1;text-align:center;background:#151515;border:1px solid #333;border-radius:999px;padding:14px;color:white;font-weight:900}footer{background:#030303;color:#d1d5db;text-align:center;padding:45px 20px}footer strong{color:#ed1c24;font-size:24px;letter-spacing:2px}footer p{margin-top:10px}@media(max-width:1280px){.grid{grid-template-columns:repeat(3,1fr)}.menu{justify-content:flex-start}.menu-inner{width:max-content}.menu a{font-size:15px;padding:0 18px;white-space:nowrap}}@media(max-width:880px){main,.work-main{padding:34px 22px 75px}.hero,.work{grid-template-columns:1fr}.hero h1,.work h1{font-size:34px}.grid{grid-template-columns:repeat(2,1fr)}.section-head{flex-direction:column;align-items:flex-start;gap:14px}.reader{max-width:100%;padding-top:0}.reader-top{gap:8px}.reader-title{font-size:13px}}@media(max-width:520px){.grid{grid-template-columns:1fr}.cover{height:390px}.hero-cover,.work-cover{height:420px}.reader-footer{flex-direction:column}}

.chapter-placeholder{
  max-width: 900px;
  margin: 30px auto 60px;
  padding: 38px 24px;
  text-align: center;
  border: 1px dashed rgba(255,255,255,.25);
  border-radius: 18px;
  background: rgba(255,255,255,.04);
  color: #f5f0ea;
}
.chapter-placeholder h2{
  margin-bottom: 12px;
  font-size: 28px;
}
.chapter-placeholder p{
  margin: 8px 0;
  opacity: .86;
}
.chapter-placeholder .path{
  margin-top: 18px;
  padding: 12px;
  border-radius: 10px;
  background: rgba(0,0,0,.28);
  font-size: 14px;
  word-break: break-all;
}


/* Leitor vertical - páginas do capítulo */
.reader .page { width: 100%; margin: 0 auto; padding: 0; }
.reader .page img { width: 100%; max-width: 980px; height: auto; display: block; margin: 0 auto; }

/* Ajustes mobile - Alcateia beta */
@media (max-width: 768px){
  .banner{
    height: 205px;
    overflow: hidden;
    background: #000;
  }
  .banner img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    display: block;
  }
  .menu{
    min-height: auto;
    height: auto;
    justify-content: center;
    overflow: hidden;
  }
  .menu-inner{
    width: 100%;
    max-width: 100%;
    gap: 0;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
  }
  .menu a{
    min-width: 0;
    text-align: center;
    font-size: 11px;
    letter-spacing: .45px;
    padding: 13px 3px;
    border-right: 1px solid #222;
    border-bottom: 1px solid #171717;
    white-space: nowrap;
  }
  .menu a:nth-of-type(-n+4){
    flex: 1 1 25%;
  }
  .menu a:nth-of-type(n+5){
    flex: 1 1 33.333%;
  }
  .menu .icons{
    display: none;
  }
  main{
    padding: 18px 14px 64px;
  }
  .container{
    width: 100%;
  }
  .hero{
    margin-bottom: 34px;
    padding: 18px;
    border-radius: 20px;
    gap: 18px;
  }
  .hero-cover{
    height: 350px;
    border-radius: 16px;
  }
  .hero h1{
    font-size: 27px;
    line-height: 1.12;
  }
  .hero p{
    font-size: 15px;
    line-height: 1.55;
  }
  .actions .btn,
  .btn{
    padding: 12px 18px;
    font-size: 12px;
  }
  .section-head{
    margin-bottom: 18px;
  }
  .section-head h2{
    font-size: 24px;
  }
  .grid{
    gap: 18px;
  }
  .card{
    border-radius: 16px;
  }
  .cover{
    height: 360px;
  }
  .info{
    padding: 15px;
  }
}

@media (max-width: 420px){
  .banner{
    height: 185px;
  }
  .menu a{
    font-size: 10px;
    padding: 12px 2px;
    letter-spacing: .2px;
  }
  main{
    padding-top: 18px;
  }
  .hero-cover{
    height: 330px;
  }
  .cover{
    height: 340px;
  }
}


/* Mobile header com busca e menu lateral */
.mobile-topbar,
.mobile-search-panel,
.mobile-menu-panel,
.mobile-backdrop{display:none;}

@media (max-width: 768px){
  body{padding-top:64px;}
  .banner{display:none;}
  .menu{display:none;}
  .mobile-topbar{
    position:fixed;
    top:0;
    left:0;
    right:0;
    height:64px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 16px;
    background:#030303;
    color:#fff;
    border-bottom:1px solid #1f1f1f;
    z-index:300;
  }
  .mobile-brand{
    font-size:18px;
    font-weight:900;
    letter-spacing:.2px;
    color:#fff;
  }
  .mobile-actions{
    display:flex;
    align-items:center;
    gap:14px;
  }
  .mobile-icon{
    appearance:none;
    border:0;
    background:transparent;
    color:#ed1c24;
    font-size:30px;
    line-height:1;
    font-weight:900;
    cursor:pointer;
    padding:6px;
  }
  .mobile-search-open{font-size:34px; transform: translateY(-1px);}
  .mobile-backdrop{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.62);
    z-index:320;
  }
  body.mobile-search-active .mobile-backdrop,
  body.mobile-menu-active .mobile-backdrop{display:block;}
  .mobile-search-panel,
  .mobile-menu-panel{
    position:fixed;
    top:0;
    right:0;
    width:min(88vw,380px);
    height:100vh;
    display:block;
    background:#070707;
    color:#fff;
    z-index:340;
    padding:18px;
    transform:translateX(105%);
    transition:transform .22s ease;
    box-shadow:-14px 0 30px rgba(0,0,0,.45);
    overflow-y:auto;
  }
  body.mobile-search-active .mobile-search-panel,
  body.mobile-menu-active .mobile-menu-panel{transform:translateX(0);}
  .mobile-panel-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:18px;
    padding-bottom:14px;
    border-bottom:1px solid #222;
  }
  .mobile-panel-head strong{
    text-transform:uppercase;
    letter-spacing:1px;
    color:#ed1c24;
    font-size:16px;
  }
  .mobile-close{
    border:0;
    background:#151515;
    color:#fff;
    width:38px;
    height:38px;
    border-radius:50%;
    font-size:28px;
    line-height:1;
    cursor:pointer;
  }
  .mobile-search-input{
    width:100%;
    border:1px solid #2d2d2d;
    background:#111;
    color:#fff;
    border-radius:14px;
    padding:14px 15px;
    font-size:16px;
    outline:none;
    margin-bottom:16px;
  }
  .mobile-search-input:focus{border-color:#ed1c24;}
  .mobile-result{
    display:block;
    padding:14px 12px;
    border:1px solid #1e1e1e;
    background:#0f0f0f;
    border-radius:14px;
    margin-bottom:10px;
  }
  .mobile-result strong{
    display:block;
    color:#fff;
    font-size:15px;
    line-height:1.3;
  }
  .mobile-result span{
    display:block;
    margin-top:6px;
    color:#9ca3af;
    font-size:12px;
    line-height:1.35;
  }
  .mobile-no-results{
    color:#9ca3af;
    padding:10px 2px;
  }
  .mobile-menu-panel a{
    display:block;
    padding:15px 12px;
    margin-bottom:8px;
    border-radius:14px;
    background:#0f0f0f;
    border:1px solid #1e1e1e;
    color:#fff;
    font-weight:900;
    letter-spacing:.2px;
  }
  .mobile-menu-panel a:hover,
  .mobile-result:hover{
    border-color:#ed1c24;
    background:#141414;
  }
  main{padding-top:18px;}
  .work-main{padding-top:22px;}
}

@media (max-width: 420px){
  .mobile-brand{font-size:17px;}
  .mobile-icon{font-size:28px;}
  .mobile-search-open{font-size:32px;}
}


/* FORCE MOBILE HEADER V2 - cache-busted */
@media (max-width: 768px){
  html, body{overflow-x:hidden !important;}
  body{padding-top:64px !important;}
  header.banner, .banner, nav.menu, .menu{display:none !important;}
  .mobile-topbar{display:flex !important; position:fixed !important; top:0 !important; left:0 !important; right:0 !important; height:64px !important; z-index:9999 !important; background:#030303 !important; color:#fff !important; align-items:center !important; justify-content:space-between !important; padding:0 16px !important; border-bottom:1px solid #222 !important;}
  .mobile-brand{display:block !important; font-size:18px !important; font-weight:900 !important; color:#fff !important;}
  .mobile-actions{display:flex !important; align-items:center !important; gap:14px !important;}
  .mobile-icon{display:inline-flex !important; align-items:center !important; justify-content:center !important; border:0 !important; background:transparent !important; color:#ed1c24 !important; font-size:28px !important; min-width:36px !important; min-height:36px !important;}
  .mobile-search-panel,.mobile-menu-panel{display:block !important;}
}


/* Ajuste menu mobile: sem emojis e com aba Concluídos */
.page-heading{background:linear-gradient(135deg,#050505,#151923);color:white;border-radius:28px;padding:34px;margin-bottom:28px;}
.page-heading h1{font-size:46px;line-height:1.05;margin:8px 0 12px;}
.page-heading p{color:#cbd5e1;font-size:18px;line-height:1.6;}
.completed-empty{background:white;border-radius:22px;padding:34px;box-shadow:0 12px 30px rgba(15,23,42,.11);}
.completed-empty h2{font-size:28px;margin-bottom:10px;color:#071226;}
.completed-empty p{color:#64748b;margin-bottom:22px;line-height:1.6;}
@media(max-width:768px){
  .mobile-menu-panel a{font-size:19px !important;padding:17px 16px !important;}
  .page-heading{border-radius:22px;padding:26px 22px;margin-bottom:20px;}
  .page-heading h1{font-size:34px;}
  .completed-empty{padding:26px 22px;border-radius:18px;}
}


/* Desktop: busca e menu sem emojis + Concluídos */
.desktop-icons{display:flex;align-items:center;gap:18px;color:#ed1c24;}
.desktop-icon{appearance:none;border:0;background:transparent;color:#ed1c24;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;cursor:pointer;padding:0;transition:transform .18s ease, opacity .18s ease;}
.desktop-icon:hover{transform:translateY(-1px);opacity:.88;}
.search-glyph{position:relative;width:21px;height:21px;border:3px solid #ed1c24;border-radius:50%;display:inline-block;}
.search-glyph:after{content:"";position:absolute;width:12px;height:3px;background:#ed1c24;right:-10px;bottom:-5px;transform:rotate(-45deg);border-radius:3px;}
.hamburger-glyph{position:relative;width:34px;height:24px;display:inline-block;}
.hamburger-glyph:before,.hamburger-glyph:after,.hamburger-glyph span{content:"";position:absolute;left:0;width:34px;height:4px;background:#ed1c24;border-radius:3px;}
.hamburger-glyph:before{top:0;}
.hamburger-glyph:after{bottom:0;}
.hamburger-glyph{background:linear-gradient(#ed1c24,#ed1c24) left 10px/34px 4px no-repeat;}

/* Painéis também funcionam no desktop */
body.mobile-search-active .mobile-backdrop,
body.mobile-menu-active .mobile-backdrop{display:block;}
body.mobile-search-active .mobile-search-panel,
body.mobile-menu-active .mobile-menu-panel{display:block;transform:translateX(0);}
.mobile-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.62);z-index:320;}
.mobile-search-panel,.mobile-menu-panel{position:fixed;top:0;right:0;width:min(420px,88vw);height:100vh;background:#070707;color:#fff;z-index:340;padding:22px;box-shadow:-14px 0 30px rgba(0,0,0,.45);overflow-y:auto;transform:translateX(105%);transition:transform .22s ease;}
.mobile-panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid #222;}
.mobile-panel-head strong{text-transform:uppercase;letter-spacing:1px;color:#ed1c24;font-size:16px;}
.mobile-close{border:0;background:#151515;color:#fff;width:38px;height:38px;border-radius:50%;font-size:28px;line-height:1;cursor:pointer;}
.mobile-search-input{width:100%;border:1px solid #2d2d2d;background:#111;color:#fff;border-radius:14px;padding:14px 15px;font-size:16px;outline:none;margin-bottom:16px;}
.mobile-search-input:focus{border-color:#ed1c24;}
.mobile-result{display:block;padding:14px 12px;border:1px solid #1e1e1e;background:#0f0f0f;border-radius:14px;margin-bottom:10px;}
.mobile-result strong{display:block;color:#fff;font-size:15px;line-height:1.3;}
.mobile-result span{display:block;margin-top:6px;color:#9ca3af;font-size:12px;line-height:1.35;}
.mobile-no-results{color:#9ca3af;padding:10px 2px;}
.mobile-menu-panel a{display:block;padding:15px 12px;margin-bottom:8px;border-radius:14px;background:#0f0f0f;border:1px solid #1e1e1e;color:#fff;font-weight:900;letter-spacing:.2px;}
.mobile-menu-panel a:hover,.mobile-result:hover{border-color:#ed1c24;background:#141414;}

@media(max-width:768px){
  .desktop-icons{display:none !important;}
}
