/* ==========================================================================
   Alek Montesinos — Site styles
   Clean, semantic CSS. Easy to port to a WordPress theme.
   ========================================================================== */

/* ----- Brand tokens (mirror of brand-assets/colors/colors.css) ----- */
:root{
  --am-white-warm:  #F5F0EB;
  --am-charcoal:    #2C2C2C;
  --am-stone-gray:  #8C8279;
  --am-terracotta:  #C0792D;
  --am-sand:        #D4C5B2;
  --am-olive-green: #7A8B6F;

  --am-bg:          var(--am-white-warm);
  --am-bg-alt:      var(--am-sand);
  --am-bg-invert:   var(--am-charcoal);
  --am-text:        var(--am-charcoal);
  --am-text-muted:  var(--am-stone-gray);
  --am-text-invert: var(--am-white-warm);
  --am-rule:        rgba(140, 130, 121, 0.55);
  --am-rule-strong: rgba(140, 130, 121, 0.9);
  --am-accent:      var(--am-terracotta);

  --am-font-display:"Cormorant Garamond","Cormorant",Georgia,"Times New Roman",serif;
  --am-font-sans:   "DM Sans",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;

  --am-tr-logo:      0.18em;
  --am-tr-eyebrow:   0.22em;
  --am-tr-descriptor:0.42em;

  --am-maxw: 1440px;
  --am-pad-x: clamp(20px, 4vw, 64px);
  --am-section-y: clamp(80px, 12vw, 160px);
}

/* ----- Reset + base ----- */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--am-bg);
  color:var(--am-text);
  font-family:var(--am-font-sans);
  font-weight:300;
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
hr{border:0;height:1px;background:var(--am-rule);margin:0}

/* ----- Typography roles ----- */
.serif{font-family:var(--am-font-display)}
.eyebrow{
  font-family:var(--am-font-sans);
  font-weight:400;
  font-size:11px;
  letter-spacing:var(--am-tr-eyebrow);
  text-transform:uppercase;
  color:var(--am-text-muted);
}
.eyebrow--dark{color:var(--am-text)}
.caption{
  font-family:var(--am-font-display);
  font-style:italic;
  font-weight:300;
  font-size:13px;
  color:var(--am-text-muted);
}
.display{
  font-family:var(--am-font-display);
  font-weight:300;
  font-size:clamp(48px, 7vw, 96px);
  line-height:1.04;
  letter-spacing:-0.005em;
}
.display em{font-style:italic;font-weight:300;color:var(--am-text-muted)}
.h2{
  font-family:var(--am-font-display);
  font-weight:300;
  font-size:clamp(36px, 5.2vw, 64px);
  line-height:1.08;
  letter-spacing:-0.005em;
  margin:0;
}
.h2 em{font-style:italic;font-weight:300}
.h3{
  font-family:var(--am-font-display);
  font-weight:400;
  font-size:clamp(22px, 2.4vw, 28px);
  line-height:1.2;
  margin:0;
}
.lead{
  font-family:var(--am-font-display);
  font-weight:300;
  font-size:clamp(20px, 2vw, 26px);
  line-height:1.45;
  color:var(--am-text);
}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}

/* ----- Containers + layout primitives ----- */
.container{
  width:100%;
  max-width:var(--am-maxw);
  margin-inline:auto;
  padding-inline:var(--am-pad-x);
}
.section{padding-block:var(--am-section-y)}
.section--alt{background:var(--am-bg-alt)}
.section--invert{background:var(--am-bg-invert);color:var(--am-text-invert)}
.section--invert .eyebrow{color:rgba(245,240,235,.65)}
.section--invert .caption{color:rgba(245,240,235,.7)}

