/* Direção exclusiva de Clara Vale. Não altera os outros portfólios. */
.clara {--forest:#183d38; --gold:#e7bb72; --cream:#f4f1e8; --clara-line:#183d382f; background:var(--cream); color:var(--forest);}
.clara .demo-header {background:var(--forest); color:var(--cream); border-color:#f4f1e829; padding:25px 5%;}
.clara-logo {font-family:Georgia,'Times New Roman',serif; font-size:39px; letter-spacing:-2px;}
.clara-logo span {font-family:Arial,Helvetica,sans-serif; font-size:10px; letter-spacing:1.3px;}
.clara .demo-header .clara-link {color:var(--gold);}
.clara-link:hover {color:#95501e;}
.clara .demo-header .clara-link:hover {color:#fff;}
.clara .section-space {padding:80px 6%;}
.clara-hero {display:grid; grid-template-columns:.9fr 1.1fr; padding:0; background:var(--forest); color:var(--cream);}
.clara-hero-copy {padding:58px 11% 32px; display:flex; flex-direction:column; align-items:flex-start; min-width:0;}
.clara-hero .kicker {color:var(--gold); font-size:12px; letter-spacing:1.25px; padding:0;}
.clara h1 {font:400 clamp(49px,4.8vw,76px)/1.02 Georgia,'Times New Roman',serif; letter-spacing:-2.8px; margin:32px 0 24px;}
.clara h1 em {color:var(--gold);}
.clara-hero-lede {max-width:330px; color:#d0ddd5; font-size:17px; line-height:1.7;}
.clara-hero .clara-link {margin-top:26px; color:var(--gold); font-size:14px; gap:30px;}
.clara-hero-bottom {display:flex; justify-content:space-between; align-items:end; gap:24px; width:100%; border-top:1px solid #f4f1e82f; padding-top:23px; margin-top:42px;}
.clara-hero-bottom>span:first-child {font-size:12px; line-height:1.6; color:#d0ddd5; letter-spacing:.4px;}
.clara-monogram {font:400 64px/.8 Georgia,serif; letter-spacing:-.04em; text-transform:uppercase; color:var(--gold); padding-right:6px;}
.clara-hero figure {position:relative; min-width:0; min-height:590px; display:flex; flex-direction:column;}
.clara-hero figure>img {width:100%; height:0; min-height:0; flex:1; object-fit:cover; object-position:62% 50%;}
.clara-hero figcaption {padding:19px 25px; margin:0; background:var(--gold); color:var(--forest); border:0; font-size:12px; display:flex; justify-content:space-between; gap:16px;}
.clara h2 {font:400 clamp(36px,3.5vw,53px)/1.12 Georgia,'Times New Roman',serif; letter-spacing:-1.5px;}
.clara h2 em {color:#995021;}
.clara-about {grid-template-columns:1fr 1fr; gap:10%; align-items:start;}
.clara-about h2 {margin-top:28px;}
.clara-about .clara-signature {font:italic 30px/1.1 Georgia,serif; color:var(--forest); margin-top:40px; letter-spacing:-1px;}
.clara-signature span {display:block; font:12px/1.4 Arial,sans-serif; letter-spacing:1.2px; text-transform:uppercase; margin-top:12px; color:#637267;}
.clara-about-story>p {font-size:17px; color:#4d635a; margin-top:0!important; max-width:510px;}
.clara-about-story>p+p {margin-top:18px!important;}
.clara-principles {list-style:none; padding:0; margin:30px 0 0;}
.clara-principles li {display:flex; gap:18px; padding:19px 0; border-top:1px solid var(--clara-line);}
.clara-principles li>span {font-size:12px; color:#995021; padding-top:4px;}
.clara-principles h3 {font:400 23px/1.25 Georgia,serif; letter-spacing:-.5px;}
.clara-about .clara-principles p {font-size:14px; line-height:1.6; margin:7px 0 0!important; color:#4d635a;}
.clara-project {background:#e4e9dc;}
.clara-project-heading {display:grid; grid-template-columns:1fr 1fr; gap:16px 25px; align-items:end;}
.clara-project-heading .kicker {grid-column:1/-1;}
.clara-project-heading h2 {grid-column:1; grid-row:auto; font-size:clamp(40px,4.5vw,64px); margin-top:4px;}
.clara-project-heading>p:last-child {grid-column:2; font-size:16px; justify-self:end; margin-bottom:4px; color:#4d635a;}
.clara-project-layout {display:grid; grid-template-columns:1.5fr 1fr; margin-top:35px;}
.clara-project-image {margin:0; align-self:stretch; min-width:0; background:var(--forest);}
.clara-project-image img {width:100%; height:100%; min-height:510px; object-fit:cover; object-position:66% 50%;}
.clara-project-image>span {left:24px; right:auto; bottom:24px; background:var(--cream); color:var(--forest); font-size:14px; padding:17px 21px;}
.clara-project-dossier {background:var(--forest); color:var(--cream); padding:35px; display:flex; flex-direction:column;}
.clara-project-number {font:italic 66px/1 Georgia,serif; color:var(--gold);}
.clara-project-dossier h3 {font:400 31px/1.13 Georgia,serif; margin:22px 0 17px; letter-spacing:-.7px;}
.clara-project-dossier>p {font-size:15px; line-height:1.7; color:#d0ddd5;}
.clara-project-dossier dl {margin-top:25px; display:grid; gap:15px;}
.clara-project-dossier dl>div {border-top:1px solid #f4f1e82b; padding-top:13px; display:flex; justify-content:space-between; gap:20px;}
.clara-project-dossier dt {font-size:12px; text-transform:none; letter-spacing:0; color:#b1c7ba; margin:0;}
.clara-project-dossier dd {font-size:13px; text-align:right; color:var(--cream);}
.clara-dossier-end {font:italic 20px/1.4 Georgia,serif; color:var(--gold); margin-top:25px;}
.clara-process {grid-template-columns:1fr 1fr; gap:10%;}
.clara-process-intro h2 {font-size:clamp(32px,3vw,43px); margin:25px 0 20px;}
.clara-process-intro>p:last-child {max-width:350px; color:#4d635a; font-size:16px;}
.clara-process summary {font-family:Georgia,serif; font-size:31px; padding:24px 0;}
.clara-process summary>span {font-family:Arial,sans-serif; color:#995021;}
.clara-process details p {color:#4d635a;}
.clara-contact {position:relative; overflow:hidden; background:var(--forest); color:var(--cream);}
.clara-contact h2 {font-size:clamp(42px,5vw,70px); position:relative; z-index:1;}
.clara-contact h2 em {color:var(--gold);}
.clara-contact .clara-link {color:var(--gold); position:relative; z-index:1;}
.clara-contact .clara-link:hover {color:#fff;}
.clara-contact>p:not(.kicker),.clara-contact small {color:#d0ddd5; position:relative; z-index:1;}
.clara-contact-monogram {position:absolute; right:6%; bottom:35px; font:400 270px/.85 Georgia,serif; letter-spacing:-.04em; text-transform:uppercase; color:#d8bf8840; padding-right:22px; user-select:none;}
.clara .project-dialog {background:var(--cream); color:var(--forest);}
.clara .dialog-close {background:var(--forest); color:var(--cream);}
.clara .dialog-content h2 {font-family:Georgia,serif;}
.clara .demo-footer {background:var(--cream);}
@media (max-width:1000px) {
  .clara-hero-copy {padding:42px 9% 30px;}
  .clara h1 {font-size:52px; letter-spacing:-2.3px;}
  .clara-hero figure {min-height:570px;}
  .clara-hero figcaption {flex-wrap:wrap; gap:6px 20px; padding:16px 20px;}
  .clara-project-layout {grid-template-columns:1.1fr 1fr;}
  .clara-project-dossier {padding:28px;}
  .clara-project-dossier h3 {font-size:28px;}
  .clara-contact-monogram {font-size:200px; right:4%;}
}
@media (max-width:700px) {
  .clara .demo-header {padding:23px 5%;}
  .clara-logo {font-size:32px;}
  .clara-logo span {font-size:8px; letter-spacing:.8px;}
  .clara .demo-header .clara-link {font-size:13px; gap:15px;}
  .clara .section-space {padding:54px 6%;}
  .clara-hero {grid-template-columns:1fr;}
  .clara-hero-copy {padding:36px 6% 28px;}
  .clara h1 {font-size:clamp(45px,10.5vw,68px); letter-spacing:-2.1px; margin:25px 0 20px;}
  .clara-hero-lede {font-size:16px; max-width:360px;}
  .clara-hero-bottom {margin-top:28px; padding-top:18px;}
  .clara-monogram {font-size:54px;}
  .clara-hero figure {min-height:0;}
  .clara-hero figure>img {height:355px; min-height:355px; flex:none; object-position:62% 50%;}
  .clara-hero figcaption {padding:16px 6%; gap:7px 20px; font-size:12px;}
  .clara-about,.clara-process {grid-template-columns:1fr; gap:30px;}
  .clara h2 {font-size:38px; letter-spacing:-1.3px;}
  .clara-about h2 {margin-top:23px;}
  .clara-about .clara-signature {margin-top:25px;}
  .clara-about-story>p {font-size:16px;}
  .clara-principles {margin-top:23px;}
  .clara-project-heading {grid-template-columns:1fr; gap:14px;}
  .clara-project-heading h2 {font-size:43px;}
  .clara-project-heading>p:last-child {grid-column:1; justify-self:start;}
  .clara-project-layout {grid-template-columns:1fr; margin-top:25px;}
  .clara-project-image img {height:355px; min-height:0; object-position:62% 50%;}
  .clara-project-image>span {left:18px; right:18px; bottom:18px; padding:16px;}
  .clara-project-dossier {padding:27px;}
  .clara-project-number {font-size:54px;}
  .clara-project-dossier h3 {font-size:31px; margin-top:19px;}
  .clara-process-intro h2 {font-size:36px;}
  .clara-process summary {font-size:29px;}
  .clara-contact h2 {font-size:clamp(36px,8.9vw,53px);}
  .clara-contact .kicker {max-width:300px;}
  .clara-contact-monogram {display:none;}
  .clara-contact .clara-link {font-size:14px;}
}
@media (prefers-reduced-motion:no-preference) {
  .clara-hero-copy {animation:clara-arrive .7s ease-out both;}
  @keyframes clara-arrive {from {opacity:0; transform:translateY(12px)} to {opacity:1; transform:none}}
}