/* Fotomarina V21.8 · condensación suave de portada.
   Basada en V21.7 protegida. Solo reorganiza la portada; galerías, curso,
   comentadas, premios, firmas, APIs y navegación histórica se conservan. */

.v218-quick{
  max-width:1250px;
  margin:0 auto;
  padding:64px 30px 72px;
}
.v218-quick-title{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:40px;
  margin-bottom:24px;
}
.v218-quick-title .eyebrow{margin-bottom:8px}
.v218-quick-title h2{
  margin:0;
  font:800 clamp(29px,3vw,43px)/1.05 var(--display);
  letter-spacing:-.035em;
}
.v218-quick-title>p{
  margin:0;
  max-width:470px;
  color:var(--muted);
  line-height:1.55;
}
.v218-quick-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}
.v218-quick-card{
  position:relative;
  min-height:220px;
  border:1px solid rgba(120,210,235,.24);
  border-radius:8px;
  overflow:hidden;
  background:#06141c var(--card-bg) center/cover no-repeat;
  color:#fff;
  transition:transform .2s ease,border-color .2s ease;
}
.v218-quick-card:hover{transform:translateY(-3px);border-color:rgba(31,191,255,.8)}
.v218-quick-card .v218-shade{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,6,10,.06) 10%,rgba(1,9,14,.24) 38%,rgba(1,9,14,.96) 100%);
}
.v218-quick-card>div{
  position:absolute;
  left:18px;right:18px;bottom:17px;
  z-index:2;
}
.v218-quick-card small{
  color:var(--accent);
  font:800 9px var(--display);
  letter-spacing:.18em;
}
.v218-quick-card h3{
  margin:5px 0 4px;
  font:800 19px/1.12 var(--display);
}
.v218-quick-card p{
  margin:0;
  padding-right:28px;
  color:#bdd0d5;
  font-size:12px;
  line-height:1.35;
}
.v218-quick-card b{
  position:absolute;right:0;bottom:-2px;
  color:var(--accent);
  font-size:22px;
  font-weight:400;
}