.section-head{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:end;
  gap:24px;
  margin-bottom:clamp(40px, 6vw, 80px);
  padding-bottom:24px;
  border-bottom:.5px solid var(--am-rule);
}
.section-head .index{
  font-family:var(--am-font-display);
  font-style:italic;
  font-weight:300;
  font-size:14px;
  color:var(--am-text-muted);
}
.section-head__title{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.section-head__meta{display:flex;flex-direction:column;align-items:flex-end;gap:6px;text-align:right}

/* ----- Header / Nav ----- */
.site-header{
  position:fixed;top:0;left:0;right:0;
  z-index:50;
  padding:18px var(--am-pad-x);
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:24px;
  color:var(--am-text-invert);
  mix-blend-mode:normal;
  transition:background .35s ease, color .35s ease, padding .35s ease, border-color .35s ease;
  border-bottom:.5px solid transparent;
}
.site-header.is-scrolled{
  background:var(--am-bg);
  color:var(--am-text);
  border-bottom-color:var(--am-rule);
  padding-block:14px;
}
.site-header__brand{
  font-family:var(--am-font-display);
  font-weight:300;
  font-size:18px;
  letter-spacing:0.12em;
  padding-left:.12em;
}
.site-header__brand .dot{color:var(--am-accent)}
.site-header__nav{
  display:flex;
  justify-content:center;
  gap:clamp(20px, 3vw, 44px);
  font-family:var(--am-font-sans);
  font-weight:300;
  font-size:13px;
  letter-spacing:.08em;
}
.site-header__nav a{
  position:relative;
  padding:6px 0;
  transition:color .2s ease;
}
.site-header__nav a:hover{color:var(--am-accent)}
.site-header__nav a::after{
  content:"";position:absolute;left:0;right:0;bottom:0;
  height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:left;
  transition:transform .3s ease;
}
.site-header__nav a:hover::after{transform:scaleX(1)}
.site-header__cta{
  font-family:var(--am-font-sans);
  font-weight:300;
  font-size:12px;
  letter-spacing:.22em;
  text-transform:uppercase;
  padding-left:.22em;
  border:.5px solid currentColor;
  padding:10px 18px;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.site-header__cta:hover{background:var(--am-accent);border-color:var(--am-accent);color:#fff}

/* Header variants */
body[data-nav="centered"] .site-header{grid-template-columns:1fr auto 1fr}
body[data-nav="centered"] .site-header__brand{grid-column:2}
body[data-nav="centered"] .site-header__nav{grid-column:1 / -1;grid-row:2;margin-top:6px}
body[data-nav="minimal"] .site-header__nav{display:none}
body[data-nav="minimal"] .site-header__cta{display:inline-block}
body[data-nav="minimal"] .site-header__brand{font-family:var(--am-font-display);font-size:28px;letter-spacing:0}

/* ----- Hero / Portada ----- */
.hero{
  position:relative;
  height:100vh;
  min-height:640px;
  background:var(--am-charcoal);
  color:var(--am-text-invert);
  overflow:hidden;
}
.hero__media{
  position:absolute;inset:0;
  z-index:0;
}
.hero__media image-slot,
.hero__media .photo-slot{width:100%;height:100%;display:block}
.hero__media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,0) 35%, rgba(0,0,0,0) 65%, rgba(0,0,0,.45) 100%);
  pointer-events:none;
  z-index:1;
}
.hero__content{
  position:relative;z-index:2;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:120px var(--am-pad-x) 100px;
}
.hero__name{
  font-family:var(--am-font-display);
  font-weight:300;
  font-size:clamp(24px, 4vw, 60px);
  letter-spacing:0.16em;
  padding-left:.16em;
  line-height:1;
  text-shadow:0 1px 30px rgba(0,0,0,.2);
}
.hero__rule{width:64px;height:1px;background:var(--am-accent);margin:32px 0 28px}
.hero__descriptor{
  font-family:var(--am-font-sans);
  font-weight:300;
  font-size:14px;
  letter-spacing:.42em;
  text-transform:uppercase;
  padding-left:.42em;
}
.hero__tagline{
  font-family:var(--am-font-display);
  font-style:italic;
  font-weight:300;
  font-size:clamp(20px, 2vw, 26px);
  max-width:24ch;
  margin-top:44px;
  line-height:1.4;
  opacity:.92;
}
.hero__meta{
  position:absolute;
  bottom:36px;left:var(--am-pad-x);right:var(--am-pad-x);
  display:flex;justify-content:space-between;align-items:flex-end;
  z-index:2;
  font-family:var(--am-font-sans);font-weight:300;font-size:11px;
  letter-spacing:.22em;text-transform:uppercase;
  color:rgba(245,240,235,.7);
}
.hero__meta .scroll-cue{display:flex;align-items:center;gap:14px}
.hero__meta .scroll-cue::before{content:"";display:block;width:34px;height:1px;background:rgba(245,240,235,.5)}

