.about-page{--about-cream:#f5f0e5;--about-ink:#24241f;--about-red:#9c2528;--about-yellow:#ffb42c;background:var(--about-cream);color:var(--about-ink);overflow:clip}
.about-page *, .about-page *::before, .about-page *::after{box-sizing:border-box}
.about-page h1,.about-page h2,.about-page h3{font-family:var(--font-serif),Impact,sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:-.025em;color:inherit;margin:0}
.about-page h2{font-size:clamp(2.5rem,4.6vw,4.5rem);line-height:1.02}
.about-page p{font-size:1.08rem;line-height:1.75}
.about-page figure{margin:0}
.about-page a:focus-visible{outline:3px solid currentColor;outline-offset:7px}
.about-wrap{width:min(1160px,calc(100% - 64px));margin-inline:auto}
.about-page .about-kicker{font-size:.75rem;font-weight:800;letter-spacing:.18em;line-height:1.5;margin:0 0 24px;text-transform:uppercase}
.about-intro{text-align:center;padding:clamp(64px,7vw,104px) 24px 64px}
.about-intro .about-kicker{color:var(--about-red)}
.about-intro h1{font-size:clamp(3.5rem,8.3vw,8rem);line-height:.98;max-width:1100px;margin:0 auto}
.about-intro h1 span{color:var(--about-red)}
.about-intro .about-lead{margin:28px auto 26px;font-size:clamp(1.1rem,1.7vw,1.3rem);line-height:1.55}
.about-text-link{display:inline-flex;gap:22px;align-items:center;padding:7px 0;border-bottom:1px solid currentColor;font-weight:800;text-decoration:none;font-size:.95rem}
.about-text-link:hover{color:var(--about-red)}
.about-cover{position:relative;width:100%;background:#dbcdb8}
.about-cover img{display:block;width:100%;height:clamp(260px,36vw,540px);object-fit:cover;object-position:center 61%;filter:saturate(.82) contrast(.97) brightness(.98)}
.about-cover figcaption{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);background:var(--about-cream);color:var(--about-ink);font-size:.73rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;text-align:center;padding:13px 22px;white-space:nowrap}
.about-story{max-width:790px;text-align:center;padding-block:100px 70px;scroll-margin-top:100px}
.about-story .about-kicker{color:var(--about-red)}
.about-story p:not(.about-kicker){max-width:655px;margin:24px auto 0}
.about-button{display:inline-flex;align-items:center;justify-content:center;gap:28px;min-height:54px;padding:15px 26px;background:var(--about-yellow);color:#191912;border:1px solid transparent;border-radius:2px;text-decoration:none;font-size:.83rem;font-weight:900;letter-spacing:.05em;line-height:1.4;transition:background .18s ease,transform .18s ease}
.about-button:hover{background:#ffc755;transform:translateY(-2px)}
.about-story .about-button{margin-top:32px}
.about-details{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #25251f35;padding-block:40px 90px;gap:40px}
.about-number{font-size:.67rem;font-weight:800;letter-spacing:.13em;color:var(--about-red)}
.about-details h3{font-size:1.8rem;margin-top:17px;line-height:1.1}
.about-details p{font-size:.97rem;line-height:1.65;margin:14px 0 0}
.about-paco{background:#182e29;color:var(--about-cream);padding:80px 0;scroll-margin-top:85px}
.about-paco-inner{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(40px,7vw,110px)}
.about-paco figure{position:relative;max-width:470px;transform:rotate(-2deg);padding:12px 12px 0;background:var(--about-cream);color:var(--about-ink)}
.about-paco img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.about-paco figcaption{text-align:center;font-size:.85rem;font-weight:700;padding:17px 5px}
.about-paco .about-kicker{color:var(--about-yellow)}
.about-paco h2{font-size:clamp(3.5rem,6.5vw,6.7rem);line-height:.98}
.about-paco h2 span{color:var(--about-yellow)}
.about-paco-copy>p:not(.about-kicker){max-width:450px;margin:24px 0;color:#e4e8df}
.about-paco-copy>.about-button{margin-top:8px}
.about-gather{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:70px;padding-block:100px}
.about-gather .about-kicker{color:var(--about-red)}
.about-gather p:not(.about-kicker){max-width:440px;margin:24px 0}
.about-gather img{display:block;width:100%;height:auto;aspect-ratio:1/1.08;object-fit:cover}
.about-visit{background:var(--about-red);color:var(--about-cream);text-align:center;padding:80px 24px 90px;scroll-margin-top:85px}
.about-visit .about-kicker{color:var(--about-yellow)}
.about-visit h2{font-size:clamp(2.8rem,5.7vw,5.4rem)}
.about-visit address{font-style:normal;line-height:1.8;margin:26px 0 30px}
.about-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
.about-button-outline{background:transparent;color:var(--about-cream);border-color:#f5f0e580}
.about-button-outline:hover{background:#ffffff14}
@media(max-width:760px){
 .about-wrap{width:calc(100% - 40px)}
 .about-intro{padding:58px 20px 44px}
 .about-intro h1{font-size:clamp(2.9rem,10.4vw,5rem)}
 .about-page .about-kicker{font-size:.65rem;letter-spacing:.14em;margin-bottom:20px}
 .about-cover img{height:290px}
 .about-cover figcaption{bottom:18px;padding:11px 15px;font-size:.6rem}
 .about-story{padding-block:60px 48px}
 .about-page h2{font-size:clamp(2.2rem,7.8vw,3.4rem)}
 .about-details{grid-template-columns:1fr;gap:27px;padding-block:28px 56px;text-align:center}
 .about-details article{max-width:410px;margin:auto}
 .about-details h3{font-size:1.8rem;margin-top:10px}
 .about-details p{margin-top:10px}
 .about-paco{padding:52px 0 58px}
 .about-paco-inner{grid-template-columns:1fr;gap:40px}
 .about-paco figure{width:calc(100% - 20px);max-width:370px;margin:auto}
 .about-paco-copy{text-align:center}
 .about-paco h2{font-size:4.1rem}
 .about-paco-copy>p:not(.about-kicker){margin:22px auto}
 .about-gather{grid-template-columns:1fr;gap:32px;padding-block:60px;text-align:center}
 .about-gather p:not(.about-kicker){margin:22px auto}
 .about-gather figure{max-width:470px;width:100%;margin:auto}
 .about-gather img{aspect-ratio:1.2}
 .about-visit{padding:60px 20px}
 .about-visit address{font-size:.95rem}
 .about-actions{flex-direction:column;align-items:center}
 .about-actions .about-button{width:min(100%,320px)}
}
@media(prefers-reduced-motion:reduce){.about-button{transition:none}.about-button:hover{transform:none}}
.about-photo-story{padding-bottom:90px;scroll-margin-top:100px}
.about-photo-heading{text-align:center;max-width:720px;margin:0 auto 40px}
.about-photo-heading .about-kicker{color:var(--about-red)}
.about-photo-heading>p:last-child{margin:20px 0 0}
.about-photo-grid{display:grid;grid-template-columns:1.45fr 1fr;align-items:start;gap:24px}
.about-photo-grid img{display:block;width:100%;height:auto;object-fit:cover}
.about-photo-interior{padding-top:0}
.about-photo-interior img{aspect-ratio:4/3;filter:saturate(.74) contrast(.97) brightness(.98)}
.about-photo-salsa img{aspect-ratio:auto;max-height:none;object-fit:contain;object-position:center}
.about-photo-grid figcaption{font-size:1rem;font-weight:600;line-height:1.6;margin-top:18px}
.about-photo-grid figcaption span{display:block;font-size:.65rem;letter-spacing:.14em;color:var(--about-red);margin-bottom:5px}
.about-gather img[src*="chicanos-tacos-retouched"]{aspect-ratio:4/3;object-position:center}
.about-page img{border-radius:24px}
.about-paco figure{border-radius:28px;overflow:hidden}
.about-photo-interior img[src*="interior-2025"]{aspect-ratio:1;object-fit:contain}
@media(max-width:760px){.about-photo-story{padding-bottom:55px}.about-photo-heading{margin-bottom:28px}.about-photo-grid{grid-template-columns:1fr;gap:30px}.about-photo-interior{padding-top:0}.about-photo-salsa{max-width:420px;width:100%;margin-inline:auto!important}.about-photo-salsa img{max-height:none}.about-photo-grid figcaption{text-align:center}}

/* A real look at the restaurant, between the introduction and story details. */
.about-place-gallery{padding:20px 0 88px}
.about-place-heading{display:flex;justify-content:space-between;align-items:end;gap:3rem;margin-bottom:30px}
.about-place-heading .about-kicker{color:var(--about-red)}
.about-place-heading h2{font-size:clamp(3rem,6vw,6rem);line-height:.9}
.about-place-heading h2 span{color:var(--about-red)}
.about-place-heading>p{width:min(31%,330px);margin:0 0 6px;padding-top:16px;border-top:1px solid #24241f5c;font-size:1rem;line-height:1.6}
.about-place-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);grid-template-rows:repeat(2,330px);gap:18px}
.about-place-grid figure{position:relative;overflow:hidden;background:#162b28;border-radius:20px}
.about-place-grid figure::after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#06130fb8);pointer-events:none}
.about-place-grid img{display:block;width:100%;height:100%;object-fit:cover;border-radius:0}
.about-place-patio{grid-row:1 / 3}
.about-place-dining img{object-position:center 38%;filter:brightness(1.2) saturate(1.08) contrast(.97)}
.about-place-bar img{object-position:center 42%}
.about-place-grid figcaption{position:absolute;z-index:1;left:25px;bottom:23px;color:#fff;font-family:var(--font-serif),Impact,sans-serif;font-size:clamp(1.4rem,2.6vw,2.25rem);line-height:1;text-transform:uppercase;text-shadow:0 2px 12px #0008}
.about-place-grid figcaption span{display:block;margin-bottom:9px;color:#ffc247;font-family:var(--font-sans),Arial,sans-serif;font-size:.68rem;font-weight:800;letter-spacing:.15em}
@media(max-width:760px){
 .about-place-gallery{padding:8px 0 55px}
 .about-place-heading{display:block;margin-bottom:24px}
 .about-place-heading h2{font-size:clamp(2.8rem,11vw,4.5rem)}
 .about-place-heading>p{width:100%;max-width:520px;margin:22px 0 0}
 .about-place-grid{grid-template-columns:1fr 1fr;grid-template-rows:310px 230px;gap:10px}
 .about-place-patio{grid-column:1 / 3;grid-row:1}
 .about-place-dining,.about-place-bar{grid-row:2}
 .about-place-grid figcaption{left:14px;bottom:15px;font-size:clamp(1.1rem,4vw,1.7rem)}
 .about-place-grid figcaption span{font-size:.57rem;margin-bottom:6px}
}
@media(max-width:390px){.about-place-grid{grid-template-rows:270px 210px}}

/* A stronger first impression: food, color and a concise restaurant story. */
.about-intro {
  position: relative;
  isolation: isolate;
  min-height: clamp(560px, 66vw, 720px);
  padding: clamp(96px, 10vw, 138px) max(32px, calc((100vw - 1160px) / 2));
  padding-right: max(54vw, calc((100vw - 1160px) / 2 + 570px));
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  overflow: hidden;
  text-align: left;
  background:
    radial-gradient(circle at 12% 18%, rgba(255, 180, 44, .17) 0 2px, transparent 2.5px) 0 0 / 24px 24px,
    var(--about-cream);
}
.about-intro::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  right: 0;
  height: 24px;
  background: repeating-conic-gradient(from 45deg at 50% 0, #a91f2a 0 25%, #f5ad27 0 50%, #1d6a4b 0 75%, #f3dfbd 0 100%) 0 0 / 72px 32px;
}
.about-intro::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 0 52%;
  background:
    linear-gradient(90deg, var(--about-cream) 0, transparent 15%),
    linear-gradient(0deg, rgba(20, 23, 18, .12), rgba(20, 23, 18, 0) 45%),
    url('/images/about/chicanos-tacos-retouched.webp') center / cover no-repeat;
  clip-path: polygon(11% 0, 100% 0, 100% 100%, 0 100%);
}
.about-intro > * { position: relative; z-index: 1; }
.about-intro .about-kicker {
  margin-bottom: 18px;
  color: var(--about-red);
}
.about-intro h1 {
  max-width: 650px;
  margin: 0;
  font-size: clamp(3.5rem, 6.3vw, 6.7rem);
  line-height: .88;
  text-wrap: balance;
}
.about-intro .about-lead {
  max-width: 525px;
  margin: 26px 0 0;
  font-size: clamp(1.05rem, 1.45vw, 1.22rem);
  line-height: 1.55;
}
.about-intro .about-lead::after {
  content: "TACOS · FAJITAS · HOUSE SPECIALTIES";
  display: block;
  width: max-content;
  max-width: 100%;
  margin-top: 22px;
  padding: 8px 11px;
  color: #fff;
  background: #1d6a4b;
  font-size: .66rem;
  font-weight: 900;
  letter-spacing: .12em;
  line-height: 1.2;
}
.about-intro .about-text-link {
  margin-top: 28px;
  padding: 16px 22px;
  gap: 28px;
  border: 0;
  border-radius: 2px;
  color: #171912;
  background: var(--about-yellow);
  font-size: .78rem;
  letter-spacing: .06em;
  transition: transform .18s ease, background-color .18s ease;
}
.about-intro .about-text-link:hover {
  color: #171912;
  background: #ffc655;
  transform: translateY(-2px);
}
.about-cover { border-top: 8px solid var(--about-red); }
.about-cover figcaption {
  color: #fff;
  background: #1d6a4b;
  box-shadow: 10px 10px 0 var(--about-yellow);
}
.about-visit-compact {
  margin-top: 0;
  margin-bottom: 88px;
  padding: 20px 24px 24px;
  border-radius: 20px;
  box-shadow: 0 16px 36px rgba(74, 13, 18, .13);
}
.about-visit-compact h2 { font-size: clamp(2.15rem, 4vw, 3.5rem); line-height: .96; }
.about-visit-compact .about-kicker { margin-bottom: 7px; }
.about-visit-compact address { margin: 8px 0 12px; line-height: 1.4; }
.about-visit-compact .about-actions { gap: 10px; }
.about-visit-compact .about-button { min-height: 44px; padding: 10px 20px; }

@media (max-width: 850px) {
  .about-intro {
    min-height: 760px;
    padding: 82px 28px 360px;
    justify-content: flex-start;
  }
  .about-intro::after {
    inset: auto 0 0;
    height: 355px;
    clip-path: polygon(0 10%, 100% 0, 100% 100%, 0 100%);
    background:
      linear-gradient(180deg, var(--about-cream) 0, transparent 14%),
      url('/images/about/chicanos-tacos-retouched.webp') center 52% / cover no-repeat;
  }
  .about-intro h1 { font-size: clamp(3.35rem, 12.4vw, 5.8rem); }
  .about-intro .about-lead { max-width: 570px; }
}

@media (max-width: 520px) {
  .about-intro {
    min-height: 720px;
    padding: 70px 20px 310px;
  }
  .about-intro::before { height: 18px; background-size: 54px 24px; }
  .about-intro::after { height: 305px; }
  .about-intro h1 { font-size: clamp(3rem, 15.5vw, 4.65rem); }
  .about-intro .about-lead { margin-top: 20px; font-size: 1rem; }
  .about-intro .about-lead::after { margin-top: 16px; font-size: .58rem; }
  .about-intro .about-text-link { margin-top: 20px; }
  .about-visit-compact {
    width: calc(100% - 24px);
    margin-bottom: 58px;
    padding: 22px 16px 26px;
    border-radius: 16px;
  }
  .about-visit-compact h2 { font-size: clamp(2rem, 9.5vw, 2.8rem); }
}

/* Content hierarchy below the opening hero. */
.about-story {
  position: relative;
  max-width: 1160px;
  margin-top: 72px;
  margin-bottom: 92px;
  padding: clamp(44px, 6vw, 72px);
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  grid-template-rows: auto auto 1fr;
  gap: 0 clamp(42px, 6vw, 86px);
  overflow: hidden;
  border-radius: 24px;
  color: #fffaf0;
  background:
    radial-gradient(circle at 92% 15%, rgba(255, 194, 71, .12) 0 2px, transparent 2.5px) 0 0 / 22px 22px,
    #17352e;
  text-align: left;
  box-shadow: 0 18px 42px rgba(24, 53, 46, .13);
}
.about-story::after {
  content: "01";
  position: absolute;
  right: 22px;
  bottom: -30px;
  color: rgba(255, 255, 255, .055);
  font-family: var(--font-serif), Impact, sans-serif;
  font-size: clamp(9rem, 19vw, 15rem);
  line-height: .8;
}
.about-story .about-kicker {
  grid-column: 1;
  grid-row: 1;
  color: var(--about-yellow);
}
.about-story h2 {
  grid-column: 1;
  grid-row: 2 / 4;
  align-self: start;
  font-size: clamp(3rem, 5vw, 5.2rem);
  line-height: .94;
}
.about-story p:not(.about-kicker) {
  position: relative;
  z-index: 1;
  grid-column: 2;
  max-width: 530px;
  margin: 0 0 18px;
  color: #f5f0e5;
  font-size: 1.02rem;
  line-height: 1.65;
}
.about-story .about-button {
  position: relative;
  z-index: 1;
  grid-column: 2;
  width: max-content;
  margin-top: 8px;
}

.about-place-gallery {
  position: relative;
  padding-top: 8px;
}
.about-place-gallery::before {
  content: "";
  position: absolute;
  top: -44px;
  left: 0;
  width: 78px;
  height: 8px;
  background: linear-gradient(90deg, var(--about-red) 0 33%, var(--about-yellow) 33% 66%, #1d6a4b 66%);
}
.about-place-heading h2 { max-width: 720px; }
.about-place-grid figure { box-shadow: 0 14px 30px rgba(38, 32, 22, .12); }
.about-place-grid figure:nth-child(2) { border-top: 6px solid var(--about-yellow); }
.about-place-grid figure:nth-child(3) { border-top: 6px solid #1d6a4b; }

.about-photo-story {
  position: relative;
  margin-bottom: 96px;
  padding: clamp(42px, 5vw, 64px);
  overflow: hidden;
  border-radius: 24px;
  color: #241e14;
  background:
    radial-gradient(circle at 10% 12%, rgba(156, 37, 40, .16) 0 2px, transparent 2.5px) 0 0 / 24px 24px,
    #f4b438;
  box-shadow: 0 18px 42px rgba(99, 66, 9, .13);
}
.about-photo-story::after {
  content: "02";
  position: absolute;
  top: -24px;
  right: 18px;
  color: rgba(122, 16, 24, .1);
  font-family: var(--font-serif), Impact, sans-serif;
  font-size: clamp(9rem, 18vw, 14rem);
  line-height: 1;
  pointer-events: none;
}
.about-photo-heading {
  position: relative;
  z-index: 1;
  max-width: 820px;
  margin: 0 0 36px;
  text-align: left;
}
.about-photo-heading .about-kicker { color: #7a1018; }
.about-photo-heading > p:last-child { max-width: 510px; margin-top: 14px; }
.about-photo-grid {
  position: relative;
  z-index: 1;
  grid-template-columns: 1.15fr .85fr;
  gap: 22px;
  align-items: stretch;
}
.about-photo-grid figure {
  margin: 0;
  padding: 10px 10px 18px;
  border-radius: 18px;
  background: #fffaf0;
  box-shadow: 8px 10px 0 rgba(122, 16, 24, .18);
}
.about-photo-grid figure:nth-child(1) { transform: rotate(-1deg); }
.about-photo-grid figure:nth-child(2) { transform: rotate(1.2deg); }
.about-photo-grid img,
.about-photo-interior img,
.about-photo-salsa img {
  width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: 4 / 3;
  border-radius: 12px;
  object-fit: cover;
}
.about-photo-salsa img { object-position: center 55%; }
.about-photo-grid figcaption {
  margin: 14px 8px 0;
  color: #28251f;
}
.about-photo-grid figcaption span { color: #9c2528; }

.about-paco {
  position: relative;
  overflow: hidden;
  border-top: 10px solid var(--about-yellow);
}
.about-paco::before {
  content: "";
  position: absolute;
  top: 22px;
  left: 0;
  right: 0;
  height: 14px;
  opacity: .7;
  background: repeating-linear-gradient(90deg, #9c2528 0 42px, #f4b438 42px 84px, #2d765d 84px 126px);
}

@media (max-width: 760px) {
  .about-story {
    margin-top: 34px;
    margin-bottom: 62px;
    padding: 38px 26px 42px;
    display: block;
    border-radius: 18px;
    text-align: left;
  }
  .about-story h2 { font-size: clamp(2.65rem, 11vw, 4.2rem); }
  .about-story p:not(.about-kicker) { margin: 22px 0 0; }
  .about-story .about-button { margin-top: 28px; }
  .about-place-gallery::before { top: -26px; }
  .about-photo-story {
    margin-bottom: 62px;
    padding: 36px 20px 42px;
    border-radius: 18px;
  }
  .about-photo-heading { margin-bottom: 28px; }
  .about-photo-grid { grid-template-columns: 1fr; gap: 24px; }
  .about-photo-grid figure { width: 100%; max-width: none; transform: none !important; }
  .about-photo-grid img,
  .about-photo-interior img,
  .about-photo-salsa img { aspect-ratio: 4 / 3; }
  .about-paco::before { top: 14px; height: 10px; }
}