/* Editorial barbershop direction. Existing palette and app behavior preserved. */
:root{--papel:#dedbd3;--tinta:#222725;--filete:#59675c;--serif:'Cormorant Garamond',Georgia,serif}
body{background:#222725}
::selection{background:#c7d4ac;color:#182118}
.demo-bar{background:#1b211d;color:#c7cec6;border-bottom:1px solid #3c443d;padding:8px 16px;font-size:12px;font-weight:400;letter-spacing:.12em}
.hero{position:relative;background:#222725;border-bottom:1px solid #59675c}
.hero::before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23grain)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.rotulo-barberia{position:relative;max-width:1100px;margin:0 auto;padding:26px 32px 23px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;border-bottom:3px double #59675c}
.rotulo-barberia .marca{font-family:var(--serif);font-size:clamp(38px,5vw,64px);font-weight:700;letter-spacing:.075em;line-height:1;text-shadow:0 2px 0 #1b211d;color:#eee9df}
.rotulo-barberia .marca-sub{font-size:12px;letter-spacing:.3em;color:#cfc4b3;margin-top:9px}
.rotulo-lugar,.rotulo-oficio{text-align:left;font-family:var(--serif);font-size:19px;line-height:1.25;color:#c7cec6}
.rotulo-oficio{text-align:right}
.hero .hero-layout{position:relative;max-width:1100px;grid-template-columns:1fr 1.1fr;gap:56px;padding:40px 32px 46px;align-items:center}
.hero-copy{text-align:left}
.hero-copy .since{margin:0 0 22px;padding-left:35px;position:relative;font-size:12px;line-height:1.6;color:#cfc4b3;letter-spacing:.13em}
.hero-copy .since::before{content:'';position:absolute;left:0;top:9px;width:23px;border-top:1px solid #cfc4b3}
.hero .hero-copy h1{font-family:var(--serif);font-weight:500;font-size:clamp(46px,5.2vw,70px);line-height:.99;letter-spacing:-.035em;margin:0 0 24px;color:#eee9df}
.hero .hero-copy h1 em{display:inline-block;font-size:1em;font-weight:500;line-height:1.04;color:#cfc4b3;margin-top:8px}
.hero-copy p{font-size:16px;color:#c7cec6;line-height:1.85;max-width:420px}
.hero-copy .recorrido{margin-top:25px;padding-top:20px;border-top:1px solid #59675c;gap:19px}
.hero-copy .recorrido span{font-size:12px;line-height:1.7;color:#c7cec6;letter-spacing:.015em}
.hero-copy .recorrido b{font-family:var(--serif);font-size:20px;color:#cfc4b3;font-weight:500;margin-right:4px}
.hero-copy .btn-row{grid-template-columns:1.1fr 1fr;gap:12px;margin-top:23px;max-width:460px}
.btn{border-radius:2px;font-size:14px;font-weight:600;letter-spacing:.04em;padding:16px 18px;box-shadow:inset 0 0 0 3px #222725,inset 0 0 0 4px #59675c;transition:background .18s,transform .18s}
.hero .btn-ghost{box-shadow:none;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px;color:#c7cec6;font-weight:400;letter-spacing:0}
.btn:hover{transform:translateY(-1px)}
.btn:focus-visible,.dropzone:focus-visible,.modo:focus-visible{outline:2px solid #c7d4ac;outline-offset:5px}
.hero .barberia-portada{border-radius:1px;padding:9px;border:1px solid #59675c;background:#1b211d;box-shadow:10px 10px 0 -1px #222725,10px 10px 0 0 #59675c;transform:rotate(-1deg)}
.barberia-portada .fachada-portada{aspect-ratio:640/427;object-fit:contain;filter:saturate(.78) contrast(1.04);border:1px solid #3c443d}
.barberia-portada figcaption{background:#1b211d;gap:17px;padding:22px 14px 12px;border:0;align-items:center}
.barberia-portada .eddie-firma-foto{width:68px;height:82px;border-radius:1px;object-fit:cover;object-position:center;border:1px solid #59675c}
.barberia-portada figcaption span{font-size:12px;letter-spacing:.12em;color:#cfc4b3}
.barberia-portada strong{font-size:29px;line-height:1.12;color:#eee9df;margin:6px 0}
.barberia-portada small{font-size:12px;line-height:1.5;color:#c7cec6}
.sec{padding:52px 0}
.sec .wrap{max-width:760px;padding-left:28px;padding-right:28px}
.sec h2{font-size:clamp(32px,5vw,44px);line-height:1.1;font-weight:500;letter-spacing:-.025em;margin-bottom:16px}
.kicker{font-size:12px;letter-spacing:.2em;color:#cfc4b3;display:flex;align-items:center;gap:14px;margin-bottom:15px}
.kicker::after{content:'';width:48px;height:1px;background:#59675c}
#analisis{background:#282b2b}
.sec>.wrap>p.lead{font-size:16px;line-height:1.8;color:#c7cec6}
.dropzone{margin-top:26px;padding:32px 20px;background:#333938;border:1px solid #838c86;border-radius:1px;outline:1px dashed #59675c;outline-offset:-8px}
.dropzone:hover,.dropzone.drag{background:#343936;border-color:#c7d4ac;outline-color:#c7d4ac}
.dz-icon{font-family:var(--serif);font-size:38px;line-height:1.1;color:#cfc4b3;margin-bottom:13px}
.dz-t{font-family:var(--serif);font-weight:600;font-size:27px;line-height:1.2;margin-bottom:9px;color:#eee9df}
.dz-s{font-size:13px;color:#c7cec6}
.privacidad{border:0;border-radius:0;background:transparent;padding:0;margin-top:20px;line-height:1.7;color:#c7cec6;font-size:13px}
.privacidad b{color:#eee9df}
.resultado-nav{background:#222725;border-block:1px solid #59675c;backdrop-filter:none}
.cabecera-seccion{border-bottom:3px double #59675c;padding-bottom:18px;margin-top:38px}
.cabecera-seccion h3{font-family:var(--serif);font-weight:500!important;font-size:34px!important;letter-spacing:-.02em}
.numero-seccion,.ficha .numero-seccion{border-radius:0;font-family:var(--serif);font-size:22px;font-weight:500}
.etiqueta-seccion{font-size:12px;letter-spacing:.12em}
.ficha{border-radius:1px;padding:30px;box-shadow:5px 5px 0 #1b211d;border:1px solid #c3bfb5}
.ficha .cabecera-seccion{margin-top:0;border-bottom:3px double #a6a99f}
.ficha dl>div{padding:20px 0}
.ficha dt{font-size:13px}
.ficha dd{font-size:16px}
.objetivo-ficha,.pendiente-ficha{border-radius:1px}
.preferencias,.ruta-estilo,.guardar-estilo,.confianza-eddie,.informe-completo,.reserva-box{border-radius:1px}
.preferencias label,.preferencias select,.guardar-estilo input:not([type=checkbox]),.perfil-resumen,.favorito-resumen,.comprador-datos{border-radius:1px}
.preferencias h3,.ruta-estilo h3,.guardar-estilo h3{font-family:var(--serif);font-size:32px;font-weight:500;line-height:1.15}
.preferencias>p,.guardar-estilo>p,.ruta-estilo>p{font-size:15px;line-height:1.75}
.modo-sel{border-top:1px solid #59675c;border-bottom:1px solid #59675c;padding:10px 0;gap:8px}
.modo{border-radius:1px!important;font-size:14px;min-height:44px}
.corte-top,.corte{border-radius:1px;border:1px solid #59675c;box-shadow:none}
.corte-top .cuerpo,.corte .cuerpo{padding:24px}
.corte-top h4{font-family:var(--serif);font-size:32px;line-height:1.1;font-weight:500}
.corte h5{font-family:var(--serif);font-size:28px;line-height:1.15;font-weight:500}
.corte .ref,.corte-top .ref{font-size:14px;line-height:1.75}
.corte-badge{border-radius:0;font-size:12px;letter-spacing:.06em}
.accion-estilo,.eleccion-ruta button{border-radius:1px;font-size:14px;min-height:44px}
.probar-estilo{margin-top:18px;width:100%;border-style:solid}
.corte-no{border-radius:1px}
.nota-local{font-size:13px;line-height:1.7}
.reserva-local{border-radius:1px;padding:7px;border:1px solid #59675c}
.reserva-local figcaption{border-top:0;padding:20px 14px 12px}
.reserva-local strong{font-family:var(--serif);font-size:28px;font-weight:500}
.reserva-promesa{border-radius:0}
.guia-muestra article{border-radius:1px;box-shadow:3px 3px 0 #1b211d;border-top:3px double #59675c}
.guia-muestra b{font-family:var(--serif);font-size:24px;font-weight:600}
.pasos{border-top:3px double #59675c;margin-top:28px}
.paso{padding:22px 0;border-bottom:1px solid #59675c;align-items:flex-start}
.paso-n{background:transparent;border:0;font-family:var(--serif);font-size:36px;line-height:1;color:#cfc4b3;border-radius:0;min-width:45px}
.paso-t{font-family:var(--serif);font-size:25px;font-weight:600;line-height:1.2;margin-bottom:8px;color:#eee9df}
.paso-d{font-size:15px;line-height:1.75;color:#c7cec6}
.pie{border-top:3px double #59675c;background:#1b211d;padding:28px 20px}
.pie small{font-size:12px;color:#c7cec6}
#reservaDialog{border-radius:2px;border:1px solid #59675c}
@media(max-width:699px){
 .rotulo-barberia{margin:0 22px;padding:23px 0 20px;gap:10px;grid-template-columns:1fr auto 1fr}
 .rotulo-barberia .marca{font-size:36px;letter-spacing:.035em}
 .rotulo-barberia .marca-sub{font-size:10px;letter-spacing:.22em;margin-top:7px}
 .rotulo-lugar,.rotulo-oficio{font-size:14px}
 .hero .hero-layout{grid-template-columns:1fr;gap:30px;padding:30px 24px 36px}
 .hero-copy{text-align:left}
 .hero-copy .since{font-size:11px;letter-spacing:.06em;margin-bottom:18px;padding-left:27px}
 .hero-copy .since::before{width:17px}
 .hero .hero-copy h1{font-size:clamp(43px,11.5vw,64px);margin:0 0 18px}
 .hero-copy p{margin:0;font-size:15px;line-height:1.8}
 .hero-copy .recorrido{justify-content:flex-start;gap:15px;margin-top:20px;padding-top:15px}
 .hero-copy .recorrido span{font-size:12px}
 .hero-copy .btn-row{margin:20px 0 0;max-width:none;grid-template-columns:1fr}
 .hero-copy .btn-ghost{padding:8px 14px;min-height:40px}
 .hero .barberia-portada{max-width:440px;margin:0 auto;transform:none;box-shadow:5px 5px 0 -1px #222725,5px 5px 0 0 #59675c;padding:6px}
 .barberia-portada figcaption{padding:17px 10px 10px;gap:13px}
 .barberia-portada .eddie-firma-foto{width:55px;height:67px}
 .barberia-portada figcaption span{font-size:10px;letter-spacing:.08em}
 .barberia-portada strong{font-size:25px}
 .barberia-portada small{font-size:11px}
 .sec{padding:36px 0}.sec .wrap{padding-inline:22px}
 .dropzone{padding:29px 18px}.dz-t{font-size:25px}
 .ficha{padding:22px}.cabecera-seccion h3{font-size:29px!important}
 .corte-top .cuerpo,.corte .cuerpo{padding:20px}
 .preferencias,.ruta-estilo,.guardar-estilo,.confianza-eddie{padding:20px}
 .paso{gap:14px}.paso-n{font-size:30px;min-width:34px}
 .paso-t{font-size:23px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn{transition:none}.btn:hover{transform:none}}

/* A photographic shopfront, not a generic app landing page. */
.hero{isolation:isolate;background:#222725 url('assets/barberia-eddie-moon.jpeg') center 48% / cover no-repeat}
.hero::before{z-index:-1;opacity:1;background:linear-gradient(90deg,rgba(19,28,23,.97),rgba(19,28,23,.82) 40%,rgba(19,28,23,.22)),linear-gradient(0deg,#222725,transparent 45%)}
.rotulo-barberia{max-width:none;margin:0 5%;padding:28px 0;border-block:1px solid #a0a790}
.rotulo-barberia .marca{font-size:clamp(58px,9vw,126px);letter-spacing:.035em}
.rotulo-barberia .marca-sub{letter-spacing:.5em;font-size:13px}
.hero .hero-layout{min-height:620px;max-width:1250px;grid-template-columns:1.2fr .8fr;gap:70px;padding-block:65px}
.hero .hero-copy h1{font-size:clamp(64px,7.2vw,100px);max-width:650px;line-height:.92}
.hero-copy p{color:#dedbd3;max-width:410px}
.hero .barberia-portada{align-self:end;transform:rotate(2deg);padding:10px;background:#dedbd3;border:0;box-shadow:0 18px 45px #10171088}
.barberia-portada .fachada-portada{filter:saturate(.5) contrast(1.1);aspect-ratio:1.25;object-fit:cover}
.barberia-portada figcaption{background:#dedbd3;padding:20px 10px 10px}
.barberia-portada figcaption span,.barberia-portada strong,.barberia-portada small{color:#26352b}
.barberia-portada .eddie-firma-foto{filter:saturate(.5);border:1px solid #59675c}
#analisis{border-top:8px double #59675c;background:linear-gradient(90deg,#222725 0,#303733 50%,#222725 100%)}
.consulta-estilo{padding:30px;background:#dedbd3;color:#26352b;border:1px solid #a6a99f;box-shadow:8px 8px 0 #18211c}
.consulta-estilo h4{font-family:var(--serif);font-size:29px;font-weight:600;margin:6px 0 18px}
.consulta-estilo .nota-local{color:#4d5d51;margin:14px 0 25px}
.consulta-estilo .modo-sel{display:flex;flex-wrap:wrap;padding:0 0 18px;border-top:0}
.consulta-estilo .modo{flex:1 1 100px;color:#26352b;background:transparent;border:1px solid #809080;padding:12px}
.consulta-estilo .modo.on{background:#304c3c;color:#f4f0e7;border-color:#304c3c}
.enfoque-sel{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.enfoque-sel button{cursor:pointer;text-align:left;padding:18px;background:transparent;border:1px solid #809080;color:#26352b;font:inherit}
.enfoque-sel button[aria-pressed=true]{background:#304c3c;color:#f4f0e7}
.enfoque-sel strong,.enfoque-sel span{display:block}
.enfoque-sel strong{font-family:var(--serif);font-size:24px;line-height:1.1}
.enfoque-sel span{font-size:12px;line-height:1.5;margin-top:9px}
#seleccionManual{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin-top:22px}
#seleccionManual label{font-size:14px;font-weight:600}
#seleccionManual select{display:block;width:100%;padding:14px 10px;background:#f0eee7;color:#26352b;border:1px solid #809080;font:inherit;margin-top:8px}
#resumenEstilo{font-family:var(--serif);font-size:27px;line-height:1.2;margin:24px 0 10px}
#detalleEstilo{font-size:14px;line-height:1.6;color:#4d5d51}
.consulta-estilo .btn{width:100%;background:#304c3c;color:#f4f0e7}
.consulta-estilo button:disabled{opacity:.55;cursor:default}
.consulta-estilo button:focus-visible,.consulta-estilo select:focus-visible{outline:2px solid #304c3c;outline-offset:3px}
[hidden],#seleccionManual[hidden]{display:none!important}
#cortes>h3{font-family:var(--serif);font-size:34px;margin-bottom:20px}
#cortes>.corte{margin-bottom:24px}
#cortes>.corte img{width:100%;height:auto;aspect-ratio:1;object-fit:contain}
#cortes h4{font-family:var(--serif);font-size:28px}
@media(max-width:699px){
 .rotulo-barberia{margin:0 20px;padding:25px 0;grid-template-columns:1fr;text-align:center;gap:13px}
 .rotulo-barberia .marca{font-size:clamp(48px,13vw,80px)}
 .rotulo-lugar,.rotulo-oficio{text-align:center;font-size:15px;letter-spacing:.08em}
 .rotulo-lugar br,.rotulo-oficio br{display:block}
 .hero .hero-layout{grid-template-columns:1fr;min-height:0;padding:35px 24px 44px;gap:30px}
 .hero .hero-copy h1{font-size:clamp(52px,14vw,78px)}
 .hero::before{background:linear-gradient(90deg,rgba(19,28,23,.94),rgba(19,28,23,.67))}
 .hero .barberia-portada{width:100%;max-width:360px;transform:rotate(1deg)}
 .consulta-estilo{padding:22px 18px}.consulta-estilo h4{font-size:26px}
 .enfoque-sel{grid-template-columns:1fr}.enfoque-sel button{padding:16px}
}