/* Hero variants */
body[data-hero="corner"] .hero__content{align-items:flex-start;text-align:left;justify-content:flex-end;padding-bottom:120px}
body[data-hero="corner"] .hero__name{font-size:clamp(72px, 11vw, 180px);letter-spacing:-0.01em;padding-left:0;font-style:normal}
body[data-hero="corner"] .hero__rule{margin-left:0}
body[data-hero="corner"] .hero__descriptor{align-self:flex-start}

body[data-hero="editorial"] .hero{display:grid;grid-template-columns:1.2fr .8fr;height:100vh}
body[data-hero="editorial"] .hero__media{position:relative;grid-column:1}
body[data-hero="editorial"] .hero__content{
  grid-column:2;background:var(--am-bg);color:var(--am-text);
  align-items:flex-start;text-align:left;
  padding:var(--am-pad-x);justify-content:space-between;
}
body[data-hero="editorial"] .hero__name{font-size:clamp(40px, 5vw, 76px);text-shadow:none}
body[data-hero="editorial"] .hero__tagline{opacity:1;color:var(--am-text-muted)}
body[data-hero="editorial"] .hero__meta{color:var(--am-text-muted);position:static;padding:0;margin-top:auto}

body[data-hero="cinematic"] .hero__content{justify-content:flex-end;align-items:flex-start;text-align:left;padding-bottom:140px}
body[data-hero="cinematic"] .hero__name{font-size:clamp(44px, 6vw, 96px);letter-spacing:0.08em;padding-left:.08em}
body[data-hero="cinematic"] .hero .quote-mark{
  position:absolute;top:140px;left:var(--am-pad-x);
  font-family:var(--am-font-display);font-style:italic;font-weight:300;
  font-size:clamp(32px, 4vw, 56px);max-width:18ch;line-height:1.3;
  color:var(--am-text-invert);z-index:2;
}

/* ----- Filosofía ----- */
.filosofia__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(40px, 6vw, 96px);
  align-items:start;
}
.filosofia__text{position:sticky;top:120px}
.filosofia__text .lead + .lead{margin-top:24px}
.filosofia__text .signature{
  margin-top:48px;
  display:flex;flex-direction:column;gap:6px;
}
.filosofia__photos{display:flex;flex-direction:column;gap:32px}
.filosofia__photo image-slot,
.filosofia__photo .photo-slot{display:block;aspect-ratio:4/5;width:100%}
.filosofia__photo:nth-child(2) image-slot,
.filosofia__photo:nth-child(2) .photo-slot{aspect-ratio:1/1}
.filosofia__photo .caption{margin-top:12px;display:flex;justify-content:space-between}

