.resource-page {
  --r-orange: #d8643d;
  --r-orange-dark: #9f3f24;
  --r-yellow: #e6c058;
  --r-ink: #3c3c3c;
  --r-muted: #666;
  --r-soft: #f6f6f6;
  --r-border: #dedede;
  --r-radius: 22px;
  --r-shadow: 0 16px 45px rgba(60,60,60,.10);
}
.resource-page .resource-shell { width:min(calc(100% - 2rem),1180px); margin-inline:auto; }
.resource-page .resource-breadcrumbs { padding:1rem 0 0; font-size:.9rem; color:var(--r-muted); }
.resource-page .resource-breadcrumbs ol { list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:.45rem; }
.resource-page .resource-breadcrumbs li:not(:last-child)::after { content:"›"; margin-left:.45rem; color:#999; }
.resource-page .resource-breadcrumbs a { color:inherit; text-underline-offset:3px; }
.resource-page .resource-hero { padding:2.5rem 0 2rem; }
.resource-page .resource-eyebrow { display:inline-flex; align-items:center; gap:.5rem; margin:0 0 1rem; color:var(--r-orange-dark); font-size:.84rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.resource-page .resource-eyebrow::before { content:""; width:32px; height:4px; background:var(--r-yellow); border-radius:99px; }
.resource-page .resource-hero h1,
.resource-page .resource-section h2,
.resource-page .resource-cta h2 { line-height:1.12; letter-spacing:-.025em; }
.resource-page .resource-hero h1 { margin:0; max-width:980px; font-size:clamp(2.2rem,5vw,4.65rem); }
.resource-page .resource-lead { max-width:860px; font-size:clamp(1.08rem,2vw,1.3rem); color:#515151; margin:1.2rem 0 0; }
.resource-page .resource-hero-media { margin:2rem 0 0; border-radius:var(--r-radius); overflow:hidden; box-shadow:var(--r-shadow); background:var(--r-soft); }
.resource-page .resource-hero-media img { width:100%; aspect-ratio:16/9; object-fit:cover; object-position:center 55%; }
.resource-page .resource-facts { margin-top:1.6rem; display:grid; grid-template-columns:repeat(4,1fr); gap:.8rem; }
.resource-page .resource-fact { border:1px solid var(--r-border); border-radius:16px; padding:1rem; background:#fff; }
.resource-page .resource-fact strong { display:block; font-size:clamp(1.35rem,3vw,2rem); color:var(--r-orange-dark); line-height:1.05; }
.resource-page .resource-fact span { display:block; margin-top:.4rem; color:var(--r-muted); font-size:.92rem; }
.resource-page .resource-section { padding:3.5rem 0; }
.resource-page .resource-section--soft { background:var(--r-soft); }
.resource-page .resource-section h2 { margin:0 0 1rem; font-size:clamp(1.75rem,4vw,3rem); }
.resource-page .resource-section h3 { line-height:1.2; }
.resource-page .resource-section p { max-width:800px; font-size:1.04rem; }
.resource-page .resource-intro { color:#565656; font-size:1.12rem !important; }
.resource-page .resource-two-col { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,.72fr); gap:2.5rem; align-items:start; }
.resource-page .resource-data-card { background:var(--r-yellow); border-radius:var(--r-radius); padding:1.5rem; }
.resource-page .resource-data-card h3 { margin-top:0; }
.resource-page .resource-data-list { margin:0; padding:0; list-style:none; }
.resource-page .resource-data-list li { display:grid; grid-template-columns:1fr auto; gap:1rem; padding:.8rem 0; border-bottom:1px solid rgba(60,60,60,.22); }
.resource-page .resource-data-list li:last-child { border-bottom:0; }
.resource-page .resource-data-list span:last-child { font-weight:800; text-align:right; }
.resource-page .resource-process { display:grid; grid-template-columns:repeat(4,1fr); gap:.8rem; margin-top:1.6rem; }
.resource-page .resource-step { min-height:180px; border:1px solid var(--r-border); border-radius:18px; padding:1.25rem; background:#fff; }
.resource-page .resource-step-num { color:var(--r-orange-dark); font-size:1.85rem; font-weight:900; line-height:1; }
.resource-page .resource-step h3 { margin:.8rem 0 .5rem; font-size:1.1rem; }
.resource-page .resource-step p { margin:0; font-size:.96rem; color:var(--r-muted); }
.resource-page .resource-gallery { margin-top:1.6rem; }
.resource-page .resource-gallery-viewport { overflow-x:auto; scroll-snap-type:x mandatory; display:flex; gap:1rem; scrollbar-width:thin; padding-bottom:.75rem; overscroll-behavior-inline:contain; }
.resource-page .resource-gallery-slide { flex:0 0 100%; scroll-snap-align:start; margin:0; border-radius:var(--r-radius); overflow:hidden; background:#fff; border:1px solid var(--r-border); }
.resource-page .resource-gallery-slide img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.resource-page .resource-gallery-slide figcaption { padding:.9rem 1rem 1rem; color:var(--r-muted); font-size:.92rem; }
.resource-page .resource-gallery-controls { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:.8rem; }
.resource-page .resource-gallery-buttons { display:flex; gap:.5rem; }
.resource-page .resource-gallery-btn { appearance:none; border:1px solid var(--r-border); background:#fff; color:var(--r-ink); border-radius:999px; min-width:46px; min-height:46px; font-size:1.2rem; cursor:pointer; }
.resource-page .resource-gallery-btn:hover,
.resource-page .resource-gallery-btn:focus-visible { border-color:var(--r-orange-dark); outline:3px solid rgba(216,100,61,.18); }
.resource-page .resource-gallery-btn:disabled { opacity:.42; cursor:not-allowed; }
.resource-page .resource-gallery-status { color:var(--r-muted); font-size:.9rem; }
.resource-page .resource-gallery-thumbs { display:grid; grid-template-columns:repeat(8,1fr); gap:.5rem; margin-top:.8rem; }
.resource-page .resource-gallery-thumb { padding:0; border:3px solid transparent; border-radius:10px; overflow:hidden; background:transparent; cursor:pointer; }
.resource-page .resource-gallery-thumb img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.resource-page .resource-gallery-thumb[aria-current="true"] { border-color:var(--r-orange-dark); }
.resource-page .resource-gallery-thumb:focus-visible { outline:3px solid var(--r-yellow); outline-offset:2px; }
.resource-page .resource-answer { margin:1.2rem 0; border-left:6px solid var(--r-orange); background:#fff; border-radius:0 14px 14px 0; padding:1.2rem 1.25rem; box-shadow:0 8px 25px rgba(60,60,60,.06); }
.resource-page .resource-answer strong { color:var(--r-orange-dark); }
.resource-page .resource-cta { margin:3rem auto 4rem; width:min(calc(100% - 2rem),1180px); background:var(--r-ink); color:#fff; border-radius:var(--r-radius); padding:clamp(1.5rem,4vw,3rem); display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:center; }
.resource-page .resource-cta h2 { margin:0 0 .65rem; font-size:clamp(1.65rem,3.5vw,2.65rem); color:#fff; }
.resource-page .resource-cta p { margin:0; color:#ececec; max-width:720px; }
.resource-page .resource-cta-actions { display:flex; flex-wrap:wrap; gap:.7rem; }
.resource-page .resource-cta .cta-outline { border-color:#fff; color:#fff; }
.resource-page .resource-index-hero { padding:3.2rem 0 1rem; }
.resource-page .resource-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; padding:1rem 0 4rem; }
.resource-page .resource-card { border:1px solid var(--r-border); border-radius:var(--r-radius); overflow:hidden; background:#fff; min-height:100%; }
.resource-page .resource-card-body { padding:1.2rem; }
.resource-page .resource-card-tag { color:var(--r-orange-dark); font-size:.78rem; font-weight:900; text-transform:uppercase; letter-spacing:.07em; }
.resource-page .resource-card h2,
.resource-page .resource-card h3 { margin:.5rem 0 .6rem; }
.resource-page .resource-card p { color:var(--r-muted); }
.resource-page .resource-card-link { display:inline-block; margin-top:.4rem; color:var(--r-orange-dark); font-weight:800; text-underline-offset:4px; }
.resource-page .resource-card--featured { grid-column:span 2; }
.resource-page .resource-card--featured img { width:100%; aspect-ratio:16/9; object-fit:cover; }
@media (max-width:900px) {
  .resource-page .resource-facts,
  .resource-page .resource-process { grid-template-columns:repeat(2,1fr); }
  .resource-page .resource-two-col { grid-template-columns:1fr; }
  .resource-page .resource-gallery-thumbs { grid-template-columns:repeat(4,1fr); }
  .resource-page .resource-cards { grid-template-columns:1fr 1fr; }
  .resource-page .resource-card--featured { grid-column:span 2; }
  .resource-page .resource-cta { grid-template-columns:1fr; }
}
@media (max-width:620px) {
  .resource-page .resource-hero { padding-top:1.8rem; }
  .resource-page .resource-hero-media img { aspect-ratio:4/3; }
  .resource-page .resource-facts,
  .resource-page .resource-process { grid-template-columns:1fr 1fr; }
  .resource-page .resource-gallery-thumbs { grid-template-columns:repeat(4,1fr); }
  .resource-page .resource-cards { grid-template-columns:1fr; }
  .resource-page .resource-card--featured { grid-column:auto; }
}
@media (max-width:420px) {
  .resource-page .resource-facts,
  .resource-page .resource-process { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) {
  .resource-page *, .resource-page *::before, .resource-page *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

/* Ajuste visual v3 — imágenes más contenidas en escritorio */
@media (min-width: 901px) {
  .resource-page .resource-hero-media {
    width: min(100%, 1040px);
    margin: 2rem auto 0;
  }

  .resource-page .resource-gallery {
    width: min(100%, 980px);
    margin: 1.6rem auto 0;
  }

  .resource-page .resource-gallery-slide img {
    aspect-ratio: 16 / 10;
    max-height: 610px;
    object-fit: cover;
  }
}

@media (min-width: 621px) and (max-width: 900px) {
  .resource-page .resource-gallery-slide img {
    aspect-ratio: 4 / 3;
    max-height: 620px;
    object-fit: cover;
  }
}


/* Portada de Recursos: imagen destacada más contenida */
@media (min-width: 901px) {
  .resource-page .resource-card--featured img {
    max-height: 500px;
    object-position: center 58%;
  }
}


/* Guías y segundo contenido */
.resource-page .resource-meta {
  display:flex;
  flex-wrap:wrap;
  gap:.55rem 1rem;
  align-items:center;
  margin-top:1rem;
  color:var(--r-muted);
  font-size:.92rem;
}
.resource-page .resource-meta time { font-weight:700; color:var(--r-ink); }

.resource-page .resource-cards--two {
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.resource-page .resource-cards--two .resource-card--featured {
  grid-column:auto;
}
.resource-page .resource-card-visual {
  min-height:310px;
  background:linear-gradient(135deg,#f6f6f6 0%,#fff8df 100%);
  display:grid;
  place-items:center;
  padding:2rem;
  border-bottom:1px solid var(--r-border);
}
.resource-page .guide-illustration {
  width:min(100%,520px);
  display:grid;
  gap:1rem;
}
.resource-page .guide-roof {
  position:relative;
  min-height:180px;
  border-radius:24px 24px 16px 16px;
  background:#fff;
  border:1px solid var(--r-border);
  box-shadow:var(--r-shadow);
  padding:1.2rem;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:.55rem;
  transform:skewY(-3deg);
}
.resource-page .guide-panel {
  min-height:62px;
  border-radius:8px;
  background:linear-gradient(145deg,#476f99,#26435e);
  border:2px solid rgba(255,255,255,.7);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.15);
}
.resource-page .guide-chip-row {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:.6rem;
}
.resource-page .guide-chip {
  border-radius:14px;
  border:1px solid var(--r-border);
  background:#fff;
  padding:.75rem .8rem;
  text-align:center;
  font-size:.82rem;
  font-weight:800;
  color:var(--r-ink);
}
.resource-page .guide-chip b {
  display:block;
  color:var(--r-orange-dark);
  font-size:1rem;
}
.resource-page .resource-answer--large {
  max-width:880px;
  padding:1.35rem 1.4rem;
}
.resource-page .resource-answer--large p {
  font-size:1.12rem;
  margin:.2rem 0;
}
.resource-page .guide-flow {
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:.65rem;
  margin:1.6rem 0;
}
.resource-page .guide-flow-step {
  position:relative;
  min-height:118px;
  border:1px solid var(--r-border);
  border-radius:16px;
  background:#fff;
  padding:1rem;
}
.resource-page .guide-flow-step b {
  display:block;
  color:var(--r-orange-dark);
  font-size:1.35rem;
  line-height:1;
  margin-bottom:.55rem;
}
.resource-page .guide-flow-step span {
  font-size:.9rem;
  line-height:1.35;
  color:var(--r-ink);
}
.resource-page .guide-factor-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
  margin-top:1.4rem;
}
.resource-page .guide-factor {
  border:1px solid var(--r-border);
  border-radius:18px;
  background:#fff;
  padding:1.25rem;
}
.resource-page .guide-factor h3 { margin:.1rem 0 .55rem; }
.resource-page .guide-factor p { margin:0; color:var(--r-muted); }
.resource-page .formula-card {
  max-width:760px;
  background:var(--r-ink);
  color:#fff;
  border-radius:20px;
  padding:1.5rem;
  margin:1.4rem 0;
}
.resource-page .formula-card p { color:#efefef; margin:.35rem 0; }
.resource-page .formula {
  display:block;
  margin:.85rem 0;
  font-size:clamp(1.3rem,3vw,2rem);
  font-weight:900;
  color:var(--r-yellow);
  letter-spacing:-.02em;
}
.resource-page .guide-checklist {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.75rem;
  list-style:none;
  padding:0;
  margin:1.2rem 0 0;
}
.resource-page .guide-checklist li {
  position:relative;
  border:1px solid var(--r-border);
  border-radius:14px;
  background:#fff;
  padding:.9rem 1rem .9rem 2.6rem;
}
.resource-page .guide-checklist li::before {
  content:"✓";
  position:absolute;
  left:1rem;
  top:.85rem;
  color:var(--r-green,#7fad52);
  font-weight:900;
}
.resource-page .resource-source-list {
  max-width:880px;
  margin:1rem 0 0;
  padding-left:1.2rem;
}
.resource-page .resource-source-list li { margin:.65rem 0; }
.resource-page .resource-source-list a {
  color:var(--r-orange-dark);
  text-underline-offset:3px;
  font-weight:700;
}
.resource-page .related-project {
  display:grid;
  grid-template-columns:minmax(220px,.7fr) minmax(0,1fr);
  gap:1.4rem;
  align-items:center;
  border:1px solid var(--r-border);
  border-radius:var(--r-radius);
  overflow:hidden;
  background:#fff;
}
.resource-page .related-project img {
  width:100%;
  height:100%;
  min-height:250px;
  object-fit:cover;
}
.resource-page .related-project__body { padding:1.4rem 1.4rem 1.4rem 0; }
.resource-page .related-project__body h3 { margin:.35rem 0 .6rem; font-size:1.45rem; }
.resource-page .related-project__body p { color:var(--r-muted); }

.resource-page .resource-topic-strip {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.8rem;
  padding:0 0 3.5rem;
}
.resource-page .resource-topic {
  border:1px solid var(--r-border);
  border-radius:16px;
  padding:1rem 1.05rem;
  background:var(--r-soft);
}
.resource-page .resource-topic strong { display:block; margin-bottom:.25rem; }
.resource-page .resource-topic a { color:var(--r-orange-dark); font-weight:800; text-underline-offset:3px; }

@media (max-width:900px) {
  .resource-page .resource-cards--two { grid-template-columns:1fr; }
  .resource-page .guide-flow { grid-template-columns:repeat(3,1fr); }
  .resource-page .related-project { grid-template-columns:1fr; }
  .resource-page .related-project__body { padding:0 1.2rem 1.3rem; }
  .resource-page .resource-topic-strip { grid-template-columns:1fr 1fr; }
}
@media (max-width:620px) {
  .resource-page .guide-flow { grid-template-columns:1fr 1fr; }
  .resource-page .guide-factor-grid,
  .resource-page .guide-checklist,
  .resource-page .guide-chip-row,
  .resource-page .resource-topic-strip { grid-template-columns:1fr; }
  .resource-page .resource-card-visual { min-height:260px; padding:1.25rem; }
  .resource-page .guide-roof { min-height:150px; }
}


/* v3: prioridad a fotografía real */
.resource-page .resource-photo {
  margin:2rem 0 0;
  border-radius:var(--r-radius);
  overflow:hidden;
  border:1px solid var(--r-border);
  background:#fff;
  box-shadow:var(--r-shadow);
}
.resource-page .resource-photo img {
  width:100%;
  max-height:620px;
  aspect-ratio:16/9;
  object-fit:cover;
}
.resource-page .resource-photo figcaption {
  padding:.75rem 1rem;
  color:var(--r-muted);
  font-size:.86rem;
  background:#fff;
}
.resource-page .resource-card > picture img,
.resource-page .resource-card > img {
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
  max-height:430px;
}
.resource-page .photo-credit {
  font-size:.78rem;
  color:var(--r-muted);
}
.resource-page .photo-credit a {
  color:inherit;
  text-underline-offset:2px;
}
.resource-page .energy-flow {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.8rem;
  margin:1.5rem 0;
}
.resource-page .energy-flow__step {
  border:1px solid var(--r-border);
  border-radius:16px;
  background:#fff;
  padding:1rem;
}
.resource-page .energy-flow__step b {
  display:block;
  color:var(--r-orange-dark);
  font-size:1.1rem;
  margin-bottom:.35rem;
}
.resource-page .energy-flow__step span {
  color:var(--r-muted);
  font-size:.92rem;
}
.resource-page .definition-box {
  max-width:900px;
  background:var(--r-soft);
  border-left:6px solid var(--r-yellow);
  border-radius:0 16px 16px 0;
  padding:1.25rem 1.35rem;
  margin:1.2rem 0;
}
.resource-page .definition-box p { margin:.25rem 0; font-size:1.08rem; }
.resource-page .comparison-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
  margin-top:1.2rem;
}
.resource-page .comparison-card {
  border:1px solid var(--r-border);
  border-radius:18px;
  background:#fff;
  padding:1.25rem;
}
.resource-page .comparison-card h3 { margin:.1rem 0 .55rem; }
.resource-page .comparison-card p { margin:0; color:var(--r-muted); }

@media (max-width:900px){
  .resource-page .energy-flow{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:620px){
  .resource-page .energy-flow,
  .resource-page .comparison-grid{grid-template-columns:1fr}
  .resource-page .resource-photo img{aspect-ratio:4/3;max-height:none}
}