body.advice-page { display:block; height:auto; min-height:100vh; overflow:visible; }
.advice-page .header { height:auto; }
.advice-page main { display:block; padding:0; }
.advice-page main { position:relative; isolation:isolate; }
.advice-page main::before {
  content:""; position:absolute; inset:0 0 auto; height:clamp(360px, 39vw, 620px);
  z-index:-1; pointer-events:none; opacity:.55;
  background:url("assets/fondo-alcazar.png") center center/cover no-repeat;
  mask-image:linear-gradient(#000 50%, transparent);
}
.advice-width { width:min(91.6%, 1500px); margin-inline:auto; }
.advice-hero { display:grid; grid-template-columns:minmax(0, 5fr) minmax(0, 7fr); align-items:center; }
.advice-copy { padding:clamp(28px, 4vw, 70px) clamp(16px, 4vw, 72px) clamp(28px, 4vw, 70px) 0; }
.advice-copy .advice-label { display:flex; align-items:center; gap:14px; font-size:12px; font-weight:650; letter-spacing:.16em; text-transform:uppercase; }
.advice-label::after { content:""; width:44px; height:1px; background:var(--gold); }
.advice-copy h1 { margin:20px 0; font-size:clamp(36px, 4.6vw, 76px); line-height:1.04; letter-spacing:-.045em; font-weight:620; text-wrap:balance; }
.advice-copy h1 em { color:var(--gold); font-weight:540; }
.advice-copy p { max-width:36ch; line-height:1.55; margin:0 0 24px; }
.advice-hero img { display:block; width:100%; height:100%; min-height:0; aspect-ratio:3/2; object-fit:cover; }
.advice-button { display:inline-flex; align-items:center; gap:16px; min-height:46px; padding:10px 16px; background:#795619; color:#fff; font-weight:600; text-decoration:none; transition:background-color .2s; }
.advice-button:hover { background:#593c10; }
.advice-areas { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); padding-block:22px; }
.advice-areas details { border-inline-start:1px solid var(--line); padding:0 16px; }
.advice-areas details:first-child { border-inline-start:0; }
.advice-areas summary { display:grid; justify-items:center; gap:7px; padding:10px 0; list-style:none; cursor:pointer; font-size:clamp(19px,2vw,28px); font-weight:600; }
.advice-areas summary span { display:grid; justify-items:center; gap:7px; }
.advice-areas summary::-webkit-details-marker { display:none; }
.advice-areas summary svg { width:37px; height:37px; fill:none; stroke:var(--gold); stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
.advice-areas summary::after { content:""; width:8px; height:8px; border:solid var(--gold); border-width:0 1px 1px 0; transform:rotate(45deg); }
.advice-areas details[open] summary::after { transform:rotate(225deg); }
.advice-areas p { max-width:32ch; margin:8px auto 12px; font-size:14px; line-height:1.55; text-align:center; }
@supports selector(::details-content) {
  @media (hover:hover) and (pointer:fine) and (min-width:961px) {
    .advice-areas details { display:grid; position:relative; }
    .advice-areas summary, .advice-areas details::details-content { grid-area:1 / 1; }
    .advice-areas summary { align-content:center; z-index:1; min-height:132px; }
    .advice-areas details::details-content {
      display:grid; align-content:center; content-visibility:visible;
      pointer-events:none; transition:opacity 320ms ease, transform 380ms ease, visibility 380ms;
    }
    .advice-areas details p { margin-block:12px; }
    .advice-areas summary span, .advice-areas summary::after { transition:opacity 250ms ease, transform 360ms ease; }
    .advice-areas details:not(:hover):not([open])::details-content { visibility:hidden; opacity:0; transform:translateY(6px); }
    .advice-areas details:is(:hover,[open]) summary span,
    .advice-areas details:is(:hover,[open]) summary::after { opacity:0; transform:translateY(-6px); }
    @media (prefers-reduced-motion:reduce) {
      .advice-areas details::details-content, .advice-areas summary span, .advice-areas summary::after { transition:none; }
    }
  }
}
.advice-audiences { border-top:1px solid var(--line); padding-block:clamp(22px,3vw,44px); }
.advice-audiences h2 { margin:0 0 20px; font-size:clamp(24px,3vw,36px); letter-spacing:-.035em; }
.advice-audiences > div { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%, 290px),1fr)); gap:16px 40px; }
.advice-audiences h3 { color:#795619; margin:0 0 6px; font-size:18px; }
.advice-audiences p { margin:0; max-width:55ch; line-height:1.6; }
.advice-contact { display:flex; align-items:center; justify-content:center; gap:24px; padding:24px 4.2%; background:var(--ink); color:var(--paper); }
.advice-contact h2 { margin:0; font-size:clamp(18px,2vw,26px); font-weight:550; }
.advice-contact em { color:#e7c791; font-weight:450; }
.advice-contact .advice-button { flex:none; background:#e7c791; color:var(--ink); }
.advice-contact .advice-button:hover { background:#f4dcb5; }
@media (max-width:760px) {
  .advice-hero { grid-template-columns:1fr; }
  .advice-copy { padding-inline:0; }
  .advice-page main::before { opacity:.42; background-position:right top; }
  .advice-hero img { height:auto; aspect-ratio:16/10; }
  .advice-areas { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .advice-areas details { border:1px solid var(--line); padding:0 10px; }
  .advice-areas details:first-child { border-inline-start:1px solid var(--line); }
  .advice-contact { flex-direction:column; align-items:flex-start; gap:14px; }
}
@media (prefers-reduced-motion:reduce) {
  .advice-button { transition:none; }
}
.advice-copy { position:relative; isolation:isolate; }
.advice-copy::before {
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:url("assets/fondo-alcazar.png") right bottom/auto 76% no-repeat;
  opacity:.33;
  mask-image:radial-gradient(ellipse at 100% 85%, #000, transparent 72%);
}