/* ----- Proyectos: rejilla asimétrica ----- */
.projects-grid{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  gap:clamp(24px, 3vw, 56px) clamp(20px, 2.5vw, 40px);
}
.project-card{
  display:flex;flex-direction:column;
  gap:16px;
  position:relative;
}
.project-card image-slot,
.project-card .photo-slot{
  display:block;
  width:100%;
  aspect-ratio:4/5;
  overflow:hidden;
}
.project-card .photo-slot-link{display:block;width:100%}
.project-card .photo-slot img,
.project-card .photo-slot::part(img){transition:transform .9s ease}
.project-card:hover .photo-slot img{transform:scale(1.025)}
.project-card__meta{display:flex;justify-content:space-between;align-items:baseline;gap:20px}
.project-card__title{
  font-family:var(--am-font-display);
  font-weight:300;
  font-size:clamp(22px, 2vw, 28px);
  line-height:1.15;
}
.project-card__title em{font-style:italic;color:var(--am-text-muted)}
.project-card__year{
  font-family:var(--am-font-sans);font-weight:300;font-size:13px;
  color:var(--am-text-muted);
  font-variant-numeric:tabular-nums;
}
.project-card__excerpt{
  font-family:var(--am-font-display);
  font-weight:300;
  font-size:16px;
  line-height:1.45;
  color:var(--am-text-muted);
  max-width:46ch;
}
.project-card__link{
  margin-top:auto;
  font-family:var(--am-font-sans);font-weight:400;font-size:11px;
  letter-spacing:.22em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:10px;
}
.project-card__link::after{content:"→";font-size:14px}
.project-card__num{
  position:absolute;top:0;right:0;
  font-family:var(--am-font-display);font-style:italic;font-weight:300;
  font-size:13px;color:var(--am-text-muted);
  z-index:2;
  padding:8px 12px;
}

/* Variant: magazine (asymmetric) */
body[data-grid="magazine"] .project-card:nth-child(1){grid-column:1 / 8;}
body[data-grid="magazine"] .project-card:nth-child(1) image-slot,
body[data-grid="magazine"] .project-card:nth-child(1) .photo-slot{aspect-ratio:16/10}
body[data-grid="magazine"] .project-card:nth-child(2){grid-column:9 / 13;margin-top:80px}
body[data-grid="magazine"] .project-card:nth-child(2) image-slot,
body[data-grid="magazine"] .project-card:nth-child(2) .photo-slot{aspect-ratio:3/4}
body[data-grid="magazine"] .project-card:nth-child(3){grid-column:1 / 5;}
body[data-grid="magazine"] .project-card:nth-child(3) image-slot,
body[data-grid="magazine"] .project-card:nth-child(3) .photo-slot{aspect-ratio:3/4}
body[data-grid="magazine"] .project-card:nth-child(4){grid-column:6 / 13;margin-top:40px}
body[data-grid="magazine"] .project-card:nth-child(4) image-slot,
body[data-grid="magazine"] .project-card:nth-child(4) .photo-slot{aspect-ratio:16/10}
body[data-grid="magazine"] .project-card:nth-child(5){grid-column:1 / 7;}
body[data-grid="magazine"] .project-card:nth-child(5) image-slot,
body[data-grid="magazine"] .project-card:nth-child(5) .photo-slot{aspect-ratio:4/5}
body[data-grid="magazine"] .project-card:nth-child(6){grid-column:8 / 13;margin-top:120px}
body[data-grid="magazine"] .project-card:nth-child(6) image-slot,
body[data-grid="magazine"] .project-card:nth-child(6) .photo-slot{aspect-ratio:4/5}

/* Variant: ledger (list with number/year aside) */
body[data-grid="ledger"] .projects-grid{
  grid-template-columns:1fr;
  gap:0;
}
body[data-grid="ledger"] .project-card{
  display:grid;
  grid-template-columns:60px 1fr 1.4fr 1fr;
  gap:32px;
  align-items:center;
  padding:36px 0;
  border-bottom:.5px solid var(--am-rule);
  margin-top:0 !important;
}
body[data-grid="ledger"] .project-card:first-child{border-top:.5px solid var(--am-rule)}
body[data-grid="ledger"] .project-card image-slot,
body[data-grid="ledger"] .project-card .photo-slot{aspect-ratio:4/3;max-width:280px}
body[data-grid="ledger"] .project-card__num{position:static;padding:0;font-size:14px}
body[data-grid="ledger"] .project-card__meta{flex-direction:column;align-items:flex-start;gap:8px}
body[data-grid="ledger"] .project-card__excerpt{display:none}
body[data-grid="ledger"] .project-card__link{margin-top:0}

