.recipes-page em{font-style:normal;color:#a74713;}
.recipes-page figure{margin:0;}
.recipes-welcome{display:grid;grid-template-columns:1fr 1.05fr;min-height:610px;max-width:1600px;margin:auto;}
.recipes-welcome>div{padding:65px 10% 45px 12%;align-self:center;}
.recipes-welcome h1{font-size:clamp(54px,6.3vw,94px);line-height:1.02;letter-spacing:-.02em;}
.recipes-welcome p{max-width:370px;font-size:18px;margin:28px 0;}
.welcome-note{display:block;font-size:9px;letter-spacing:.1em;font-weight:700;margin-top:35px;}
.recipes-welcome figure{position:relative;min-height:610px;}
.recipes-welcome figure img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center;}
.recipes-welcome figcaption{position:absolute;bottom:25px;left:25px;background:#fff9eced;padding:12px 18px;font-size:12px;border-radius:5px;}
.recipe-library{max-width:1500px;padding:90px 6%;margin:auto;}
.library-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:50px;margin-bottom:38px;}
.library-heading h2{font-size:clamp(40px,4.6vw,68px);}
.library-heading>p{max-width:380px;font-size:16px;}
.recipe-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px;}
.recipe-filters[hidden]{display:none;}
.recipe-filters button{border:1px solid #61340840;background:transparent;color:var(--brown);border-radius:999px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;transition:background .2s,color .2s;}
.recipe-filters button:hover{background:#6134080d;}
.recipe-filters button[aria-pressed="true"]{background:var(--olive);border-color:var(--olive);color:var(--cream);}
.recipe-list{border-top:1px solid #61340830;}
.recipe{border-bottom:1px solid #61340830;}
.recipe summary{display:grid;grid-template-columns:54px 92px 1fr auto 34px;align-items:center;gap:24px;padding:26px 8px;cursor:pointer;list-style:none;transition:background .2s;}
.recipe summary::-webkit-details-marker{display:none;}

.recipe summary:focus-visible{outline-offset:-3px;}
.recipe-num{font-family:Kardia,Arial,sans-serif;font-size:30px;color:#a74713;}
.recipe-thumb{width:92px;height:92px;border-radius:18px;background:#e9d9ad center/cover no-repeat;transition:transform .3s;}
/* El hover solo con puntero: en táctil se queda pegado en la fila que se acaba de tocar. */
@media (hover:hover){
  .recipe summary:hover{background:#6134080a;}
  .recipe summary:hover .recipe-thumb{transform:scale(1.05) rotate(-2deg);}
}
.recipe-name h3{font-size:clamp(24px,2.5vw,36px);}
.recipe-tags{display:block;margin-top:7px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--olive);}
.recipe-eggs{background:#e1edc9;color:var(--olive);border-radius:999px;padding:7px 16px;font-size:13px;font-weight:700;white-space:nowrap;}
.recipe-toggle{position:relative;width:34px;height:34px;border:1px solid #61340850;border-radius:50%;}
.recipe-toggle::before,.recipe-toggle::after{content:"";position:absolute;left:50%;top:50%;width:13px;height:2px;margin:-1px 0 0 -6.5px;background:var(--brown);transition:transform .25s;}
.recipe-toggle::after{transform:rotate(90deg);}
.recipe[open] .recipe-toggle::after{transform:rotate(0);}
.recipe[open] summary{background:#6134080a;}
.recipe-body{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);grid-template-areas:"foto intro" "ing pasos" "cred cred";gap:36px 7%;padding:24px 8px 50px 86px;}
.recipe-photo{grid-area:foto;}
.recipe-photo img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:22px;}
.recipe-intro{grid-area:intro;align-self:center;max-width:560px;font-family:Kardia,Arial,sans-serif;font-size:clamp(22px,2vw,30px);line-height:1.25;color:var(--brown);}
.recipe-ingredients{grid-area:ing;}
.recipe-steps{grid-area:pasos;}
.recipe-body h4{margin:0 0 16px;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#a74713;}
.portions{display:inline-flex;align-items:center;gap:12px;background:#fff;border:1px solid #61340825;border-radius:999px;padding:6px 8px 6px 20px;margin-bottom:22px;}
.portions-label{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--olive);}
.portions output{min-width:96px;text-align:center;font-weight:700;font-size:15px;}
.portions button{width:36px;height:36px;border:0;border-radius:50%;background:var(--orange);color:#422704;font:700 24px/1 Arial,sans-serif;cursor:pointer;transition:transform .2s,opacity .2s;}
.portions button:hover:not(:disabled){transform:scale(1.08);}
.portions button:disabled{opacity:.35;cursor:default;}
.portions button:focus-visible{outline:3px solid #b34308;outline-offset:3px;}
.recipe-ingredients ul{list-style:none;margin:0;padding:0;}
.recipe-ingredients li{padding:11px 0;border-bottom:1px dashed #61340830;font-size:16px;color:var(--brown);}
.portions-note{margin-top:14px;font-size:12px;}
.recipe-steps ol{margin:0;padding:0;list-style:none;counter-reset:paso;}
.recipe-steps li{counter-increment:paso;position:relative;padding:0 0 22px 48px;font-size:16px;color:var(--olive);}
.recipe-steps li::before{content:counter(paso);position:absolute;left:0;top:-2px;width:32px;height:32px;border-radius:50%;background:var(--olive);color:var(--cream);font-size:14px;font-weight:700;display:grid;place-items:center;}
.recipe-credit{grid-area:cred;border-top:1px solid #61340820;padding-top:22px;font-size:13px;}
.recipe-credit a:not(.text-link){text-decoration:underline;text-underline-offset:3px;}
.recipe-credit .text-link{display:flex;width:fit-content;margin-top:12px;font-size:13px;}
.recipes-pia{display:grid;grid-template-columns:180px minmax(0,720px);justify-content:center;align-items:center;gap:50px;background:#e1edc9;padding:65px 6%;}
.recipes-pia .pia-cameo{width:180px;}
.recipes-pia .pia-cameo img{width:100%;height:260px;object-fit:contain;object-position:bottom;}
.recipes-pia .pia-bubble{right:-12%;top:-4%;}
.recipes-pia h2{font-size:clamp(36px,3.5vw,52px);}
.recipes-pia p{max-width:510px;font-size:16px;margin:24px 0;}
.recipes-social{padding:90px 6%;max-width:1500px;margin:auto;display:grid;grid-template-columns:1.2fr 1fr;gap:10%;align-items:center;}
.recipes-social h2{font-size:clamp(38px,4vw,58px);}
.recipes-social p{max-width:450px;margin:24px 0;}
.recipe-shopping img{height:270px;width:100%;object-fit:cover;border-radius:16px;}
.recipe-shopping h3{margin:22px 0 15px;font-size:30px;}
.recipes-social .text-link{font-size:13px;}
.recipes-footer nav{display:flex;gap:25px;font-size:12px;}

@media (max-width:950px){
  .recipes-welcome>div{padding-left:10%;}
  .recipes-welcome h1{font-size:65px;}
  .recipe-body{padding-left:8px;}
  .library-heading{display:block;}
  .library-heading>p{margin-top:24px;max-width:560px;}
  .recipe summary{grid-template-columns:44px 80px 1fr auto 34px;gap:18px;}
  .recipe-thumb{width:80px;height:80px;}
  .portions button{width:44px;height:44px;}
  .recipe-filters button{padding:12px 20px;}
  .recipes-pia{grid-template-columns:130px 1fr;gap:30px;}
  .recipes-pia .pia-cameo{width:130px;}
  .recipes-pia .pia-cameo img{height:210px;}
}
@media (max-width:650px){
  .recipes-welcome{grid-template-columns:1fr;}
  .recipes-welcome>div{padding:40px 6%;}
  .recipes-welcome h1{font-size:61px;}
  .recipes-welcome p{font-size:16px;}
  .welcome-note{margin-top:25px;}
  .recipes-welcome figure{min-height:370px;}
  .recipes-welcome figure img{object-position:center 55%;}
  .recipe-library{padding:55px 6%;}
  .library-heading{display:block;}
  .library-heading>p{margin-top:24px;max-width:none;}
  .recipe summary{grid-template-columns:64px 1fr 30px;gap:14px;padding:18px 2px;}
  .recipe-num{display:none;}
  .recipe-thumb{width:64px;height:64px;border-radius:14px;grid-row:1/3;align-self:start;}
  .recipe-eggs{grid-column:2;grid-row:2;justify-self:start;font-size:12px;padding:5px 13px;}
  .recipe-toggle{grid-column:3;grid-row:1;width:30px;height:30px;}
  .recipe-body{grid-template-columns:1fr;grid-template-areas:"foto" "intro" "ing" "pasos" "cred";gap:26px;padding:14px 2px 38px;}
  .recipe-intro{font-size:21px;}
  .recipes-pia{padding:45px 6%;grid-template-columns:80px 1fr;gap:20px;}
  .recipes-pia .pia-cameo{width:80px;}
  .recipes-pia .pia-cameo img{height:160px;}
  /* Aquí Pía queda en una columna de 80px junto al texto: no hay espacio para la burbuja. */
  .recipes-pia .pia-bubble{display:none;}
  .recipes-pia h2{font-size:31px;}
  .recipes-pia p{font-size:14px;}
  .recipes-pia .button{font-size:12px;padding:14px 18px;gap:15px;}
  .recipes-social{padding:55px 6%;grid-template-columns:1fr;gap:40px;}
  .recipes-footer nav{flex-wrap:wrap;gap:15px;}
}
@media (prefers-reduced-motion:reduce){}