/* Sobre mí: conserva todo el contenido, pero la portada enseña primero un resumen. */
.v218-about{padding-top:76px!important;padding-bottom:74px!important}
.v218-about .about-photo{height:510px}
.v218-about .bio p:nth-child(n+3){display:none}
.v218-about.v218-about-open .bio p{display:block}
.v218-about-more{
  margin-top:12px;
  border:1px solid var(--accent);
  background:rgba(5,28,38,.55);
  color:#fff;
  padding:11px 16px;
  border-radius:5px;
  cursor:pointer;
  font:800 10px var(--display);
  letter-spacing:.1em;
}
.v218-about-more:hover{background:var(--accent);color:#021219}

/* Últimas tres comentadas: muestra novedades sin duplicar la galería completa. */
.v218-latest{
  max-width:1250px;
  margin:0 auto;
  padding:72px 30px 78px;
  border-top:1px solid var(--line);
}
.v218-section-head{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:30px;
  margin-bottom:24px;
}
.v218-section-head .eyebrow{margin-bottom:8px}
.v218-section-head h2{
  margin:0;
  font:800 clamp(28px,3vw,42px)/1.06 var(--display);
  letter-spacing:-.035em;
}
.v218-section-head>a{
  color:var(--accent);
  font:800 10px var(--display);
  letter-spacing:.12em;
  white-space:nowrap;
}
.v218-latest-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.v218-story{
  aspect-ratio:16/9;
  position:relative;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:7px;
  background:#06151d var(--story-bg) center/cover no-repeat;
}
.v218-story>span{
  position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 24%,rgba(0,7,11,.93) 100%);
}
.v218-story>div{position:absolute;left:17px;right:17px;bottom:15px;z-index:2}
.v218-story small{display:block;color:var(--accent);font:800 8px var(--display);letter-spacing:.16em;margin-bottom:5px}
.v218-story h3{margin:0;font:800 18px/1.12 var(--display)}
.v218-story em{display:block;margin-top:4px;color:#c4d5d9;font:italic 12px Georgia,serif}

/* Premios mantiene sus cuatro referencias, pero ocupa menos altura. */
.v218-achievements{padding-top:70px!important;padding-bottom:74px!important;border-top:1px solid var(--line)}
.v218-achievements .about-text h2{font-size:clamp(34px,4vw,52px)!important}
.v218-achievements .awards-list{gap:14px!important;margin-top:25px!important}
.v218-achievements .awards-list p{padding:20px 18px!important;min-height:104px!important;margin:0!important}
.v218-achievements .button{margin-top:22px!important}

/* El final de la portada respira, pero sin grandes vacíos. */
#guestbook{padding-top:66px!important;padding-bottom:66px!important}
.contact{padding-top:78px!important;padding-bottom:78px!important}

@media (max-width:1050px){
  .v218-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v218-quick-card{min-height:200px}
  .v218-about .about-photo{height:470px}
}

@media (max-width:760px){
  .v218-quick{padding:30px 18px 30px}
  .v218-quick-title{display:block}
  .v218-quick-title>p{margin-top:12px}
  .v218-quick-grid{grid-template-columns:1fr 1fr;gap:10px}
  .v218-quick-card{min-height:170px}
  .v218-quick-card>div{left:13px;right:13px;bottom:13px}
  .v218-quick-card h3{font-size:16px}
  .v218-quick-card p{font-size:10px;padding-right:0}
  .v218-quick-card b{display:none}
  .v218-about{padding-top:54px!important;padding-bottom:56px!important}
  .v218-about .about-photo{height:400px}
  .v218-latest{padding:52px 18px 58px}
  .v218-section-head{display:block}
  .v218-section-head>a{display:inline-block;margin-top:13px}
  .v218-latest-grid{grid-template-columns:1fr;gap:12px}
  .v218-story{aspect-ratio:16/9}
  .v218-achievements{padding-top:54px!important;padding-bottom:58px!important}
  #guestbook{padding-top:50px!important;padding-bottom:54px!important}
  .contact{padding-top:58px!important;padding-bottom:58px!important}
}

@media (max-width:470px){
  .v218-quick-grid{grid-template-columns:1fr}
  .v218-quick-card{min-height:150px}
}


/* Tercer intento: mantener la sensación de la V21.7 con una portada algo más concentrada. */
.v218-end{
  max-width:1250px;
  margin:0 auto;
  padding:68px 30px 78px;
  border-top:1px solid var(--line);
}
.v218-end-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr 1.1fr;
  gap:18px;
  align-items:stretch;
}
.v218-end-card{
  border:1px solid rgba(120,210,235,.20);
  border-radius:10px;
  background:linear-gradient(180deg,rgba(5,24,33,.58),rgba(4,13,18,.96));
  padding:24px 22px;
}
.v218-end-card h2{
  margin:0 0 14px;
  font:800 clamp(25px,2.35vw,36px)/1.08 var(--display);
  letter-spacing:-.03em;
}
.v218-end-card p{
  color:#c6d5d9;
  line-height:1.62;
  margin:0 0 12px;
}
.v218-end-card .button{margin-top:10px}
.v218-end-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:8px}
.v218-inline-link{font:800 10px var(--display);letter-spacing:.12em;color:var(--accent)}
.v218-count-line{
  margin-top:14px!important;
  color:#9eb2b7!important;
  font-size:13px;
}
.v218-contact-actions{display:grid;grid-template-columns:1fr;gap:12px;margin-top:8px}
.v218-end .facebook{display:inline-block;margin-top:14px}
.v218-end-about em,.v218-end-card h2 em{font-family:Georgia,serif;font-style:italic;font-weight:500}
.v218-achievements{padding-bottom:62px!important}
#guestbook{padding-top:0!important;padding-bottom:0!important}
.contact{padding-top:0!important;padding-bottom:0!important}

@media (max-width:1050px){
  .v218-end-grid{grid-template-columns:1fr 1fr}
  .v218-end-about{grid-column:1 / -1}
}
@media (max-width:760px){
  .v218-end{padding:30px 18px 42px}
  .v218-end-grid{grid-template-columns:1fr;gap:14px}
  .v218-end-card{padding:20px 16px}
  .v218-end-card h2{font-size:28px}
}