/* ARBEX STUDIO | ESTUDOS DEMONSTRATIVOS V3.3
   Direção de arte singular por segmento; cenas visuais conceituais.
   Todos os controles mantêm foco de teclado e preferência por menos movimento. */

/* ========== 01 — NOVA FORMA ========== */
.nf33{background:#f3f0e9;color:#24221f;font-family:Arial,Helvetica,sans-serif}
.nf-container{width:min(100% - 88px,1440px);margin-inline:auto}
.nf33 a{text-decoration:none}
.nf-header{min-height:101px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.nf-wordmark{display:flex;align-items:center;gap:9px;font-size:15px;font-weight:750;letter-spacing:-.03em}
.nf-mark{height:26px;width:25px;display:grid;place-items:center;border-left:3px solid #7e6d59;border-bottom:3px solid #7e6d59;transform:skew(-11deg);font-size:17px;font-family:Georgia,serif;}
.nf-wordmark-note{color:#8c8074;font-size:9px;letter-spacing:.14em;font-weight:500;margin-left:10px}
.nf-header nav{display:flex;align-items:center;gap:clamp(20px,3vw,52px);font-size:12px;font-weight:550}
.nf-nav-contact{border:1px solid #9e9284;padding:13px 20px;white-space:nowrap}
.nf-header nav a:hover{color:#a18061}
.nf-hero{position:relative;min-height:min(790px,calc(100svh - 101px));display:grid;grid-template-columns:49% 51%;align-items:center;padding-bottom:45px}
.nf-editorial{position:relative;z-index:2;padding-right:25px;padding-top:20px}
.nf-eyebrow,.nf-section-kicker{display:flex;align-items:center;gap:13px;font-size:10px;font-weight:700;letter-spacing:.17em;color:#877662}
.nf-eyebrow i{display:block;width:38px;height:1px;background:#8a745c}
.nf-editorial h1{position:relative;z-index:2;margin:45px -22% 30px 0;font:400 clamp(75px,7.3vw,135px)/.92 Georgia,'Times New Roman',serif;letter-spacing:-.074em;text-wrap:balance}
.nf-editorial h1 em{font-style:italic;color:#887b6a;font-weight:400}
.nf-editorial>p{max-width:425px;font-size:16px;line-height:1.85;color:#675d54;margin:0 0 40px}
.nf-hero-links{display:flex;align-items:center;gap:clamp(25px,4vw,62px);flex-wrap:wrap}
.nf-main-link{display:inline-flex;gap:40px;align-items:center;justify-content:space-between;background:#282621;color:#f9f7f3;border:1px solid #282621;padding:19px 22px;min-width:220px;font-size:12px;font-weight:700;transition:transform .28s ease,background .28s ease}
.nf-main-link:hover{transform:translateY(-3px);background:#625649}
.nf-main-link span{font-size:19px;font-weight:300}
.nf-scroll{font-size:10px;letter-spacing:.12em;color:#87796a}
.nf-hero-photo{position:relative;overflow:hidden;height:clamp(470px,46vw,730px);margin:0;align-self:center;background:#c3b4a0}
.nf-hero-photo img{width:100%;height:100%;object-fit:cover;object-position:62% center;display:block;transition:transform 1.5s cubic-bezier(.2,.75,.2,1)}
.nf-hero-photo:hover img{transform:scale(1.025)}
.nf-hero-photo figcaption{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;gap:20px;color:white;padding:40px 30px 22px;font-size:9px;font-weight:600;letter-spacing:.15em;background:linear-gradient(0deg,#19151291,transparent)}
.nf-aside-label{position:absolute;right:-38px;top:42%;writing-mode:vertical-rl;font-size:9px;letter-spacing:.15em;color:#8c8276}
.nf-intro{padding:125px 0 145px;border-top:1px solid #d2c9bf}
.nf-section-kicker span{display:block;width:60px;height:1px;background:#b6aa9d}
.nf-intro-grid{display:grid;grid-template-columns:1fr .55fr;align-items:start;gap:80px;margin-top:52px}
.nf-intro h2{font:400 clamp(60px,7.1vw,124px)/.99 Georgia,serif;letter-spacing:-.072em;margin:0}
.nf-intro h2 em{color:#8e826f;font-weight:400}
.nf-intro-copy{padding-top:13px;max-width:420px}
.nf-intro-copy p{font-size:16px;line-height:1.9;color:#5e574e;margin:0 0 20px}
.nf-intro-copy a{display:inline-flex;gap:25px;padding-bottom:12px;border-bottom:1px solid #ab937a;font-size:13px;margin-top:12px;font-weight:700}
.nf-project{background:#272620;color:#ece5dc;padding:115px 0}
.nf-project-inner{display:grid;grid-template-columns:1.2fr .7fr;align-items:center;gap:clamp(60px,8vw,140px)}
.nf-project-image{position:relative;margin:0;overflow:hidden;height:clamp(460px,48vw,690px);background:#9a8870}
.nf-project-image img{width:100%;height:100%;object-fit:cover;object-position:62% center;display:block}
.nf-project-image figcaption{position:absolute;bottom:20px;left:25px;color:#fff;font-size:10px;letter-spacing:.15em}
.nf-project-info .nf-eyebrow{color:#bfab90}
.nf-project-info h2{font:400 clamp(63px,6vw,100px)/.99 Georgia,serif;letter-spacing:-.064em;margin:25px 0}
.nf-project-info h2 em{color:#c1a98d;font-weight:400}
.nf-project-info>p{max-width:380px;font-size:16px;line-height:1.84;color:#c0b7aa}
.nf-project-info dl{margin:54px 0 0;border-top:1px solid #62594e}
.nf-project-info dl div{padding:19px 0;border-bottom:1px solid #62594e;display:flex;justify-content:space-between;gap:15px}
.nf-project-info dt{font-size:10px;letter-spacing:.13em;color:#bda58a}
.nf-project-info dd{font-size:12px;margin:0;text-align:right}
.nf-end{text-align:center;padding:130px 0;background:#e9e3d9}
.nf-end .nf-eyebrow{justify-content:center}
.nf-end h2{font:400 clamp(56px,6.5vw,100px)/1 Georgia,serif;letter-spacing:-.063em;margin:28px 0}
.nf-end h2 em{color:#8c7b68}
.nf-end p{max-width:580px;margin:0 auto 35px;color:#635b51;line-height:1.8}
.nf-end .nf-main-link{margin:auto}
.nf-footer{min-height:95px;display:flex;justify-content:space-between;align-items:center;gap:20px;color:#776e64;font-size:11px;letter-spacing:.09em}

/* ========== 02 — SOLA ========== */
.so33{background:#f4ede2;color:#3a332b;font-family:Arial,Helvetica,sans-serif}
.so-container{width:min(100% - 88px,1410px);margin-inline:auto}
.so33 a{text-decoration:none}
.so-nav{height:100px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.so-wordmark{font:400 49px/.9 Georgia,serif;letter-spacing:-.095em}
.so-wordmark span{color:#9d8c67}
.so-nav nav{display:flex;align-items:center;gap:clamp(20px,3vw,52px);font-size:12px}
.so-nav nav a:hover{color:#a27e57}
.so-nav-action{border-bottom:1px solid #8b765e;padding-bottom:7px;white-space:nowrap}
.so-hero{min-height:clamp(650px,calc(100svh - 100px),930px);position:relative;overflow:hidden;display:flex;flex-direction:column;background:#eaddc8}
.so-hero-photo{position:absolute;inset:0;z-index:0}
.so-hero-photo img{width:100%;height:100%;object-fit:cover;object-position:right center;display:block}
.so-hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(244,232,210,.69) 0%,rgba(244,232,210,.24) 38%,transparent 70%)}
.so-hero-inner{flex:1;position:relative;z-index:1;display:flex;flex-direction:column;align-items:start;justify-content:center;padding-block:80px 65px}
.so-eyebrow,.so-kicker{font-size:11px;letter-spacing:.18em;font-weight:700;color:#726d51}
.so-hero h1{margin:38px 0 27px;font:400 clamp(72px,8vw,144px)/.95 Georgia,'Times New Roman',serif;letter-spacing:-.079em;text-wrap:balance}
.so-hero h1 em{font-weight:400;color:#787f62}
.so-hero-inner>p{max-width:370px;font-size:17px;line-height:1.75;color:#514c3e;margin:0 0 33px}
.so-button{display:inline-flex;align-items:center;justify-content:space-between;gap:38px;border:1px solid #4f4a37;background:#4f4a37;color:#fff;padding:19px 25px;min-width:218px;font-size:12px;font-weight:700;transition:transform .28s ease,background .28s ease}
.so-button:hover{transform:translateY(-2px);background:#73715a}
.so-side-note{position:absolute;right:3px;top:45%;writing-mode:vertical-rl;font-size:10px;letter-spacing:.16em;color:#403c35}
.so-hero-foot{position:relative;z-index:1;display:flex;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:.14em;padding-bottom:30px;color:#40392e}
.so-philosophy{padding:134px 0 160px}
.so-philosophy-grid{display:grid;grid-template-columns:1fr .64fr;gap:10%;align-items:start;margin-top:50px}
.so-philosophy h2{font:400 clamp(64px,6.8vw,116px)/1.0 Georgia,serif;letter-spacing:-.068em;margin:0}
.so-philosophy h2 em{color:#8a937b;font-weight:400}
.so-philosophy-grid p{font-size:17px;color:#655e51;line-height:1.9;margin:10px 0 23px}
.so-philosophy-grid a{display:inline-flex;gap:30px;margin-top:10px;border-bottom:1px solid #a6a08c;padding-bottom:10px;font-size:13px;font-weight:700}
.so-feature{display:grid;grid-template-columns:1fr .83fr;min-height:660px;background:#d4d2bd}
.so-feature-image{overflow:hidden;position:relative;min-height:610px}
.so-feature-image img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:66% center;filter:saturate(.8)}
.so-feature-body{padding:clamp(65px,8vw,135px);display:flex;flex-direction:column;justify-content:center;align-items:start}
.so-feature-body h2{font:400 clamp(60px,6.1vw,105px)/1 Georgia,serif;letter-spacing:-.075em;margin:35px 0 26px}
.so-feature-body h2 em{color:#778167;font-weight:400}
.so-feature-body p{font-size:16px;line-height:1.9;color:#5e5e51;max-width:420px}
.so-feature-foot{width:100%;display:flex;gap:20px;justify-content:space-between;border-top:1px solid #aca996;margin-top:75px;padding-top:18px;font-size:10px;letter-spacing:.1em}
.so-end{padding:125px 24px 135px;text-align:center;background:#535f4a;color:#f5f0e6}
.so-end .so-kicker{color:#d4dfbd}
.so-end h2{font:400 clamp(60px,7vw,112px)/.99 Georgia,serif;letter-spacing:-.073em;margin:32px 0}
.so-end h2 em{color:#d2dcb8;font-weight:400}
.so-end p{max-width:590px;margin:0 auto 35px;line-height:1.8;color:#e1e8d8}
.so-end .so-button{background:#f0ede2;color:#353d30;border-color:#f0ede2;margin:auto}
.so-footer{min-height:95px;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:11px;letter-spacing:.09em;color:#847b68}

/* ========== 03 — PULSE: composição de produto menos genérica ========== */
.pulse .pulse-hero{background:radial-gradient(ellipse 42% 55% at 84% 52%,#174f4a 0%,transparent 85%),linear-gradient(120deg,#071a20,#0b2d30);}
.pulse .pulse-hero>.wrap{max-width:1460px;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);column-gap:clamp(45px,5vw,85px);align-items:center;position:relative}
.pulse .pulse-hero>.wrap>.smallcaps,.pulse .pulse-hero h1,.pulse .pulse-hero p,.pulse .pulse-hero .demo-cta{grid-column:1}
.pulse .pulse-hero>.wrap>.smallcaps{grid-row:1;align-self:end}
.pulse .pulse-hero h1{grid-row:2;font-size:clamp(65px,6vw,114px);align-self:end;line-height:.98;margin:25px 0 28px}
.pulse .pulse-hero p{grid-row:3;margin:0 0 35px;max-width:470px}
.pulse .pulse-hero .demo-cta{grid-row:4;justify-self:start;align-self:start}
.pulse .pulse-dashboard{grid-column:2;grid-row:1 / 6;margin:0;max-width:none;grid-template-columns:65px 1fr;box-shadow:0 40px 135px #0008,0 0 0 12px #174f4d29;transform:perspective(1700px) rotateY(-7deg) rotateX(2deg);transform-origin:center;transition:transform .8s cubic-bezier(.2,.8,.2,1),box-shadow .7s}
.pulse .pulse-dashboard:hover{transform:perspective(1700px) rotateY(-2deg) rotateX(0)}
.pulse .pulse-main{padding:clamp(20px,2.5vw,40px)}
.pulse .pulse-side{padding:30px 13px}
.pulse .pulse-board-data strong{font-variant-numeric:tabular-nums}
.pulse .pulse-hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(#78e8cc0a 1px,transparent 1px),linear-gradient(90deg,#78e8cc08 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(90deg,transparent 40%,black 100%);pointer-events:none}

@media(max-width:1090px){
 .nf-hero{grid-template-columns:48% 52%}.nf-editorial h1{font-size:clamp(66px,7.4vw,100px)}.nf-intro-grid{gap:45px}
 .so-hero h1{font-size:clamp(70px,8vw,112px)}
 .pulse .pulse-hero>.wrap{grid-template-columns:1fr;gap:30px}
 .pulse .pulse-hero>.wrap>.smallcaps,.pulse .pulse-hero h1,.pulse .pulse-hero p,.pulse .pulse-hero .demo-cta{grid-column:1}
 .pulse .pulse-hero>.wrap>.smallcaps{grid-row:1}
 .pulse .pulse-hero h1{grid-row:2}
 .pulse .pulse-hero p{grid-row:3}
 .pulse .pulse-hero .demo-cta{grid-row:4}
 .pulse .pulse-dashboard{grid-column:1;grid-row:5;margin-top:35px;transform:none;max-width:950px}
 .pulse .pulse-dashboard:hover{transform:none}
}
@media(max-width:740px){
 .nf-container,.so-container{width:min(100% - 40px,600px)}
 .nf-header,.so-nav{min-height:76px;height:auto;padding-block:15px}
 .nf-wordmark-note{display:none}
 .nf-header nav,.so-nav nav{gap:16px;font-size:11px}
 .nf-nav-contact,.so-nav-action{display:none}
 .nf-hero{display:flex;min-height:0;flex-direction:column;align-items:stretch;padding:50px 0 68px}
 .nf-editorial{padding:0}
 .nf-editorial h1{font-size:clamp(65px,12vw,94px);margin:28px 0 25px}
 .nf-editorial>p{font-size:15px}
 .nf-scroll{display:none}
 .nf-hero-photo{margin-top:45px;height:clamp(350px,83vw,600px)}
 .nf-aside-label{display:none}
 .nf-hero-photo figcaption{font-size:8px;padding:30px 12px 15px}
 .nf-intro{padding:85px 0}
 .nf-intro-grid,.nf-project-inner{grid-template-columns:1fr;gap:35px}
 .nf-intro-grid{margin-top:30px}
 .nf-intro h2{font-size:clamp(54px,11.3vw,90px)}
 .nf-project{padding:75px 0}
 .nf-project-image{height:430px}
 .nf-project-info h2{font-size:70px}
 .nf-end{padding:88px 0}
 .nf-end h2{font-size:clamp(52px,10vw,75px)}
 .nf-footer,.so-footer{min-height:90px;flex-wrap:wrap;font-size:10px}
 .so-hero{min-height:900px}
 .so-hero-photo img{object-position:68% bottom}
 .so-hero-photo::after{background:linear-gradient(to bottom,#f4e8d2eb 0%,#f4e8d2a6 38%,transparent 68%)}
 .so-hero-inner{justify-content:start;padding-top:66px;padding-bottom:0}
 .so-hero h1{font-size:clamp(63px,11vw,86px);margin:30px 0 22px}
 .so-hero-inner>p{font-size:15px;max-width:320px}
 .so-side-note{display:none}
 .so-hero-foot{font-size:8px;padding-bottom:20px}
 .so-philosophy{padding:82px 0}
 .so-philosophy-grid,.so-feature{grid-template-columns:1fr;gap:30px}
 .so-philosophy-grid{margin-top:25px}
 .so-philosophy h2{font-size:clamp(53px,10vw,80px)}
 .so-philosophy-grid p{font-size:15px}
 .so-feature-image{min-height:430px}
 .so-feature-image img{position:relative;height:430px;object-position:72% center}
 .so-feature-body{padding:62px 25px 65px}
 .so-feature-body h2{font-size:clamp(58px,10vw,79px)}
 .so-feature-foot{margin-top:40px}
 .so-end{padding:90px 24px}
 .so-end h2{font-size:clamp(51px,10vw,83px)}
 .pulse .pulse-hero{padding-top:80px}
 .pulse .pulse-hero h1{font-size:clamp(63px,11vw,87px)}
 .pulse .pulse-dashboard{grid-template-columns:52px 1fr;box-shadow:0 25px 80px #0007}
 .pulse .pulse-side{padding:26px 8px}
}
@media(max-width:385px){
 .nf-header nav,.so-nav nav{gap:11px}
 .nf-editorial h1{font-size:62px}
 .nf-hero-photo{height:340px}
 .so-hero{min-height:820px}
 .so-hero h1{font-size:58px}
 .so-hero-foot{flex-direction:column;gap:5px}
}
@media(prefers-reduced-motion:reduce){
 .nf-hero-photo img,.nf-main-link,.so-button,.pulse .pulse-dashboard{transition:none!important}
 .nf-hero-photo:hover img,.nf-main-link:hover,.so-button:hover,.pulse .pulse-dashboard:hover{transform:none!important}
}
/* Acabamento da dobra desktop: mantém a ação primária visível no navegador maximizado. */
@media(min-width:741px){
  .so-hero{min-height:clamp(600px,calc(100svh - 142px),820px)}
  .so-hero-inner{padding-block:30px 26px}
  .so-hero h1{font-size:clamp(68px,7vw,120px);margin:24px 0 18px}
  .so-hero-inner>p{margin-bottom:23px}
  .pulse .pulse-hero h1{font-size:clamp(58px,5.5vw,100px)}
}

/* V3.4 — O segundo capítulo da Sola passa de packshot a lifestyle editorial. */
.so-ritual{background:#d9d6c4}
.so-ritual-image{display:flex;flex-direction:column;justify-content:center;align-items:center;background:linear-gradient(125deg,#8f9b7b 0%,#c9c5a6 52%,#e6ddc8 100%);padding:clamp(40px,6vw,105px) clamp(30px,6vw,100px)}
.so-ritual-frame{position:relative;max-width:470px;width:min(100%,470px);aspect-ratio:4/5;overflow:hidden;box-shadow:20px 30px 70px #37422d38;border:12px solid #f2eedf}
.so-ritual-frame img{position:relative;width:100%;height:100%;object-fit:cover;object-position:center 60%;display:block;filter:saturate(.87) contrast(1.04);transition:transform .7s ease}
.so-ritual-image:hover .so-ritual-frame img{transform:scale(1.035)}
.so-ritual-caption{margin-top:20px;font-size:10px;letter-spacing:.16em;color:#515b48}
.so-ritual-steps{display:flex;gap:14px;flex-wrap:wrap;margin:27px 0 10px;width:100%}
.so-ritual-steps span{border-top:1px solid #aaa991;padding-top:15px;min-width:75px;flex:1;font-size:11px;color:#7b8069}
.so-ritual-steps b{font-weight:500;display:block;color:#494c40;font-size:15px;margin-top:8px}
@media(max-width:740px){.so-ritual-image{padding:55px 30px}.so-ritual-frame{width:min(100%,340px);aspect-ratio:4/4.5}.so-ritual-frame img{height:100%;position:static}.so-ritual-steps{margin-top:18px}}
@media(prefers-reduced-motion:reduce){.so-ritual-frame img{transition:none!important}.so-ritual-image:hover .so-ritual-frame img{transform:none!important}}

/* ===== V3.6 | ACABAMENTO NOVA FORMA =====
   O título deve pertencer à coluna editorial, sem invadir a fotografia.
   Removemos a antiga margem direita negativa (-22%) e ajustamos a escala
   da tipografia para diferentes larguras da janela. */
@media (min-width: 1101px) {
  .nf-editorial {
    min-width: 0;
    padding-right: clamp(28px, 3vw, 55px);
  }
  .nf-editorial h1 {
    margin: 42px 0 28px;
    max-width: 100%;
    font-size: clamp(64px, 5.55vw, 98px);
    line-height: .98;
    letter-spacing: -.07em;
    text-wrap: normal;
  }
}

/* Em tablets e notebooks estreitos, texto e imagem ocupam linhas próprias
   para manter a hierarquia editorial sem sobreposição. */
@media (min-width: 741px) and (max-width: 1100px) {
  .nf-hero {
    grid-template-columns: minmax(0, 1fr);
    gap: 38px;
    padding-top: 35px;
  }
  .nf-editorial { padding-right: 0; }
  .nf-editorial h1 {
    margin: 32px 0 25px;
    max-width: 100%;
    font-size: clamp(67px, 8vw, 94px);
    line-height: .98;
    text-wrap: normal;
  }
  .nf-hero-photo {
    height: clamp(380px, 53vw, 560px);
    width: 100%;
  }
  .nf-aside-label { right: -20px; top: 48%; }
}

/* V3.8: imagem editorial original é pequena e comprimida (824x660).
   Evita ampliar excessivamente um recorte de rosto e mostrar pixelização.
   A substituição por um novo master de alta resolução fica pendente. */
.so-ritual-frame { width:min(100%,460px); aspect-ratio:5/4; border-width:8px; }
.so-ritual-frame img { width:100%;height:100%;object-fit:cover;object-position:center center;filter:saturate(.88) contrast(1.025); }
@media(max-width:740px){.so-ritual-frame{width:min(100%,340px);aspect-ratio:5/4;}}


/* V3.10 | Sola — enquadramento mais expressivo, sem alterar tipografia. */
.so-ritual-image {
    padding: clamp(34px, 4vw, 78px) clamp(20px, 3.2vw, 58px);
}
.so-ritual-frame {
    width: min(100%, 640px);
    max-width: 640px;
    aspect-ratio: 5 / 4;
    border-width: clamp(7px, .65vw, 11px);
    box-shadow: 18px 28px 60px rgba(45, 52, 39, .19);
}
.so-ritual-frame img {
    object-fit: cover;
    object-position: center 50%;
}
@media (max-width: 740px) {
    .so-ritual-image { padding: 46px 22px; }
    .so-ritual-frame { width: min(100%, 440px); aspect-ratio: 5 / 4; }
}


/* ============================================================
   V3.15 | SOLA — REFINO DE TEXTO E RITMO EDITORIAL
   Escopo exclusivo: tipografia, respiro e leitura desta demonstração.
   As fotografias aprovadas e o layout estrutural permanecem intactos.
   ============================================================ */
/* Separa o texto secundário com uma linha editorial, sem criar novos cartões. */
.so33 .so-philosophy-grid {
  grid-template-columns: minmax(0, 1.12fr) minmax(280px, .63fr);
  gap: clamp(45px, 8vw, 145px);
  align-items: end;
}
.so33 .so-philosophy-copy {
  border-top: 1px solid rgba(111, 102, 78, .27);
  padding-top: clamp(18px, 2vw, 28px);
  max-width: 440px;
}
.so33 .so-philosophy-copy p:first-child {
  color: #484739;
  font-size: clamp(17px, 1.35vw, 19px);
  line-height: 1.76;
  margin-top: 0;
}
.so33 .so-philosophy-copy p:nth-child(2) {
  max-width: 385px;
  font-size: 15px;
  line-height: 1.82;
}
.so33 .so-philosophy-copy a { margin-top: 14px; }
/* Melhora o ritmo do texto ao lado do retrato sem mexer no recorte da foto. */
.so33 .so-feature-body p {
  font-size: clamp(16px, 1.14vw, 18px);
  line-height: 1.78;
  max-width: 445px;
}
.so33 .so-feature-body h2 { margin-bottom: clamp(22px, 2.4vw, 33px); }
.so33 .so-feature-foot { margin-top: clamp(50px, 5vw, 75px); }
/* Aviso legal separado do convite comercial, porém legível. */
.so33 .so-end .so-demo-disclaimer {
  max-width: 640px;
  margin: clamp(32px, 4vw, 52px) auto 0;
  padding-top: 18px;
  border-top: 1px solid rgba(233, 240, 221, .28);
  font-size: 12px;
  line-height: 1.75;
  color: #d8e1d1;
}
@media (max-width: 740px) {
  .so33 .so-philosophy-grid { grid-template-columns: 1fr; gap: 30px; }
  .so33 .so-philosophy-copy { max-width: 100%; padding-top: 22px; }
  .so33 .so-feature-body p { font-size: 16px; }
  .so33 .so-feature-foot { margin-top: 42px; }
  .so33 .so-end h2 { font-size: clamp(42px, 9.1vw, 58px); }
  .so33 .so-end .so-demo-disclaimer { font-size: 11px; }
}


/* =============================================================
   V3.16 | NOVA FORMA — DIREÇÃO EDITORIAL DE ARQUITETURA
   Restrito ao conceito Nova Forma. Sem alteração de imagens,
   Sola, Ália, scripts ou identidade geral do ARBEX STUDIO.
   ============================================================= */
/* Inspirado em cadernos de arquitetura: alinhamentos rigorosos,
   tipografia de leitura e uma linha vertical que organiza o discurso. */
.nf33 .nf-intro-grid {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .72fr);
  gap: clamp(48px, 7vw, 124px);
  align-items: start;
}
.nf33 .nf-intro-copy {
  max-width: 480px;
  border-left: 1px solid rgba(126, 108, 88, .34);
  padding: 3px 0 1px clamp(23px, 2.7vw, 42px);
}
.nf33 .nf-intro-copy p:first-child {
  font: 400 clamp(20px, 1.5vw, 24px)/1.6 Georgia, 'Times New Roman', serif;
  letter-spacing: -.015em;
  color: #35302b;
  margin-bottom: 22px;
}
.nf33 .nf-intro-copy p:nth-child(2) {
  color: #625a50;
  font-size: 15px;
  line-height: 1.84;
}
.nf33 .nf-intro-copy a { margin-top: 14px; }
.nf33 .nf-project-info > p { max-width: 425px; line-height: 1.9; }
.nf33 .nf-project-info dl { margin-top: clamp(34px, 4vw, 56px); }
/* A chamada final torna clara a ponte para o estúdio comercial, sem
   misturar a narrativa ficcional com a contratação real. */
.nf33 .nf-end p { max-width: 620px; font-size: clamp(16px, 1.15vw, 18px); }
.nf33 .nf-demo-disclaimer {
  display: block;
  max-width: 585px;
  margin: clamp(40px, 4.5vw, 66px) auto 0;
  padding-top: 17px;
  border-top: 1px solid rgba(125, 113, 98, .32);
  color: #696056;
  font: 400 12px/1.65 Arial, Helvetica, sans-serif;
  letter-spacing: .005em;
}
@media(max-width:740px) {
  .nf33 .nf-intro-grid { grid-template-columns: 1fr; gap: 29px; }
  .nf33 .nf-intro-copy { max-width: 100%; padding-left: 20px; }
  .nf33 .nf-intro-copy p:first-child { font-size: clamp(20px, 5.4vw, 23px); }
  .nf33 .nf-end p { font-size: 16px; }
  .nf33 .nf-demo-disclaimer { margin-top: 38px; }
}

/* ============================================================
   V3.18 — LEGIBILIDADE DE LEGENDAS DAS DEMOS (NOVA + SOLA)
   Sem alterar fotografias, títulos, paletas ou composição-base.
   ============================================================ */
.nf33 .nf-hero-photo figcaption {
  font-size: 10px;
  letter-spacing: .10em;
  line-height: 1.55;
}
.nf33 .nf-project-image figcaption {
  font-size: 11px;
  line-height: 1.45;
}
@media (max-width: 740px) {
  .nf33 .nf-hero-photo figcaption {
    font-size: 10px;
    letter-spacing: .055em;
    gap: 8px;
    padding: 30px 14px 15px;
  }
  .so33 .so-demo-disclaimer {
    font-size: 12px;
    line-height: 1.75;
  }
  .so33 .so-hero-foot {
    font-size: 10px;
    letter-spacing: .10em;
  }
}


/* ============================================================
   V3.19 — AFINAÇÃO DE CONTRASTE E NAVEGAÇÃO
   Nova Forma e Sola: sem mudança de famílias, imagem ou hierarquia.
   ============================================================ */
/* Tons escuros com contraste mais alto nos fundos minerais claros. */
.nf33 .nf-wordmark-note,
.nf33 .nf-scroll,
.nf33 .nf-aside-label { color: #705b48; }
.nf33 .nf-hero .nf-eyebrow { color: #705b48; }
.nf33 .nf-end .nf-eyebrow { color: #705b48; }
.nf33 .nf-footer { color: #65594b; }
/* Legenda clara sobre fotografia: vinheta restrita à borda inferior. */
.nf33 .nf-project-image::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: auto 0 0;
  height: 112px;
  pointer-events: none;
  background: linear-gradient(to top, rgba(24,21,17,.76), rgba(24,21,17,0));
}
.nf33 .nf-project-image figcaption { z-index: 1; }

/* Sola: microtextos mais legíveis em suas respectivas superfícies. */
.so33 .so-hero .so-eyebrow { color: #57523d; }
.so33 .so-philosophy .so-kicker { color: #57523d; }
.so33 .so-feature .so-kicker { color: #514e37; }
.so33 .so-footer { color: #625a4b; }

/* Os links de navegação e retorno ganham altura útil sem virar botões. */
.nf33 .demo-ribbon a, .so33 .demo-ribbon a,
.nf33 .nf-intro-copy a, .so33 .so-philosophy-grid a,
.nf33 .nf-footer a, .so33 .so-footer a {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
}

/* Barra de navegação: ampliar por padding, sem reexibir links ocultos no celular. */
.nf33 .nf-header nav a, .so33 .so-nav nav a { padding-block: 12px; }

/* Navegação compacta: toques confortáveis respeitando os breakpoints. */
.nf33 .nf-header nav a { padding-block: 16px; }
.so33 .so-nav nav a { padding-block: 16px; padding-inline: 4px; }
.nf33 .nf-wordmark { padding-block: 9px; }

.nf33 .nf-header nav a { padding-inline: 6px; }
