/* Conheça Claudia — teaser da home e abertura da página Sobre */
.about-teaser,.about-opening{display:grid;grid-template-columns:minmax(280px,470px) minmax(320px,560px);align-items:center;justify-content:center;gap:clamp(58px,8vw,128px);padding:112px clamp(42px,8vw,132px);background:#f7f5f1}
.portrait-stack{position:relative;z-index:1;width:100%;max-width:430px;justify-self:center}
.portrait-stack::before{content:"";position:absolute;z-index:-1;inset:0;border:1px solid #DAD2C2;background:#EFEAE3;transform:translate(-32px,-32px)}
.portrait-stack img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border:1px solid #B8955F;box-shadow:0 22px 42px rgba(51,43,34,.16)}
.teaser-portrait img{object-position:center 25%}
.teaser-portrait::before{background:#DCD3C0}
.about-teaser-copy,.about-opening-copy{max-width:560px}
.about-teaser-copy{align-self:center}
.about-eyebrow{display:flex;align-items:center;gap:14px;margin:0 0 20px;color:#8a672f;font:600 .74rem/1.2 "DM Sans",sans-serif;letter-spacing:.2em}
.about-eyebrow span{display:block;width:48px;height:1px;background:#B8955F}
.about-signature{display:block;width:auto;max-width:100%;object-fit:contain;object-position:left center}
.about-signature-main{height:82px;margin:0 0 3px}
.about-role{margin:0 0 30px;color:#997238;font:600 .78rem/1.2 "DM Sans",sans-serif;letter-spacing:.17em}
.about-teaser .about-role{margin-top:14px}
.about-intro-text,.about-opening-copy>p:last-child{margin:0;color:#4a4844;font-size:1rem;line-height:1.85}
.about-more{display:inline-flex;border:1px solid #2d332f;background:transparent;color:#2d332f;font:600 .72rem/1 "DM Sans",sans-serif;letter-spacing:.18em;text-transform:uppercase}
.about-teaser .about-more{margin-top:28px}
.about-more:hover{background:#19231f;color:#fff}
.about-page{background:#f7f5f1}
.about-opening{padding-bottom:90px}
.about-opening-photo img{object-position:center center}
.about-opening-copy>p:last-child{font-size:1.06rem}
.about-letter{padding-top:60px}
.about-simple-header{height:76px;display:grid;place-items:center;padding:10px 24px;background:var(--greige);border-bottom:1px solid rgba(39,40,37,.13)}
.about-simple-header a{font:400 clamp(2.4rem,4vw,3.35rem)/1 "Alex Brush",cursive;color:var(--charcoal)}
.about-standalone .about-opening{padding-bottom:54px}
.about-standalone .about-letter{padding:30px clamp(38px,7vw,112px) 54px}
.about-standalone .about-copy{padding:48px clamp(38px,7vw,64px) 40px}
@media(max-width:820px){
  .about-teaser,.about-opening{grid-template-columns:1fr;gap:56px;padding:94px 42px 82px}
  .portrait-stack{max-width:390px}
  .about-teaser-copy,.about-opening-copy{justify-self:center;text-align:center}
  .about-eyebrow{justify-content:center}
  .about-signature{object-position:center;margin-left:auto;margin-right:auto}
  .about-opening{padding-bottom:70px}
  .about-letter{padding-top:50px}
  .about-standalone .about-opening{padding-bottom:44px}
  .about-standalone .about-letter{padding:24px 42px 46px}
  .about-standalone .about-copy{padding:42px 32px 36px}
}
@media(max-width:520px){
  .about-teaser,.about-opening{gap:42px;padding:74px 30px 64px}
  .portrait-stack{width:calc(100% - 24px);max-width:330px;margin-left:24px}
  .portrait-stack::before{transform:translate(-20px,-20px)}
  .about-signature-main{height:62px}
  .about-role{font-size:.7rem}
  .about-intro-text,.about-opening-copy>p:last-child{font-size:.98rem;line-height:1.75}
  .about-letter{padding-top:42px}
  .about-simple-header{height:66px;padding:8px 18px}
  .about-standalone .about-opening{padding-bottom:34px}
  .about-standalone .about-letter{padding:20px 30px 38px}
  .about-standalone .about-copy{padding:36px 23px 32px}
}