/* ============ TEMPLATE EMBER — SOBRE MÍ ============ */

/* 1. HERO */
.sm-hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;}
.sm-hero-media{position:absolute;inset:0;z-index:0;}
.sm-hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(42,35,32,.55) 0%,rgba(42,35,32,.3) 45%,rgba(42,35,32,.6) 100%);}
.sm-hero-inner{position:relative;z-index:2;max-width:820px;padding:0 30px;}
.sm-hero .eyebrow{color:#D8D2C6;display:block;margin-bottom:24px;}
.sm-hero h1{font-family:var(--title);font-weight:300;color:var(--cream);font-size:clamp(44px,7vw,96px);line-height:1.02;letter-spacing:.02em;margin-bottom:22px;}
.sm-hero h1 em{font-weight:400;}
.sm-hero p{font-family:var(--title);font-style:italic;font-size:clamp(18px,2vw,24px);color:#E4DED2;max-width:520px;margin:0 auto;line-height:1.5;}
.sm-hero-scroll{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);z-index:2;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:#D8D2C6;opacity:.85;}

/* 2. HISTORIA */
.sm-story{background:var(--paper);padding:130px 0;}
.sm-story-grid{display:grid;grid-template-columns:1fr 1.05fr 1fr;gap:46px;align-items:start;}
.sm-story-left{padding-top:30px;}
.sm-story-left h2{font-family:var(--title);font-weight:400;text-transform:uppercase;font-size:clamp(26px,2.6vw,40px);line-height:1.18;letter-spacing:.01em;color:var(--ink);}
.sm-story-left h2 em{text-transform:none;font-weight:400;}
.sm-mini{position:relative;width:150px;height:180px;overflow:hidden;margin-top:44px;background:var(--paper-2);}
.sm-portrait{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--paper-2);}
.sm-portrait figcaption{position:absolute;left:0;bottom:-26px;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);}
.sm-story-right{display:flex;flex-direction:column;gap:18px;padding-top:60px;}
.sm-mini-top{position:relative;width:130px;height:150px;overflow:hidden;align-self:flex-end;background:var(--paper-2);margin-bottom:8px;}
.sm-story-right p{font-size:14px;line-height:1.95;color:var(--ink);opacity:.85;}

/* 3. DATOS RÁPIDOS */
.sm-facts{background:var(--paper);padding:0 0 120px;}
.sm-facts-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;max-width:920px;margin:0 auto;padding-top:50px;border-top:1px solid var(--line);text-align:center;}
.sm-fact .num{font-family:var(--title);font-style:italic;font-weight:400;font-size:clamp(34px,3.6vw,52px);color:var(--ink);display:block;margin-bottom:8px;}
.sm-fact span{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);}

