/* ALEILA · gama 3 aprobada #42656A #B8D0D2 #F4F1E9. Experiencia v0.4. */
:root{--am-primary:#42656A;--am-secondary:#B8D0D2;--am-base:#F4F1E9}
/* ALEILA v0.3: extensión no destructiva de la web de prueba. */
.aleila-match{background:#F4F1E9;padding:76px 0;border-top:1px solid #D5E0DE;border-bottom:1px solid #D5E0DE}
.aleila-match h2{font-family:'DM Serif Display',Georgia,serif;color:#42656A;line-height:1.14;font-size:clamp(34px,4vw,55px);font-weight:400;margin:13px 0}
.aleila-match h2 em{color:#688A90}
.aleila-match .am-lead{max-width:750px;color:#4A6265;font-size:17px;line-height:1.8}
.am-panel{margin-top:27px;background:#E7F0EE;border:1px solid #D5E0DE;border-radius:22px;padding:27px;box-shadow:0 12px 35px #42656A0d}
.am-step-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:19px}
.am-step-head h3{font:400 26px/1.25 'DM Serif Display',Georgia,serif;color:#42656A;margin:0}
.am-step-head span,.am-label{color:#4D6C70;letter-spacing:.09em;font-size:11px;font-weight:700;text-transform:uppercase}
.am-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:18px 0}
.am-choice{font:600 15px/1.35 'DM Sans',sans-serif;cursor:pointer;border:1px solid #C7D9D8;border-radius:14px;background:#F4F1E9;padding:17px 10px;color:#284749;text-align:center;min-height:67px}
.am-choice:hover,.am-choice:focus-visible{border-color:#42656A;outline-offset:2px}
.am-choice[aria-pressed="true"]{background:#42656A;color:#fff;border-color:#42656A}
.am-navigation{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:22px}
.am-link{border:0;background:transparent;color:#42656A;cursor:pointer;font:600 14px 'DM Sans',sans-serif;text-decoration:underline}
.am-progress{display:flex;gap:7px;margin-top:12px}.am-progress i{height:5px;background:#C9DAD8;flex:1;border-radius:8px}.am-progress i.active{background:#688A90}
.am-result-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:20px}
.am-profile{border:1px solid #D3E0DE;border-radius:17px;background:#FFFEFA;padding:21px;display:flex;flex-direction:column;gap:9px}
.am-profile .am-num{font-size:11px;letter-spacing:.08em;color:#688A90;font-weight:700}
.am-profile h4{font:400 27px/1.18 'DM Serif Display',Georgia,serif;color:#42656A;margin:0}
.am-profile p{color:#4A6265;margin:0;line-height:1.6;font-size:14px}.am-profile .am-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:14px}
.am-mini{border:1px solid #42656A;background:#42656A;color:#fff;border-radius:100px;padding:11px 14px;font:600 13px 'DM Sans',sans-serif;cursor:pointer}
.am-mini.secondary{background:transparent;color:#42656A}.am-mini:hover{opacity:.86}
.am-disclaimer{font-size:12px;line-height:1.6;color:#516D70;margin-top:21px}
.am-trust{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:21px}
.am-trust>div{border-left:2px solid #688A90;padding:5px 16px}.am-trust b{display:block;color:#42656A;font-size:15px;margin-bottom:6px}.am-trust span{font-size:13px;line-height:1.6;color:#50686A}
.am-favorites{padding:15px 18px;margin:18px 0 20px;border:1px solid #CFDDDB;background:#E7F0EE;border-radius:15px;display:flex;gap:15px;justify-content:space-between;align-items:center;flex-wrap:wrap}
.am-favorites p{margin:3px 0 0;font-size:13px;color:#4A6265}.am-favorites b{color:#42656A}.am-favorites[hidden],.am-compare[hidden]{display:none}
.am-heart{border:1px solid #C1D2D2;border-radius:100px;background:#FFFEFA;padding:9px 12px;color:#42656A;font:600 13px 'DM Sans',sans-serif;cursor:pointer;min-height:38px}
.am-heart.active{background:#42656A;color:#fff;border-color:#42656A}
.am-compare{margin:15px 0 28px;overflow-x:auto}.am-compare table{border-collapse:collapse;width:100%;min-width:520px;background:#F4F1E9}.am-compare th,.am-compare td{padding:12px 14px;border:1px solid #DCE5E3;text-align:left;font-size:14px}.am-compare th{background:#E7F0EF;color:#42656A}
.am-first{background:#E7F0EE;border:1px solid #CBDCDA;border-radius:17px;padding:24px;display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:28px}
.am-first h3{font:400 27px 'DM Serif Display',Georgia,serif;color:#42656A;margin:0 0 10px}.am-first p{line-height:1.7;color:#4F6769;font-size:14px;margin:0}.am-first ul{color:#4F6769;font-size:14px;line-height:1.8;margin:0;padding-left:19px}
.am-mobile-book{display:none}
@media(max-width:800px){.am-options{grid-template-columns:repeat(2,minmax(0,1fr))}.am-result-list{grid-template-columns:1fr 1fr}.am-trust{grid-template-columns:1fr}.am-first{grid-template-columns:1fr}}
@media(max-width:600px){.aleila-match{padding:48px 0}.am-panel{padding:19px}.am-options{grid-template-columns:1fr 1fr}.am-choice{font-size:13px;padding:13px 7px;min-height:62px}.am-result-list{grid-template-columns:1fr}.am-step-head h3{font-size:23px}.am-mobile-book{display:block;position:fixed;right:13px;left:13px;bottom:10px;background:#42656A;color:white;text-align:center;padding:12px 18px;border-radius:100px;box-shadow:0 5px 16px #152F3344;text-decoration:none;z-index:60;font-weight:700;font-size:14px}.am-mobile-book:focus-visible{outline:3px solid #688A90;outline-offset:3px}body{padding-bottom:68px}}

/* Ajustes de navegación, tactilidad y contraste */
#afinidad {scroll-margin-top:88px}
.am-panel :focus-visible,.am-heart:focus-visible,.am-mini:focus-visible{outline:3px solid #42656A;outline-offset:2px}
.am-heart{min-width:105px}
.am-step-head span{color:#31575C}
.am-result-list .am-profile{min-height:250px}
.am-first strong{color:#31575C}
@media(max-width:600px){.am-favorites{align-items:flex-start}.am-navigation{align-items:stretch}.am-navigation>div{text-align:right}.am-trust>div{border-left-width:3px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ALEILA v0.5 · orientar desde la primera pantalla; primera etapa en línea */
.hero{background:#F4F1E9}
.hero-grid{grid-template-columns:minmax(0,0.83fr) minmax(0,1.17fr);align-items:center;gap:32px;padding-top:37px;padding-bottom:44px}
.hero-grid>.hero-visual{display:none} /* Elemento original conservado para el editor demo */
.hero-copy{padding-left:0}
.hero h1{font-size:clamp(44px,4.8vw,66px);margin:17px 0}
.hero-lead{line-height:1.65;font-size:15px}
.hero-actions{margin:19px 0 12px;gap:12px}
.hero .aleila-match{padding:0;min-width:0;background:transparent;border:0}
.hero .aleila-match>.wrap{padding:0;max-width:none}
.hero .aleila-match h2{font-size:clamp(26px,2.4vw,38px);margin:6px 0 8px}
.hero .aleila-match .am-lead{font-size:13px;line-height:1.5;margin-bottom:7px}
.hero .aleila-match .am-panel{margin-top:11px;background:#FFFEFB;border-color:#D1DFDD;padding:20px;box-shadow:0 10px 26px #42656a16;border-radius:18px}
.hero .am-step-head{margin-bottom:8px;gap:8px}
.hero .am-step-head h3{font-size:21px}
.hero .am-disclaimer{font-size:11px;line-height:1.45;margin:8px 0}
.hero .am-options{grid-template-columns:repeat(2,minmax(0,1fr));margin:10px 0;gap:8px}
.hero .am-choice{min-height:48px;padding:9px 8px;font-size:12px;border-radius:9px}
.hero .am-navigation{margin-top:12px;gap:7px}
.hero .am-link{font-size:11px}
.hero .am-mini{font-size:12px;padding:9px 12px}
.hero .am-result-list{grid-template-columns:1fr;max-height:310px;overflow-y:auto;gap:9px;margin-top:8px}
.hero .am-profile{min-height:auto;padding:13px;gap:5px}
.hero .am-profile h4{font-size:21px}
.hero .am-profile p{font-size:12px}
.hero .am-profile .am-actions{margin-top:4px;padding-top:5px}
.hero .am-step-head span{font-size:10px}
.hero .am-small-note{margin-top:10px;font-size:10px}
#afinidad{scroll-margin-top:120px}
@media(max-width:900px){
 .hero-grid{grid-template-columns:1fr;gap:16px;padding-top:28px;padding-bottom:32px}
 .hero .aleila-match{order:0}
 .hero-copy{order:1}
 .hero .aleila-match .am-panel{padding:18px}
 .hero h1{font-size:clamp(35px,7vw,53px);margin:12px 0}
 .hero-lead{font-size:14px}
}
@media(max-width:600px){
 .hero-grid{padding-top:20px;gap:24px}
 .hero .aleila-match h2{font-size:30px}
 .hero .am-step-head h3{font-size:20px}
 .hero .am-choice{min-height:47px;font-size:12px}
 .hero .am-navigation{flex-wrap:wrap}
 .hero .am-navigation>div{display:flex;gap:10px;align-items:center;justify-content:flex-end}
 .hero .am-link{font-size:11px}
 .hero .am-small-note{font-size:10px}
 .hero-copy .hero-actions{margin:14px 0}
}
