/*
Theme Name: Peluquería Paco
Theme URI: https://peluqueriapaco.es
Author: Peluquería Paco
Description: Tema WordPress ligero y personalizado para una peluquería de caballeros y niños en Aluche.
Version: 1.5.2
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: peluqueria-paco
*/

:root { --ink:#17201d; --ink-2:#24332e; --cream:#f2eee4; --paper:#fbf8f1; --copper:#aa512f; --copper-on-dark:#d17d5b; --line:rgba(23,32,29,.18); --muted:#5d6662; --font-sans:'Manrope',sans-serif; --font-display:'Cormorant Garamond',serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--font-sans), sans-serif; }
a { color:inherit; text-decoration:none; }
.shell { width:min(1160px, calc(100% - 48px)); margin-inline:auto; }
.header { position:sticky; top:0; z-index:50; background:rgba(251,248,241,.94); border-bottom:1px solid var(--line); backdrop-filter:blur(14px); }
.header__inner { height:88px; display:flex; align-items:center; justify-content:space-between; gap:32px; }
.brand { display:inline-flex; align-items:center; gap:12px; flex:none; }
.brand__mark { display:grid; place-items:center; width:42px; height:50px; color:var(--cream); background:var(--ink); font:italic 600 32px/1 var(--font-display),serif; border-radius:22px 22px 6px 6px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.18); }
.brand__words { display:flex; flex-direction:column; line-height:.9; }
.brand__words b { font-size:9px; letter-spacing:.22em; }
.brand__words em { font:600 25px/1 var(--font-display),serif; letter-spacing:.05em; }
.brand--light { color:var(--cream); }
.brand--light .brand__mark { background:var(--cream); color:var(--ink); }
.desktop-nav { display:flex; align-items:center; gap:30px; margin-left:auto; }
.desktop-nav ul { display:flex; align-items:center; gap:30px; margin:0; padding:0; list-style:none; }
.desktop-nav a { font-size:13px; font-weight:600; transition:color .2s; }
.desktop-nav a:hover { color:var(--copper); }
.button { min-height:48px; padding:0 22px; display:inline-flex; align-items:center; justify-content:center; gap:16px; border-radius:2px; font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; transition:transform .2s, background .2s, color .2s; }
.button:hover { transform:translateY(-2px); }
.button--dark { background:var(--ink); color:var(--cream); }
.button--copper { background:var(--copper); color:white; }
.button--cream { background:var(--cream); color:var(--ink); }
.button--outline { border:1px solid rgba(242,238,228,.45); color:var(--cream); }
.mobile-menu { display:none; }
.hero { position:relative; overflow:hidden; background:var(--ink); color:var(--cream); min-height:calc(100svh - 88px); }
.hero__texture { position:absolute; inset:0; opacity:.22; background:radial-gradient(circle at 78% 35%, #60736c 0 1px, transparent 2px), linear-gradient(110deg, transparent 0 55%, rgba(255,255,255,.04) 55% 56%, transparent 56%); background-size:28px 28px, auto; }
.hero__grid { position:relative; min-height:calc(100svh - 168px); display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:56px; padding-block:70px; }
.hero__copy { position:relative; z-index:2; }
.eyebrow { margin:0 0 24px; font-size:10px; line-height:1.4; font-weight:700; letter-spacing:.22em; text-transform:uppercase; }
.eyebrow:before { content:""; display:inline-block; width:28px; height:1px; margin:0 12px 3px 0; background:currentColor; opacity:.7; }
.hero h1, .page-hero h1 { margin:0; font:600 clamp(64px, 8vw, 118px)/.8 var(--font-display),serif; letter-spacing:-.045em; }
.hero h1 em { color:var(--copper-on-dark); font-weight:500; }
.hero__lead { max-width:610px; margin:38px 0; color:#c8cfca; font-size:17px; line-height:1.8; }
.hero__actions { display:flex; align-items:center; gap:34px; }
.text-link { display:inline-flex; gap:15px; align-items:center; color:var(--cream); padding-bottom:5px; border-bottom:1px solid currentColor; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.text-link--dark { color:var(--ink); }
.hero__visual { justify-self:end; position:relative; width:min(100%,520px); aspect-ratio:.94; border:1px solid rgba(242,238,228,.25); background-image:linear-gradient(90deg,rgba(23,32,29,.08),rgba(23,32,29,0)),url('assets/images/hero-barber.webp'); background-size:cover; background-position:62% center; overflow:hidden; }
.hero__visual:before { content:""; position:absolute; inset:28px; border:1px solid rgba(242,238,228,.18); }
.hero__seal { position:absolute; left:-38px; bottom:70px; width:112px; aspect-ratio:1; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; background:var(--cream); color:var(--ink); border:6px solid var(--ink); outline:1px solid var(--cream); transform:rotate(-7deg); }
.hero__seal b { font-size:12px; letter-spacing:.15em; }
.hero__seal span { font:italic 600 21px/1 var(--font-display),serif; }
.hero__foot { position:relative; min-height:80px; display:grid; grid-template-columns:1fr 1fr auto; align-items:center; border-top:1px solid rgba(242,238,228,.18); color:#aeb8b3; font-size:11px; letter-spacing:.13em; text-transform:uppercase; }
.section { padding-block:120px; }
.intro__grid { display:grid; grid-template-columns:1fr 2fr; gap:70px; }
.intro h2, .section-head h2, .kids-callout h2, .cta h2 { margin:0; font:600 clamp(44px,6vw,74px)/.95 var(--font-display),serif; letter-spacing:-.035em; }
.intro__grid>div>p { max-width:760px; color:var(--muted); font-size:17px; line-height:1.9; margin:32px 0; }
.services-preview { background:var(--cream); }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:65px; }
.service-list { border-top:1px solid var(--line); }
.service-row { min-height:150px; display:grid; grid-template-columns:70px 1fr 1.2fr 30px; align-items:center; gap:36px; border-bottom:1px solid var(--line); }
.service-row>span:first-child { color:var(--copper); font:600 16px/1 var(--font-display),serif; }
.service-row h3 { margin:0; font:600 36px/1 var(--font-display),serif; }
.service-row p { margin:0; color:var(--muted); line-height:1.7; font-size:14px; }
.kids-callout { background:var(--paper); }
.kids-callout__grid { display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:9%; }
.kids-callout__image { position:relative; aspect-ratio:1.15; display:flex; align-items:end; padding:30px; background-image:linear-gradient(0deg,rgba(23,32,29,.75),transparent 55%),url('assets/images/child-haircut.webp'); background-size:cover; background-position:center; color:var(--cream); font:italic 500 30px/1 var(--font-display),serif; }
.image-placeholder { display:flex; align-items:end; padding:30px; background:linear-gradient(145deg,#9b745a,#263a33); color:var(--cream); font:italic 500 30px/1 var(--font-display),serif; }
.kids-callout__copy>p:not(.eyebrow) { color:var(--muted); font-size:16px; line-height:1.9; margin:30px 0; }
.location-strip { padding-block:85px; background:var(--ink-2); color:var(--cream); }
.location-strip__grid { display:grid; grid-template-columns:.7fr 1.5fr auto; align-items:center; gap:45px; }
.location-strip h2 { margin:0; font:500 clamp(34px,4vw,55px)/1 var(--font-display),serif; }
.location-strip h2 span { color:#93a099; font-size:.7em; }
.cta { text-align:center; padding:130px 0; background:var(--copper); color:white; }
.cta__inner { max-width:850px; }
.cta .eyebrow:before { display:none; }
.cta p:not(.eyebrow) { margin:25px 0 36px; color:#fff; }
.footer { padding:80px 0 25px; background:#101714; color:#aeb7b2; }
.footer__top { display:grid; grid-template-columns:1.6fr 1fr .6fr; gap:80px; padding-bottom:70px; }
.footer__top>div:first-child>p { max-width:400px; margin-top:28px; line-height:1.8; font-size:13px; }
.footer h3 { margin:0 0 25px; color:var(--cream); font-size:11px; text-transform:uppercase; letter-spacing:.18em; }
.footer__top>div:not(:first-child) { display:flex; flex-direction:column; align-items:flex-start; gap:13px; font-size:13px; line-height:1.7; }
.footer__kit { padding:28px 0; border-top:1px solid rgba(242,238,228,.12); }
.footer__kit img { display:block; width:100%; height:auto; }
.footer__bottom { padding-top:24px; border-top:1px solid rgba(242,238,228,.12); display:flex; justify-content:space-between; font-size:10px; letter-spacing:.13em; text-transform:uppercase; }
.footer__bottom nav { display:flex; gap:22px; }
.footer__bottom nav a:hover { color:var(--cream); }
.page-hero { padding:110px 0 95px; }
.page-hero--dark { background:var(--ink); color:var(--cream); }
.page-hero--cream { background:var(--cream); }
.page-hero__inner { display:grid; grid-template-columns:1.4fr .6fr; align-items:end; gap:80px; }
.page-hero h1 { font-size:clamp(58px,7vw,100px); max-width:850px; }
.page-hero__intro { margin:0; color:#b4beb9; font-size:15px; line-height:1.9; }
.page-hero--cream .page-hero__intro { color:var(--muted); }
.inner-section { padding-block:120px; }
.service-cards__grid { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.service-cards article { min-height:330px; padding:48px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.service-cards article>span { color:var(--copper); font:600 15px/1 var(--font-display),serif; }
.service-cards h2 { margin:55px 0 20px; font:600 36px/1 var(--font-display),serif; }
.service-cards p { color:var(--muted); line-height:1.8; font-size:14px; }
.process { padding:120px 0; background:var(--ink); color:var(--cream); }
.process__grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; }
.process h2 { font:600 clamp(50px,6vw,78px)/.9 var(--font-display),serif; }
.process h2 em { color:var(--copper-on-dark); }
.process ol { margin:0; padding:0; list-style:none; border-top:1px solid rgba(242,238,228,.2); }
.process li { display:grid; grid-template-columns:60px 1fr; gap:22px; padding:32px 0; border-bottom:1px solid rgba(242,238,228,.2); }
.process li>span { color:var(--copper-on-dark); font:600 15px/1 var(--font-display),serif; }
.process h3 { margin:0 0 10px; font:600 26px/1 var(--font-display),serif; }
.process li p { margin:0; color:#aeb8b3; line-height:1.7; font-size:14px; }
.booking-band { padding:70px 0; background:var(--cream); }
.booking-band__inner { display:flex; align-items:center; justify-content:space-between; gap:40px; }
.booking-band h2 { margin:0; font:600 48px/1 var(--font-display),serif; }
.kids-detail__grid,.story__grid { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:9%; }
.kids-detail__photo,.story__photo { min-height:600px; background-size:cover; background-position:center; }
.kids-detail__photo { background-image:url('assets/images/child-haircut.webp'); }
.story__photo { background-image:url('assets/images/scissors-detail.webp'); }
.kids-detail__copy h2,.story__copy h2,.faq h2 { margin:0; font:600 clamp(46px,5vw,68px)/.95 var(--font-display),serif; }
.kids-detail__copy>p:not(.eyebrow),.story__copy>p:not(.eyebrow) { color:var(--muted); font-size:15px; line-height:1.9; margin:25px 0; }
.kids-benefits { padding:120px 0; background:var(--cream); }
.benefits-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.benefits-grid article { padding:45px 45px 0 0; }
.benefits-grid b { color:var(--copper); font:600 14px/1 var(--font-display),serif; }
.benefits-grid h3 { margin:38px 0 18px; font:600 32px/1 var(--font-display),serif; }
.benefits-grid p { color:var(--muted); font-size:14px; line-height:1.8; }
.faq__grid { display:grid; grid-template-columns:.7fr 1.3fr; gap:90px; }
.faq details { border-top:1px solid var(--line); }
.faq details:last-child { border-bottom:1px solid var(--line); }
.faq summary { cursor:pointer; list-style:none; padding:28px 0; display:flex; justify-content:space-between; gap:20px; font:600 24px/1.2 var(--font-display),serif; }
.faq summary::-webkit-details-marker { display:none; }
.faq details p { margin:0 40px 28px 0; color:var(--muted); line-height:1.8; font-size:14px; }
.values { padding:110px 0; background:var(--cream); }
.values__grid { display:grid; grid-template-columns:.45fr 1.55fr; gap:70px; }
.values__grid>div { display:grid; grid-template-columns:repeat(3,1fr); gap:35px; }
.values article { border-top:1px solid var(--line); padding-top:30px; }
.values article span { color:var(--copper); font:600 14px/1 var(--font-display),serif; }
.values h3 { margin:40px 0 15px; font:600 31px/1 var(--font-display),serif; }
.values article p { color:var(--muted); line-height:1.7; font-size:14px; }
.neighborhood { padding:140px 0; text-align:center; color:var(--cream); background:linear-gradient(rgba(23,32,29,.78),rgba(23,32,29,.86)),url('assets/images/hero-barber.webp') center/cover; }
.neighborhood__inner { max-width:850px; }
.neighborhood .eyebrow:before { display:none; }
.neighborhood h2 { margin:0; font:600 clamp(54px,7vw,90px)/.95 var(--font-display),serif; }
.neighborhood p { max-width:620px; margin:28px auto 35px; color:#c4cdc8; line-height:1.8; }
.contact-block { padding:110px 0; }
.contact-block__grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:9%; align-items:start; }
.contact-item { display:grid; grid-template-columns:130px 1fr 25px; gap:15px; padding:28px 0; border-top:1px solid var(--line); }
.contact-item span,.hours>span { color:var(--muted); font-size:10px; letter-spacing:.18em; text-transform:uppercase; }
.contact-item strong { font:600 26px/1.25 var(--font-display),serif; }
.contact-item i { font-style:normal; color:var(--copper); }
.hours { padding:30px 0 35px; border-top:1px solid var(--line); }
.hours>span { display:block; margin-bottom:22px; }
.hours p { display:flex; justify-content:space-between; gap:20px; margin:10px 0; font-size:13px; }
.hours p b { font-weight:600; }
.hours p em { font-style:normal; color:var(--muted); text-align:right; }
.hours small { display:block; margin-top:20px; color:var(--muted); line-height:1.6; }
.contact-block__map { position:relative; min-height:700px; background:var(--cream); }
.contact-block__map iframe { width:100%; height:700px; border:0; filter:saturate(.55) contrast(1.05); }
.contact-block__map>a { position:absolute; right:20px; bottom:20px; padding:15px 18px; background:var(--ink); color:var(--cream); font-size:11px; font-weight:700; text-transform:uppercase; }
.contact-cta { padding:120px 0; text-align:center; background:var(--copper); color:white; }
.contact-cta .eyebrow:before { display:none; }
.contact-cta h2 { margin:0; font:600 clamp(58px,7vw,90px)/.9 var(--font-display),serif; }
.contact-cta p { color:#fff; }
.contact-cta>a { display:inline-block; margin-top:25px; font:600 34px/1 var(--font-display),serif; border-bottom:1px solid white; }
.legal__grid { display:grid; grid-template-columns:.45fr 1.55fr; gap:90px; align-items:start; }
.legal aside { position:sticky; top:125px; padding-top:22px; border-top:1px solid var(--line); }
.legal aside p { margin:0 0 8px; color:var(--muted); font-size:10px; letter-spacing:.16em; text-transform:uppercase; }
.legal aside strong { font-size:13px; }
.legal article { max-width:760px; }
.legal article h2 { margin:55px 0 16px; font:600 32px/1.1 var(--font-display),serif; }
.legal article h2:first-child { margin-top:0; }
.legal article p { color:var(--muted); font-size:14px; line-height:1.9; }
.legal article ul { margin:0 0 24px; padding-left:22px; color:var(--muted); font-size:14px; line-height:1.9; }
.legal article li+li { margin-top:8px; }
.legal article a { color:var(--copper); border-bottom:1px solid currentColor; }

@media (max-width: 900px) {
  .shell { width:min(100% - 32px, 680px); }
  .header__inner { height:76px; }
  .desktop-nav,.header__call { display:none; }
  .mobile-menu { display:block; position:relative; }
  .mobile-menu summary { list-style:none; width:44px; height:44px; display:flex; flex-direction:column; justify-content:center; gap:7px; cursor:pointer; }
  .mobile-menu summary::-webkit-details-marker { display:none; }
  .mobile-menu summary span { display:block; width:25px; height:2px; margin-left:auto; background:var(--ink); }
  .mobile-menu__panel { position:fixed; top:76px; left:0; right:0; padding:30px 24px 38px; display:flex; flex-direction:column; gap:22px; background:var(--paper); border-bottom:1px solid var(--line); }
  .mobile-menu__panel ul { display:flex; flex-direction:column; gap:22px; margin:0; padding:0; list-style:none; }
  .mobile-menu__panel li a { font:600 28px/1 var(--font-display),serif; }
  .hero { min-height:auto; }
  .hero__grid { min-height:auto; grid-template-columns:1fr; padding:70px 0 30px; }
  .hero__visual { width:82%; justify-self:center; max-height:520px; }
  .hero__seal { left:-26px; }
  .hero__foot { grid-template-columns:1fr auto; }
  .hero__foot span:nth-child(2) { display:none; }
  .intro__grid,.kids-callout__grid { grid-template-columns:1fr; }
  .intro__grid { gap:30px; }
  .service-row { grid-template-columns:45px 1fr 22px; padding-block:30px; gap:18px; }
  .service-row p { grid-column:2/4; }
  .location-strip__grid { grid-template-columns:1fr; }
  .footer__top { grid-template-columns:1fr 1fr; }
  .footer__top>div:first-child { grid-column:1/-1; }
  .page-hero__inner,.process__grid,.kids-detail__grid,.story__grid,.faq__grid,.contact-block__grid,.legal__grid { grid-template-columns:1fr; }
  .page-hero__inner { gap:40px; }
  .service-cards__grid { grid-template-columns:1fr; }
  .process__grid { gap:55px; }
  .kids-detail__photo,.story__photo { min-height:500px; }
  .values__grid { grid-template-columns:1fr; }
  .contact-block__map,.contact-block__map iframe { min-height:520px; height:520px; }
  .legal aside { position:static; }
}
@media (max-width: 560px) {
  .section { padding-block:82px; }
  .hero h1 { font-size:64px; }
  .hero__lead { font-size:15px; }
  .hero__actions { align-items:flex-start; flex-direction:column; gap:24px; }
  .hero__visual { width:92%; }
  .section-head { display:block; }
  .section-head .text-link { margin-top:28px; }
  .service-row h3 { font-size:30px; }
  .footer__top { grid-template-columns:1fr; gap:45px; }
  .footer__top>div:first-child { grid-column:auto; }
  .footer__bottom { gap:14px; flex-direction:column; }
  .footer__bottom nav { flex-wrap:wrap; }
  .page-hero { padding:75px 0 70px; }
  .inner-section,.kids-benefits { padding-block:82px; }
  .service-cards article { min-height:auto; padding:38px 28px; }
  .service-cards h2 { margin-top:38px; }
  .booking-band__inner { align-items:flex-start; flex-direction:column; }
  .benefits-grid,.values__grid>div { grid-template-columns:1fr; }
  .kids-detail__photo,.story__photo { min-height:380px; }
  .contact-item { grid-template-columns:1fr 25px; }
  .contact-item span { grid-column:1/-1; }
  .hours p { flex-direction:column; gap:3px; }
  .hours p em { text-align:left; }
}