/* 4. MI FILOSOFÍA (berenjena) */
.sm-philos{background:var(--espresso);color:var(--cream);padding:40px 0 130px;position:relative;overflow:hidden;}
.sm-philos .backword{position:absolute;top:60px;left:0;right:0;text-align:center;font-family:var(--title);font-weight:400;font-size:clamp(60px,13vw,180px);line-height:.9;color:var(--cream);opacity:.09;letter-spacing:.02em;white-space:nowrap;pointer-events:none;z-index:0;}
.sm-philos-inner{position:relative;z-index:2;}
.sm-philos-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;max-width:980px;margin:130px auto 0;}
.sm-philos-photos figure{position:relative;aspect-ratio:3/4;overflow:hidden;background:#241d1a;}
.sm-philos-photos img,.sm-philos-photos video{filter:none;}
.sm-philos-photos .ph{position:absolute;inset:0;background:linear-gradient(135deg,#241d1a,#3a302b);}
.sm-philos-caps{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;max-width:980px;margin:40px auto 0;text-align:center;}
.sm-cap .num{font-family:var(--title);font-style:italic;font-size:22px;color:#CFC8BC;display:block;margin-bottom:10px;}
.sm-cap h3{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--cream);margin-bottom:12px;}
.sm-cap p{font-size:13px;line-height:1.85;color:#CFC8BC;max-width:250px;margin:0 auto;}

/* 5. MANIFIESTO */
.sm-focus{background:var(--paper);padding:0 0 130px;}
.sm-focus-grid{display:grid;grid-template-columns:1.05fr 1fr;align-items:stretch;gap:0;}
.sm-focus-left{padding:70px 60px 70px 0;display:flex;align-items:center;}
.sm-focus-left h2{font-family:var(--title);font-weight:400;text-transform:uppercase;font-size:clamp(30px,3.8vw,58px);line-height:1.1;color:var(--ink);}
.sm-focus-left h2 em{text-transform:none;font-style:italic;}
.sm-focus-right{position:relative;min-height:520px;overflow:hidden;background:#241d1a;}
.sm-focus-right::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(42,35,32,.15),rgba(42,35,32,.55));}
.sm-focus-right .ph{position:absolute;inset:0;background:linear-gradient(135deg,#241d1a,#3a302b);}
.sm-focus-card{position:absolute;right:40px;bottom:44px;z-index:2;max-width:330px;text-align:left;color:var(--cream);}
.sm-focus-card .eyebrow{color:#D8D2C6;display:block;margin-bottom:16px;}
.sm-focus-card p{font-size:13.5px;line-height:1.9;color:#DAD5CB;margin-bottom:22px;}
.sm-focus-card .read-link{color:var(--cream);}

/* 6. FRANJA DE CITA */
.sm-quote{position:relative;min-height:66vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;color:var(--cream);}
.sm-quote-media{position:absolute;inset:0;z-index:0;}
.sm-quote-media::after{content:"";position:absolute;inset:0;background:rgba(42,35,32,.62);}
.sm-quote-inner{position:relative;z-index:2;max-width:720px;padding:0 30px;}
.sm-quote-inner h2{font-family:var(--title);font-weight:400;font-style:italic;font-size:clamp(28px,3.8vw,50px);line-height:1.25;margin-bottom:20px;}
.sm-quote-inner p{font-size:13px;letter-spacing:.04em;color:#CFC8BC;}

/* 7. CTA (papel) */
.sm-cta{background:var(--paper);color:var(--ink);text-align:center;padding:120px 0;}
.sm-cta .eyebrow{color:var(--muted);display:block;margin-bottom:22px;}
.sm-cta h2{font-family:var(--title);font-weight:300;font-size:clamp(32px,4.4vw,60px);line-height:1.1;margin-bottom:22px;color:var(--ink);}
.sm-cta h2 em{font-style:italic;}
.sm-cta p{font-size:14.5px;color:var(--muted);max-width:480px;margin:0 auto 38px;line-height:1.85;}

/* ============ RESPONSIVE ============ */
@media (max-width:900px){
  .sm-story-grid{grid-template-columns:1fr;gap:30px;}
  .sm-story-left,.sm-story-right{padding-top:0;}
  .sm-portrait{max-width:420px;margin:0 auto;}
  .sm-mini,.sm-mini-top{align-self:flex-start;}
  .sm-facts-grid{grid-template-columns:1fr 1fr;gap:34px 20px;}
  .sm-philos-photos,.sm-philos-caps{grid-template-columns:1fr;max-width:360px;}
  .sm-philos-photos{margin-top:90px;}
  .sm-focus-grid{grid-template-columns:1fr;}
  .sm-focus-left{padding:70px 0 40px;}
  .sm-focus-right{min-height:420px;}
  .sm-focus-card{position:static;margin:24px;max-width:none;}
}
@media (max-width:600px){
  .sm-hero{min-height:88vh;}
  .sm-hero h1{font-size:clamp(40px,13vw,60px);}
  .sm-story{padding:80px 0;}
  .sm-facts-grid{grid-template-columns:1fr 1fr;}
  .sm-cta{padding:90px 0;}
}