/*
Theme Name: Cucato Lins Advocacia
Theme URI: https://cucatolins.adv.br/
Author: Cucato Lins
Description: Tema institucional sóbrio e responsivo para advocacia, com modo de pré-lançamento e conteúdo informativo compatível com as normas da OAB.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: cucato-lins
*/

:root {
  --cl-ink: #111827;
  --cl-night: #07101e;
  --cl-night-soft: #0d1b2e;
  --cl-gold: #b9975b;
  --cl-gold-light: #d9bd86;
  --cl-ivory: #f6f2e9;
  --cl-paper: #fffdf8;
  --cl-muted: #667085;
  --cl-line: rgba(185, 151, 91, .25);
  --cl-radius: 18px;
  --cl-shadow: 0 24px 70px rgba(7, 16, 30, .12);
  --cl-serif: Georgia, "Times New Roman", serif;
  --cl-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--cl-ink);
  background: var(--cl-paper);
  font-family: var(--cl-sans);
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
button, input, textarea { font: inherit; }
:focus-visible { outline: 3px solid var(--cl-gold-light); outline-offset: 3px; }

.cl-container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.cl-skip { position: fixed; left: 16px; top: -80px; z-index: 9999; padding: 10px 16px; background: #fff; color: #000; }
.cl-skip:focus { top: 16px; }

.cl-header {
  position: sticky; top: 0; z-index: 1000;
  background: rgba(7, 16, 30, .94);
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(14px);
}
.cl-header__inner { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.cl-brand { display: inline-flex; align-items: center; gap: 13px; }
.cl-brand__mark {
  width: 46px; height: 46px; display: grid; place-items: center;
  border: 1px solid var(--cl-gold); color: var(--cl-gold-light);
  font-family: var(--cl-serif); font-size: 19px; letter-spacing: .05em;
}
.cl-brand__name { display: block; font-family: var(--cl-serif); font-size: 20px; letter-spacing: .02em; line-height: 1.1; }
.cl-brand__sub { display: block; margin-top: 5px; color: #c6ccd5; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; }
.cl-nav { display: flex; align-items: center; gap: 30px; }
.cl-nav a { color: #d9dee6; font-size: 14px; transition: color .2s ease; }
.cl-nav a:hover { color: var(--cl-gold-light); }
.cl-menu-toggle { display: none; border: 1px solid rgba(255,255,255,.22); background: transparent; color: #fff; padding: 8px 11px; border-radius: 8px; }

.cl-hero {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: 680px; display: grid; align-items: center;
  color: #fff; background: linear-gradient(135deg, #07101e 5%, #0c1c30 64%, #152a42 100%);
}
.cl-hero::before {
  content: ""; position: absolute; z-index: -1; inset: 0;
  background: radial-gradient(circle at 78% 25%, rgba(185,151,91,.18), transparent 33%),
    linear-gradient(115deg, transparent 55%, rgba(255,255,255,.025) 55% 56%, transparent 56%);
}
.cl-hero::after { content: "CL"; position: absolute; z-index: -1; right: 2%; bottom: -18%; color: rgba(255,255,255,.025); font: 700 430px/1 var(--cl-serif); }
.cl-hero__content { max-width: 780px; padding: 110px 0 120px; }
.cl-eyebrow { margin: 0 0 20px; color: var(--cl-gold-light); font-size: 12px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
.cl-hero h1 { margin: 0; max-width: 760px; font: 400 clamp(44px, 6.2vw, 78px)/1.08 var(--cl-serif); letter-spacing: -.03em; }
.cl-hero__lead { max-width: 660px; margin: 28px 0 0; color: #d6dce5; font-size: clamp(18px, 2vw, 21px); }
.cl-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 38px; }
.cl-btn { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; padding: 12px 22px; border: 1px solid var(--cl-gold); border-radius: 3px; font-size: 14px; font-weight: 700; letter-spacing: .03em; transition: .2s ease; cursor: pointer; }
.cl-btn--gold { background: var(--cl-gold); color: #07101e; }
.cl-btn--gold:hover { background: var(--cl-gold-light); border-color: var(--cl-gold-light); transform: translateY(-1px); }
.cl-btn--ghost { color: #fff; background: transparent; }
.cl-btn--ghost:hover { background: rgba(255,255,255,.07); }

.cl-principles { margin-top: -44px; position: relative; z-index: 3; }
.cl-principles__grid { display: grid; grid-template-columns: repeat(3,1fr); background: #fff; box-shadow: var(--cl-shadow); border-top: 3px solid var(--cl-gold); }
.cl-principle { padding: 28px 34px; border-right: 1px solid #e8e8e8; }
.cl-principle:last-child { border-right: 0; }
.cl-principle strong { display: block; font: 400 21px/1.2 var(--cl-serif); }
.cl-principle span { display: block; margin-top: 7px; color: var(--cl-muted); font-size: 13px; }

.cl-section { padding: 112px 0; }
.cl-section--soft { background: var(--cl-ivory); }
.cl-section--dark { background: var(--cl-night); color: #fff; }
.cl-section__head { display: grid; grid-template-columns: .85fr 1.15fr; gap: 80px; align-items: end; margin-bottom: 58px; }
.cl-section h2 { margin: 0; font: 400 clamp(36px, 4.5vw, 56px)/1.1 var(--cl-serif); letter-spacing: -.025em; }
.cl-section__intro { margin: 0; color: var(--cl-muted); font-size: 18px; }
.cl-section--dark .cl-section__intro { color: #bac3d0; }
.cl-rule { width: 56px; height: 2px; margin: 20px 0; background: var(--cl-gold); }

.cl-about { display: grid; grid-template-columns: 1fr .86fr; gap: 80px; align-items: center; }
.cl-about__card { position: relative; min-height: 430px; padding: 54px; background: var(--cl-night-soft); color: #fff; box-shadow: var(--cl-shadow); overflow: hidden; }
.cl-about__card::after { content: "CL"; position: absolute; right: -20px; bottom: -50px; color: rgba(255,255,255,.035); font: 240px/1 var(--cl-serif); }
.cl-about__card blockquote { position: relative; z-index: 1; margin: 0; font: 400 29px/1.4 var(--cl-serif); }
.cl-about__card p { position: relative; z-index: 1; margin-top: 28px; color: #bfc8d5; }
.cl-copy p { color: var(--cl-muted); }

.cl-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.cl-area { min-height: 260px; padding: 32px; border: 1px solid #dfd8c9; background: rgba(255,255,255,.54); transition: .2s ease; }
.cl-area:hover { border-color: var(--cl-gold); transform: translateY(-3px); box-shadow: 0 18px 50px rgba(17,24,39,.08); }
.cl-area__num { color: var(--cl-gold); font-size: 12px; letter-spacing: .14em; }
.cl-area h3 { margin: 38px 0 12px; font: 400 24px/1.25 var(--cl-serif); }
.cl-area p { margin: 0; color: var(--cl-muted); font-size: 14px; }

.cl-method { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: rgba(255,255,255,.14); }
.cl-step { min-height: 260px; padding: 32px; background: var(--cl-night); }
.cl-step__num { color: var(--cl-gold-light); font: 400 31px var(--cl-serif); }
.cl-step h3 { margin: 34px 0 10px; font: 400 21px var(--cl-serif); }
.cl-step p { color: #aeb8c6; font-size: 14px; }

.cl-contact { display: grid; grid-template-columns: .78fr 1.22fr; gap: 80px; }
.cl-contact__details { color: var(--cl-muted); }
.cl-contact__details a { color: var(--cl-ink); border-bottom: 1px solid var(--cl-gold); }
.cl-form { padding: 40px; background: #fff; border: 1px solid #e1d8c8; box-shadow: 0 24px 60px rgba(17,24,39,.07); }
.cl-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.cl-field { margin-bottom: 18px; }
.cl-field label { display: block; margin-bottom: 7px; font-size: 13px; font-weight: 700; }
.cl-field input, .cl-field textarea { width: 100%; border: 1px solid #ccd0d5; background: #fff; padding: 12px 14px; border-radius: 2px; }
.cl-field textarea { min-height: 132px; resize: vertical; }
.cl-consent { display: flex; gap: 10px; align-items: flex-start; color: var(--cl-muted); font-size: 12px; }
.cl-consent input { margin-top: 5px; }
.cl-hp { position: absolute !important; left: -9999px !important; }
.cl-alert { padding: 12px 16px; margin-bottom: 18px; border-left: 3px solid var(--cl-gold); background: #f5f0e6; font-size: 14px; }

.cl-legal { padding: 34px 0; color: #aeb7c3; background: #050b14; font-size: 12px; }
.cl-legal__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; }
.cl-footer { padding: 52px 0; color: #d5dbe4; background: #07101e; border-top: 1px solid rgba(255,255,255,.08); }
.cl-footer__inner { display: flex; justify-content: space-between; gap: 30px; align-items: flex-end; }
.cl-footer p { margin: 10px 0 0; color: #9ea9b8; font-size: 13px; }
.cl-footer__links { display: flex; gap: 20px; font-size: 13px; }
.cl-footer__links a:hover { color: var(--cl-gold-light); }

.cl-prelaunch { min-height: 100vh; display: grid; place-items: center; padding: 36px; color: #fff; background: radial-gradient(circle at 75% 20%, #1b3550, #07101e 52%); }
.cl-prelaunch__box { width: min(700px,100%); padding: clamp(34px,7vw,72px); border: 1px solid rgba(185,151,91,.5); background: rgba(7,16,30,.72); }
.cl-prelaunch h1 { margin: 28px 0 16px; font: 400 clamp(42px,8vw,68px)/1.08 var(--cl-serif); }
.cl-prelaunch p { max-width: 520px; color: #bdc7d5; }
.cl-prelaunch__note { margin-top: 34px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.12); font-size: 12px; }

.cl-content { min-height: 60vh; padding: 80px 0; }
.cl-content h1 { font: 400 clamp(38px,5vw,58px) var(--cl-serif); }
.cl-content__body { max-width: 800px; }

@media (max-width: 900px) {
  .cl-header__inner { min-height: 72px; }
  .cl-menu-toggle { display: inline-flex; }
  .cl-nav { display: none; position: absolute; left: 0; right: 0; top: 72px; padding: 24px 20px; flex-direction: column; align-items: flex-start; background: #07101e; border-top: 1px solid rgba(255,255,255,.08); }
  .cl-nav.is-open { display: flex; }
  .cl-hero { min-height: 620px; }
  .cl-hero__content { padding: 92px 0 110px; }
  .cl-hero::after { font-size: 260px; }
  .cl-principles__grid, .cl-section__head, .cl-about, .cl-contact { grid-template-columns: 1fr; }
  .cl-section__head, .cl-about, .cl-contact { gap: 34px; }
  .cl-grid { grid-template-columns: repeat(2,1fr); }
  .cl-method { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 620px) {
  .cl-container { width: min(100% - 28px, 1180px); }
  .cl-brand__sub { display: none; }
  .cl-brand__name { font-size: 18px; }
  .cl-section { padding: 78px 0; }
  .cl-principles { margin-top: -24px; }
  .cl-principles__grid, .cl-grid, .cl-method, .cl-form__row, .cl-legal__grid { grid-template-columns: 1fr; }
  .cl-principle { border-right: 0; border-bottom: 1px solid #e8e8e8; }
  .cl-principle:last-child { border-bottom: 0; }
  .cl-area { min-height: auto; }
  .cl-step { min-height: auto; }
  .cl-about__card, .cl-form { padding: 30px 24px; }
  .cl-footer__inner { align-items: flex-start; flex-direction: column; }
  .cl-footer__links { flex-wrap: wrap; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