/* Variant: uniform grid */
body[data-grid="uniform"] .projects-grid{
  grid-template-columns:repeat(3, 1fr);
  gap:clamp(40px, 5vw, 72px) clamp(24px, 3vw, 40px);
}
body[data-grid="uniform"] .project-card{grid-column:span 1;margin-top:0 !important}
body[data-grid="uniform"] .project-card image-slot,
body[data-grid="uniform"] .project-card .photo-slot{aspect-ratio:4/5}

/* ----- Sobre mí ----- */
.about__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(40px, 6vw, 96px);
  align-items:start;
}
.about__photo image-slot,
.about__photo .photo-slot{display:block;aspect-ratio:9/16;width:100%;background:transparent}
.about__photo image-slot::part(frame){background:transparent}
.about__text{padding-top:clamp(0px, 4vw, 40px)}
.about__text .lead{margin-bottom:32px}
.about__text p{margin-bottom:1.4em;max-width:52ch}
.about__signature{
  margin-top:48px;
  display:flex;align-items:center;gap:20px;
  border-top:.5px solid var(--am-rule);
  padding-top:32px;
}
.about__signature .am-monogram{
  font-family:var(--am-font-display);
  font-weight:300;font-size:48px;line-height:1;
}
.about__signature .am-monogram em{font-style:italic;color:var(--am-accent);font-weight:300}

/* ----- Contacto ----- */
.contact__grid{
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:clamp(40px, 6vw, 96px);
  align-items:start;
}
.contact-info{display:flex;flex-direction:column;gap:36px}
.contact-info__item .eyebrow{margin-bottom:8px;display:block}
.contact-info__item p{font-family:var(--am-font-display);font-size:20px;font-weight:300;line-height:1.4}
.contact-info__item a:hover{color:var(--am-accent)}

