/*
Theme Name: Acrotel
Theme URI: https://acrotel.cl/
Author: Acrotel
Description: Tema propio de Acrotel — Recursos Humanos. Incluye portada con slider, servicios, blog, páginas internas y formulario de contacto.
Version: 1.0.0
Requires at least: 5.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: acrotel
*/

*{box-sizing:border-box}
body{margin:0;background:#fff;color:#777;font-family:Ubuntu,sans-serif;font-size:15px;line-height:1.75}
a{color:#00679f;text-decoration:none}
a:hover{color:#ff2d37}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #00679f;outline-offset:2px}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{font-family:Ubuntu,sans-serif}
.wrap{max-width:1124px;margin:0 auto}

/* Barra superior */
.topbar{background:#00679f}
.topbar__in{padding:6px 16px;display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:flex-end;font-size:14px;font-weight:500;line-height:1.4}
.topbar a{color:#fff;display:flex;align-items:center;gap:5px}
.topbar a:hover{color:#fff;opacity:.85}

/* Header */
.site-header{background:#fff;border-bottom:1px solid #eee;position:sticky;top:0;z-index:50}
.admin-bar .site-header{top:32px}
.site-header__in{display:flex;align-items:stretch;flex-wrap:wrap}
.brand{display:flex;align-items:center;padding:12px 30px 12px 20px;border-right:1px solid #eee}
.brand img{height:64px;width:auto}
.nav{flex:1;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px 28px;padding:12px 24px;font-size:15px;letter-spacing:-.02em;line-height:1.4}
.nav a.is-active{color:#ff2d37}
.social{display:flex;gap:6px;border-left:1px solid #e5e5e5;padding-left:16px}
.social a{width:30px;height:30px;border-radius:50%;box-shadow:0 2px 2px rgba(0,0,0,.1);display:flex;align-items:center;justify-content:center;color:#333;font-weight:700;font-size:13px}
.nav-toggle{display:none;margin-left:auto;align-self:center;margin-right:16px;background:none;border:1px solid #ddd;border-radius:3px;padding:8px 12px;font:inherit;color:#00679f;cursor:pointer}
@media (max-width:900px){
  .nav-toggle{display:block}
  .nav{display:none;flex-basis:100%;flex-direction:column;align-items:flex-start;border-top:1px solid #eee}
  .nav.is-open{display:flex}
  .social{border-left:0;padding-left:0}
  .brand{border-right:0}
}

/* Botones */
.btn-red{background:#ff2d37;color:#fff;border:0;border-radius:999px;padding:12px 34px;font:inherit;font-size:17px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;display:inline-flex;align-items:center;gap:8px;cursor:pointer;line-height:1.3}
.btn-red:hover{background:#e01e28;color:#fff}
.btn-red--sm{padding:10px 26px;font-size:14px}
.btn-white{background:#fff;color:#555;border-radius:999px;padding:12px 32px;font-size:16px;letter-spacing:.03em;display:inline-block;line-height:1.3}
.btn-white:hover{background:#f0f0f0;color:#00679f}
.btn-outline{border:1px solid #00679f;border-radius:999px;padding:10px 22px;font-size:14px;display:inline-block;line-height:1.3}
.btn-outline:hover{background:#00679f;color:#fff}

/* Slider */
.hero{position:relative;height:clamp(460px,72vh,820px);overflow:hidden;background:#f3f3f3}
.hero__slide{position:absolute;inset:0;opacity:0;transition:opacity .8s ease;pointer-events:none}
.hero__slide.is-active{opacity:1;pointer-events:auto}
.hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero__in{position:relative;height:100%;max-width:1200px;margin:0 auto;padding:0 96px;display:flex;align-items:center;gap:60px}
.hero__text{display:flex;flex-direction:column;gap:16px;max-width:580px}
.hero__text h1,.hero__text h2{margin:0;color:#00679f;font-weight:700;font-size:clamp(34px,4vw,52px);line-height:1.08;letter-spacing:-.01em}
.hero__text p{margin:0;color:#555;font-weight:500;font-size:clamp(18px,1.6vw,24px);letter-spacing:.02em;line-height:1.4}
.hero__ctas{display:flex;flex-direction:column;gap:20px;margin-top:12px}
.hero__logo{width:clamp(240px,28vw,460px);mix-blend-mode:multiply}
.hero--center .hero__in{justify-content:center}
.hero--right .hero__in{justify-content:flex-end}
.hero--left .hero__in{justify-content:flex-start}
.hero--alignright .hero__text,.hero--alignright .hero__ctas{align-items:flex-end;text-align:right}
.hero__text,.hero__ctas{align-items:flex-start}
.hero__arrow{position:absolute;top:50%;transform:translateY(-50%);width:56px;height:56px;border-radius:50%;border:0;background:rgba(255,255,255,.6);color:#555;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2}
.hero__arrow:hover{background:rgba(0,0,0,.25);color:#fff}
.hero__arrow--prev{left:24px}.hero__arrow--next{right:24px}
@media (max-width:700px){.hero__in{padding:0 28px}.hero__logo{display:none}.hero__arrow{display:none}}

/* Franjas */
.band-blue{background:#00679f;padding:6% 24px}
.band-blue--center .wrap{max-width:780px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:28px}
.band-blue h2{margin:0;color:#fff;font-weight:500;font-size:clamp(26px,2.4vw,32px);letter-spacing:-.04em;line-height:1.2}
.band-blue p{margin:0;color:#fff;font-weight:500;font-size:15px;line-height:1.6}
.section{padding:5% 24px}
.section--gray{background:#f7f7f7}
.title-blue{margin:0;color:#00679f;font-weight:500;font-size:30px;letter-spacing:-.04em;line-height:1.2}
.center{text-align:center}

/* Quiénes somos / layout 2+1 */
.grid-2-1{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:48px;align-items:start}
.grid-2-1>.main{grid-column:span 2;min-width:0;display:flex;flex-direction:column;gap:18px}
@media (max-width:760px){.grid-2-1>.main{grid-column:auto}}
.main p{margin:0}
.main strong{color:#666}

/* Servicios */
.services{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px;margin-top:34px}
.svc{position:relative;height:190px;border-radius:3px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:#fff;background:#333}
.svc--big{grid-column:1/-1;height:clamp(280px,36vw,480px)}
.svc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.svc::after{content:"";position:absolute;inset:0;background:rgba(40,40,40,.68);transition:background .3s}
.svc:hover::after{background:rgba(0,103,159,.72)}
.svc h3{position:relative;z-index:1;margin:0;padding:0 20px;text-align:center;font-weight:700;font-size:18px;letter-spacing:.02em;color:#fff;line-height:1.3}
.svc--big h3{font-size:20px}
.svc span{position:relative;z-index:1;background:#fff;color:#222;border-radius:999px;padding:12px 26px;font-size:11px;font-weight:700;display:flex;align-items:center;gap:8px;line-height:1}
.svc:hover{color:#fff}

/* Blog */
.posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:30px;margin-top:32px}
.post{display:flex;flex-direction:column;gap:14px}
.post__img{display:block;aspect-ratio:4/3;max-height:262px;overflow:hidden}
.post__img img{width:100%;height:100%;object-fit:cover}
.post h3{margin:8px 0 0;font-size:21px;font-weight:700;letter-spacing:.02em;line-height:1.3}
.post h3 a{color:#3a5a80}
.post p{margin:0;font-size:14px}
.post__meta{font-size:13px}
.post__cats{font-size:13px;color:#3a5a80}
.btn-readmore{align-self:flex-start;border:1px solid #ddd;background:#fff;color:#666;padding:5px 8px;font-size:10px;text-transform:uppercase;line-height:1.4}
.btn-readmore:hover{border-color:#00679f;color:#00679f}

/* Cabecera interna */
.page-head{background:#00679f;padding:56px 24px}
.page-head .wrap{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
.page-head a{color:#fff;font-size:13px;letter-spacing:.06em;text-transform:uppercase;opacity:.85}
.page-head a:hover{color:#fff;opacity:1}
.page-head h1{margin:0;color:#fff;font-weight:500;font-size:clamp(28px,3.2vw,40px);line-height:1.15;letter-spacing:-.03em;max-width:900px}

/* Páginas internas */
.subtitle{margin:0;color:#00679f;font-weight:500;font-size:26px;line-height:1.25;letter-spacing:-.03em}
.checklist{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.checklist h3{margin:0;color:#00679f;font-weight:500;font-size:20px;letter-spacing:-.02em;line-height:1.3}
.checklist div{display:flex;gap:10px;align-items:flex-start}
.checklist div::before{content:"✓";color:#ff2d37;font-weight:700}
.figure{margin:8px 0}
.figure figcaption{font-size:13px;color:#00679f;margin-top:6px}
.aside{display:flex;flex-direction:column;gap:20px}
.price-card{background:#fff;border-radius:3px;box-shadow:0 2px 8px rgba(0,0,0,.08);overflow:hidden;text-align:center}
.price-card__head{background:#00679f;color:#fff;padding:14px 16px;font-size:16px;font-weight:500;line-height:1.4}
.price-card__body{padding:26px 20px;display:flex;flex-direction:column;gap:6px;align-items:center;font-size:14px;line-height:1.5}
.price-card__amount{color:#00679f;font-weight:700;font-size:38px;line-height:1.1}
.price-card__notes{width:100%;border-top:1px solid #eee;margin-top:14px;padding-top:14px;display:flex;flex-direction:column;gap:6px}
.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:24px}
.tiers .price-card__amount{font-size:40px}
.cta-box{background:#00679f;border-radius:3px;padding:24px;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.cta-box div{color:#fff;font-size:18px;font-weight:500;line-height:1.3}
.contact-box{background:#f7f7f7;border-radius:3px;padding:22px;display:flex;flex-direction:column;gap:6px;font-size:14px;line-height:1.6}
.contact-box strong{color:#00679f;font-weight:500;font-size:18px}
.contact-box p{margin:6px 0 0}
.cells{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:16px;margin-top:30px}
.cell{position:relative;min-height:170px;border-radius:3px;overflow:hidden;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.06);display:flex;align-items:center;justify-content:center;padding:24px;text-align:center}
.cell img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cell p{position:relative;margin:0;color:#00679f;font-size:16px;font-weight:500;line-height:1.45}
.test-group{background:#00679f;padding:56px 24px;border-bottom:1px solid rgba(255,255,255,.15)}
.test-group h2{margin:0 0 26px;color:#fff;font-weight:500;font-size:28px;letter-spacing:-.03em;text-align:center}
.tests{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:16px}
.test{background:#fff;border-radius:3px;padding:22px;display:flex;flex-direction:column;gap:6px}
.test h3{margin:0;color:#00679f;font-size:18px;font-weight:700;line-height:1.3}
.test small{font-size:13px;color:#999;line-height:1.4}
.test p{margin:0;font-size:14px;line-height:1.65}
.faqs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:40px}
.faqs h3{margin:0 0 12px;color:#00679f;font-size:20px;font-weight:500;letter-spacing:-.02em;line-height:1.3}
.faqs p{margin:0}
.links{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}

/* Contacto */
.form{display:flex;flex-direction:column;gap:16px}
.form__row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:16px}
.form label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:#555;line-height:1.4}
.form input,.form textarea,.form select{border:1px solid #ddd;border-radius:3px;padding:11px 12px;font:inherit;font-size:14px;color:#333;background:#fff}
.form textarea{resize:vertical;min-height:110px}
.form .hp{position:absolute;left:-9999px}
.notice{border-radius:3px;padding:12px 14px;font-size:14px;line-height:1.5}
.notice--ok{background:#eef6fb;color:#00679f}
.notice--err{background:#fdeeee;color:#c4161f}
.contact-info{display:flex;flex-direction:column;gap:10px;font-size:14px;line-height:1.7}
.contact-info strong{color:#00679f}
.contact-links{display:flex;flex-direction:column;gap:8px;margin-top:24px}
.contact-links a{position:relative;height:56px;border-radius:3px;overflow:hidden;display:flex;align-items:center;padding:0 18px;background:#333;color:#fff;font-size:16px;font-weight:700}
.contact-links img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.contact-links a::after{content:"";position:absolute;inset:0;background:rgba(40,40,40,.62)}
.contact-links span{position:relative;z-index:1}
.contact-links a:hover{color:#fff}
.contact-links a:hover::after{background:rgba(0,103,159,.72)}

/* Contenido WordPress genérico */
.entry{font-size:15px}
.entry img{margin:16px 0}

/* Footer */
.site-footer{background:#f7f7f7;border-top:1px solid #e5e5e5}
.site-footer .wrap{padding:28px 24px;display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;justify-content:space-between;font-size:12px;color:#555;line-height:1.5}
.site-footer img{height:38px;width:auto}
.site-footer__info{display:flex;flex-wrap:wrap;gap:6px 20px}