.contact-form{display:flex;flex-direction:column;gap:24px}
.contact-form__row{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.field{display:flex;flex-direction:column;gap:8px}
.field label{
  font-family:var(--am-font-sans);font-weight:400;font-size:11px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--am-text-muted);
}
.field input,
.field textarea{
  border:0;border-bottom:.5px solid var(--am-rule-strong);
  background:transparent;
  font-family:var(--am-font-display);font-weight:300;font-size:18px;
  color:var(--am-text);
  padding:10px 0;
  resize:none;
  transition:border-color .2s ease;
}
.field input:focus,
.field textarea:focus{outline:none;border-bottom-color:var(--am-accent)}
.field textarea{min-height:120px;line-height:1.5}
.contact-form__submit{
  align-self:flex-start;
  font-family:var(--am-font-sans);font-weight:300;font-size:12px;
  letter-spacing:.32em;text-transform:uppercase;padding-left:.32em;
  border:.5px solid var(--am-text);
  padding:14px 28px;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.contact-form__submit:hover{background:var(--am-text);color:var(--am-bg)}
.contact-form__note{
  font-family:var(--am-font-display);font-style:italic;font-weight:300;
  font-size:13px;color:var(--am-text-muted);
}

/* ----- Footer ----- */
.site-footer{
  background:var(--am-charcoal);
  color:var(--am-text-invert);
  padding:64px var(--am-pad-x) 28px;
}
.site-footer__grid{
  max-width:var(--am-maxw);margin-inline:auto;
  display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:40px;align-items:start;
}
.site-footer h4{
  font-family:var(--am-font-sans);font-weight:400;font-size:11px;
  letter-spacing:.22em;text-transform:uppercase;color:rgba(245,240,235,.5);
  margin:0 0 18px;
}
.site-footer ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.site-footer a:hover{color:var(--am-accent)}
.site-footer__brand{
  font-family:var(--am-font-display);font-weight:300;font-size:32px;letter-spacing:.16em;padding-left:.16em;
}
.site-footer__brand .desc{font-family:var(--am-font-sans);font-weight:300;font-size:11px;letter-spacing:.42em;display:block;margin-top:14px;color:rgba(245,240,235,.65);padding-left:.42em}
.site-footer__base{
  max-width:var(--am-maxw);margin-inline:auto;
  margin-top:64px;padding-top:24px;
  border-top:.5px solid rgba(245,240,235,.15);
  display:flex;justify-content:space-between;
  font-family:var(--am-font-sans);font-weight:300;font-size:11px;
  letter-spacing:.12em;color:rgba(245,240,235,.55);
}

/* ----- Photo slot (placeholder graphic for empty image-slots) ----- */
.photo-slot{
  display:flex;align-items:center;justify-content:center;
  background:
    repeating-linear-gradient(45deg, rgba(140,130,121,.06) 0 1px, transparent 1px 14px),
    var(--am-sand);
  position:relative;
  overflow:hidden;
}
.photo-slot::before{
  content:"";position:absolute;inset:14px;
  border:.5px solid rgba(140,130,121,.45);
}
.photo-slot__info{
  position:relative;z-index:1;
  text-align:center;padding:24px;
  max-width:80%;
}
.photo-slot__info .eyebrow{color:var(--am-charcoal);opacity:.6;display:block;margin-bottom:8px}
.photo-slot__info .title{
  font-family:var(--am-font-display);font-style:italic;font-weight:300;
  font-size:16px;line-height:1.35;color:var(--am-charcoal);
}
.photo-slot__info .dims{
  display:block;margin-top:8px;
  font-family:var(--am-font-sans);font-weight:300;font-size:10px;
  letter-spacing:.18em;color:rgba(44,44,44,.55);
}

/* image-slot starter overrides — neutralize :host default 240×160px so our aspect-ratio rules win */
image-slot{display:block !important;width:100% !important;height:auto !important}
.hero__media image-slot,
.project-hero image-slot{height:100% !important}
/* photo-slot-link wrapping image-slots in project cards */
.photo-slot-link{display:block;width:100%}

/* ----- Responsive ----- */
@media (max-width: 900px){
  .filosofia__grid{grid-template-columns:1fr;gap:48px}
  .filosofia__text{position:static}
  .filosofia__photos{flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}
  .filosofia__photo{flex:0 0 80%;scroll-snap-align:start}
  .about__grid,
  .contact__grid{grid-template-columns:1fr;gap:40px}
  .site-header{grid-template-columns:auto auto}
  .site-header__nav{display:none}
  body[data-grid="magazine"] .project-card{grid-column:1 / -1 !important;margin-top:0 !important}
  body[data-grid="ledger"] .project-card{grid-template-columns:40px 1fr 1fr;gap:16px}
  body[data-grid="ledger"] .project-card__excerpt{display:none}
  body[data-grid="uniform"] .projects-grid{grid-template-columns:1fr}
  .site-footer__grid{grid-template-columns:1fr 1fr;gap:32px}
  .contact-form__row{grid-template-columns:1fr}
  body[data-hero="editorial"] .hero{grid-template-columns:1fr;grid-template-rows:55vh 45vh}
}

/* ----- Project detail page ----- */
.project-hero{
  height:100vh;min-height:600px;
  position:relative;background:var(--am-charcoal);color:#fff;overflow:hidden;
}
.project-hero .photo-slot,
.project-hero image-slot{position:absolute;inset:0;width:100%;height:100%;display:block}
.project-hero__overlay{
  position:absolute;left:var(--am-pad-x);right:var(--am-pad-x);bottom:48px;
  display:flex;justify-content:space-between;align-items:flex-end;gap:32px;
  z-index:2;
}
.project-hero__overlay::before{
  content:"";position:absolute;inset:-180px 0 -48px;
  background:linear-gradient(180deg, transparent, rgba(0,0,0,.55));z-index:-1;
}
.project-hero h1{
  font-family:var(--am-font-display);font-weight:300;
  font-size:clamp(40px, 6vw, 88px);line-height:1.05;
  margin:0;color:#fff;
}
.project-hero h1 em{font-style:italic;font-weight:300}
.project-hero .meta{
  font-family:var(--am-font-sans);font-weight:300;font-size:11px;
  letter-spacing:.22em;text-transform:uppercase;color:rgba(245,240,235,.85);
  text-align:right;display:flex;flex-direction:column;gap:6px;
}
.project-data{
  display:grid;grid-template-columns:repeat(4, 1fr);
  gap:32px;
  padding-block:48px;
  border-bottom:.5px solid var(--am-rule);
}
.project-data dt{
  font-family:var(--am-font-sans);font-weight:400;font-size:11px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--am-text-muted);
  margin-bottom:8px;
}
.project-data dd{margin:0;font-family:var(--am-font-display);font-weight:300;font-size:20px;line-height:1.3}
.project-memoria{
  display:grid;grid-template-columns:1fr 2fr;gap:clamp(40px, 6vw, 96px);
  padding-block:var(--am-section-y);
}
.project-memoria .lead{font-size:clamp(24px, 2.4vw, 30px);line-height:1.4}
.project-memoria__body{font-family:var(--am-font-display);font-size:18px;line-height:1.6;color:var(--am-text);max-width:60ch}
.project-memoria__body p{margin-bottom:1.2em}
.project-memoria__body p::first-letter{
  font-family:var(--am-font-display);font-size:3.8em;float:left;
  line-height:.95;padding:6px 12px 0 0;font-weight:300;color:var(--am-accent);
}
.project-gallery{
  display:grid;grid-template-columns:repeat(12, 1fr);
  gap:32px 24px;padding-block:var(--am-section-y);
}
.project-gallery > *{position:relative}
.project-gallery image-slot,
.project-gallery .photo-slot{display:block;width:100%}
.gimg-1{grid-column:1 / 8}.gimg-1 image-slot,.gimg-1 .photo-slot{aspect-ratio:16/10}
.gimg-2{grid-column:9 / 13;margin-top:60px}.gimg-2 image-slot,.gimg-2 .photo-slot{aspect-ratio:3/4}
.gimg-3{grid-column:3 / 11}.gimg-3 image-slot,.gimg-3 .photo-slot{aspect-ratio:21/9}
.gimg-4{grid-column:1 / 6}.gimg-4 image-slot,.gimg-4 .photo-slot{aspect-ratio:4/5}
.gimg-5{grid-column:7 / 13;margin-top:80px}.gimg-5 image-slot,.gimg-5 .photo-slot{aspect-ratio:4/5}
.project-credits{
  display:grid;grid-template-columns:repeat(4, 1fr);gap:32px;
  padding-block:48px;
  border-top:.5px solid var(--am-rule);
  border-bottom:.5px solid var(--am-rule);
}
.project-credits dt{font-family:var(--am-font-sans);font-weight:400;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--am-text-muted);margin-bottom:6px}
.project-credits dd{margin:0;font-family:var(--am-font-display);font-size:16px;font-weight:300}
.project-next{
  display:flex;justify-content:space-between;align-items:center;
  padding-block:60px;
}
.project-next a{
  font-family:var(--am-font-display);font-weight:300;font-size:clamp(28px, 4vw, 48px);
  display:inline-flex;align-items:center;gap:24px;
}
.project-next a em{font-style:italic;color:var(--am-text-muted)}
.project-next a:hover{color:var(--am-accent)}
@media (max-width:900px){
  .project-data,.project-credits{grid-template-columns:repeat(2,1fr)}
  .project-memoria{grid-template-columns:1fr}
  .project-gallery > *{grid-column:1 / -1 !important;margin-top:0 !important}
}

/* ----- Tweak indicator (only when panel is mounted) ----- */
.tweaks-hint{
  position:fixed;bottom:20px;left:20px;z-index:40;
  font-family:var(--am-font-sans);font-weight:400;font-size:10px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--am-text-muted);
  pointer-events:none;
  opacity:.7;
}