/* ---------- TOKENS ---------- */
:root{
  /* WHITE mode (geral) */
  --bg:#F5F2EB;
  --bg-2:#EEEADE;
  --bg-3:#E0DBCF;
  --ink:#1A1814;
  --ink-2:#2B2A24;
  --muted:rgba(26,24,20,.61);
  --line:rgba(26,24,20,.10);
  --line-2:rgba(26,24,20,.06);
  --accent:#8B7355;     /* cobre/dourado editorial */
  --accent-2:#5A5C50;
  --hi:#8B7355;
  --glass-light:rgba(255,255,255,.45);
  --glass-dark:rgba(18,15,12,.60);
  --blur-base:blur(16px) saturate(160%);
  --nav-bg:rgba(245,242,235,.72);
  --nav-bg-scrolled:rgba(245,242,235,.88);
  --nav-border:rgba(26,24,20,.08);
  --nav-text:#1A1814;
  --subnav-bg:rgba(235,230,220,.80);
  --card-odd:rgba(255,255,255,.45);
  --card-odd-border:rgba(255,255,255,.6);
  --card-even:rgba(30,25,20,.06);
  --card-even-border:rgba(30,25,20,.10);
  --card-shadow:0 8px 32px rgba(30,20,10,.08), inset 0 1px 0 rgba(255,255,255,.7);
  --tag-bg:rgba(30,25,20,.08);
  --tag-border:rgba(30,25,20,.15);
  --serif:"Domine", "Times New Roman", serif;
  --sans:"Plus Jakarta Sans", system-ui, sans-serif;
  --mono:"JetBrains Mono", ui-monospace, monospace;
  --t-fast:.45s cubic-bezier(.6,.05,.2,1);
  --t:.85s cubic-bezier(.6,.05,.2,1);
  --t-slow:1.4s cubic-bezier(.6,.05,.2,1);
  --r:2px;
  --maxw:1440px;
  --pad:48px;
  --mode-bg:#F6F3ED;
  /* TYPE SCALE */
  --fs-display-xl:clamp(72px, 11vw, 188px);
  --fs-display-lg:clamp(54px, 8vw, 140px);
  --fs-display-md:clamp(38px, 5vw, 84px);
  --fs-title:clamp(28px, 3vw, 48px);
  --fs-body-lg:22px;
  --fs-body:16px;
  --fs-small:13px;
  /* SPACING */
  --space-xs:8px;
  --space-sm:16px;
  --space-md:32px;
  --space-lg:64px;
  --space-xl:120px;
}
.safe-wrap{ position:relative; isolation:isolate; }
.ratio-portrait{ aspect-ratio:3/4; } .ratio-editorial{ aspect-ratio:5/6; } .ratio-landscape{ aspect-ratio:16/9; }
html[data-mode="dark"]{
  --bg:#0E0C0A;
  --bg-2:#161410;
  --bg-3:#1F1B17;
  --ink:#F0ECE3;
  --ink-2:#D9D2C0;
  --muted:rgba(240,236,227,.55);
  --line:rgba(240,236,227,.08);
  --line-2:rgba(240,236,227,.05);
  --accent:#B89466;
  --accent-2:#7A5A36;
  --hi:#C9A35A;
  --mode-bg:#0E0C0A;
  --nav-bg:rgba(18,16,14,.78);
  --nav-bg-scrolled:rgba(18,16,14,.92);
  --nav-border:rgba(255,255,255,.08);
  --nav-text:#F0ECE3;
  --subnav-bg:rgba(12,10,8,.82);
  --card-odd:rgba(22,19,16,.55);
  --card-odd-border:rgba(255,255,255,.08);
  --card-even:rgba(60,52,40,.35);
  --card-even-border:rgba(255,255,255,.12);
  --card-shadow:0 8px 32px rgba(0,0,0,.24);
  --tag-bg:rgba(255,255,255,.08);
  --tag-border:rgba(255,255,255,.15);
}
@media (max-width: 900px){ :root{ --pad:22px; } }

*{box-sizing:border-box; margin:0; padding:0;}
html, body{ background:var(--bg); color:var(--ink); font-family:var(--sans); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;}
body{ overflow-x:hidden; transition: background var(--t) ease, color var(--t) ease; cursor:none;}
@media (hover:none){ body{ cursor:auto;} }

/* GRAIN OVERLAY */
body::before{
  content:""; position:fixed; inset:0; z-index:9998; pointer-events:none; opacity:.06;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .9 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode:multiply;
}
html[data-mode="dark"] body::before{ mix-blend-mode:screen; opacity:.08;}

/* CUSTOM CURSOR */
.cur-dot, .cur-ring{ position:fixed; top:0; left:0; pointer-events:none; z-index:10000; mix-blend-mode:difference;}
.cur-dot{ width:6px; height:6px; border-radius:50%; background:#fff; transform:translate(-50%,-50%); transition: width .25s, height .25s, background .25s;}
.cur-ring{ width:38px; height:38px; border:1px solid rgba(255,255,255,.55); border-radius:50%; transform:translate(-50%,-50%); transition: width .35s ease, height .35s ease, border-color .25s, transform .12s linear;}
.cur-hover .cur-dot{ width:0; height:0;}
.cur-hover .cur-ring{ width:64px; height:64px; border-color:#fff;}
@media (hover:none){ .cur-dot,.cur-ring{ display:none;} }

/* PRELOADER */
.preloader{ position:fixed; inset:0; z-index:10001; background:var(--bg); display:flex; align-items:center; justify-content:center; flex-direction:column; gap:32px; transition: opacity .8s ease, visibility .8s; }
.preloader.done{ opacity:0; visibility:hidden;}
.preloader .pl-mark{ font-family:var(--serif); font-size:clamp(40px, 8vw, 110px); line-height:1.15; letter-spacing:-.02em; padding:0 8vw; display:flex; gap:.05em; white-space:nowrap;}
.preloader .pl-mark span{ display:inline-block;}
.preloader .pl-mark span{ opacity:0; transform:translateY(20px); animation: plRise .9s cubic-bezier(.7,0,.2,1) forwards;}
.preloader .pl-mark span:nth-child(2){ animation-delay:.06s;}
.preloader .pl-mark span:nth-child(3){ animation-delay:.12s; font-style:italic; color:var(--accent);}
@keyframes plRise{ to{ opacity:1; transform:translateY(0);} }
.preloader .pl-bar{ width:min(360px, 60vw); height:1px; background:var(--line); position:relative; overflow:hidden;}
.preloader .pl-bar::after{ content:""; position:absolute; inset:0; background:var(--ink); transform-origin:left; animation: plFill 1.6s cubic-bezier(.7,0,.2,1) forwards;}
@keyframes plFill{ from{ transform:scaleX(0);} to{ transform:scaleX(1);} }
.preloader .pl-meta{ font-family:var(--mono); font-size:10px; letter-spacing:.24em; text-transform:uppercase; color:var(--muted);}
img{ display:block; max-width:100%;}
a{ color:inherit; text-decoration:none;}
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer;}
::selection{ background:var(--ink); color:var(--bg);}

/* page wash transition (cinematic) */
.curtain{
  position:fixed; inset:0; z-index:9999; pointer-events:none;
  background:var(--bg);
  clip-path:inset(0 0 100% 0);
  transition: clip-path .9s cubic-bezier(.7,0,.2,1);
}
.curtain.show{ clip-path:inset(0 0 0 0); }
.curtain.exit{ clip-path:inset(100% 0 0 0); }

/* ---------- TYPE ---------- */
.h-display{ font-family:var(--serif); font-weight:500; letter-spacing:-.02em; line-height:.95;}
.h-eyebrow{ font-family:var(--mono); font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--muted);}
.body-l{ font-family:var(--serif); font-weight:400; font-size:22px; line-height:1.45; letter-spacing:-.005em;}
.body-m{ font-size:15.5px; line-height:1.65; color:var(--ink-2); font-weight:300;}
.body-s{ font-size:13px; line-height:1.6; color:var(--muted); font-weight:300;}
.num{ font-family:var(--mono); font-size:11px; letter-spacing:.16em; color:var(--muted);}
.italic{ font-style:italic;}

/* ---------- HEADER ---------- */
.hdr{
  background:var(--nav-bg); backdrop-filter:var(--blur-base); -webkit-backdrop-filter:var(--blur-base);
  border-bottom:1px solid var(--nav-border);
  position:fixed; top:0; left:0; right:0; z-index:200;
  display:flex; align-items:center; justify-content:space-between;
  padding:22px var(--pad);
  transition: background var(--t-fast), border-color var(--t-fast), padding var(--t-fast), backdrop-filter var(--t-fast);
  border-bottom:1px solid transparent;
}
.hdr.scrolled{
  background:color-mix(in srgb, var(--bg) 82%, transparent);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  border-bottom:1px solid var(--line-2);
  padding:14px var(--pad);
}
.brand{ display:flex; align-items:baseline; gap:12px; font-family:var(--serif); font-size:18px; letter-spacing:.01em; }
.brand .mono{ font-family:var(--mono); font-size:10px; letter-spacing:.24em; color:var(--muted); text-transform:uppercase; padding-top:4px;}
.brand-mark{ width:22px; height:22px; border:1px solid var(--ink); border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-family:var(--serif); font-size:11px; transform:translateY(3px);}
.hdr-right{ display:flex; align-items:center; gap:6px;}
.chip{
  display:inline-flex; align-items:center; gap:8px; padding:10px 14px;
  border:1px solid var(--line); border-radius:999px;
  font-family:var(--mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-2);
  transition: all var(--t-fast);
}
.chip:hover{ border-color:var(--ink); color:var(--ink);}
.chip.solid{ background:var(--ink); color:var(--bg); border-color:var(--ink);}
.chip.solid:hover{ background:transparent; color:var(--ink);}
.chip .dot{ width:6px; height:6px; border-radius:50%; background:var(--hi);}
.menu-btn{ display:flex; flex-direction:column; gap:5px; width:42px; height:42px; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:999px; transition:all var(--t-fast);}
.menu-btn:hover{ border-color:var(--ink);}
.menu-btn span{ width:14px; height:1px; background:var(--ink); transition: all .35s;}
@media (max-width: 760px){
  .hdr-right .chip:not(.essential){ display:none;}
}

/* ---------- LAYOUT ---------- */
main{ padding-top:0;}
.section{ padding:var(--space-xl) var(--pad); position:relative;}
.section.tight{ padding:80px var(--pad);}
@media (max-width:760px){ .section{ padding:80px var(--pad);} .section.tight{ padding:56px var(--pad);} }
.wrap{ max-width:var(--maxw); margin:0 auto;}
.grid-12{ display:grid; grid-template-columns:repeat(12,1fr); gap:24px;}
.divide{ height:1px; background:var(--line); width:100%;}

/* ---------- HERO ---------- */
.hero{ min-height:calc(100vh - 30px); padding:160px var(--pad) 80px; position:relative; display:grid; grid-template-rows:auto 1fr auto; gap:48px; isolation:isolate; overflow:hidden;}
.hero-layout{ display:grid; grid-template-columns:1.3fr .7fr; align-items:end; gap:min(4vw, 56px); position:relative; isolation:isolate;}
.hero-meta{ display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:24px; }
.hero-meta .col{ display:flex; flex-direction:column; gap:6px;}
.hero-headline{
  font-size: var(--fs-display-xl);
  margin-top:0;
  max-width:min(1100px, 78vw);
  position:relative;
  z-index:2;
  overflow-wrap:break-word;
  word-break:normal;
  align-self:end;
}
.hero-headline .line{ display:block; overflow:hidden;}
.hero-headline .line > span{ display:inline-block; transform:translateY(110%); transition: transform 1.1s cubic-bezier(.7,0,.2,1);}
.hero.in .hero-headline .line > span{ transform:translateY(0);}
.hero-headline .line:nth-child(2) > span{ transition-delay:.12s;}
.hero-headline .line:nth-child(3) > span{ transition-delay:.24s; font-style:italic; font-weight:400; color:var(--accent);}
.hero-bottom{ display:grid; grid-template-columns: 1.2fr 1fr 1fr; gap:32px; align-items:end; padding-top:40px; border-top:1px solid var(--line);}
.hero-sub{ font-family:var(--serif); font-size: clamp(18px, 1.6vw, 22px); line-height:1.45; max-width:520px; opacity:0; transform:translateY(20px); transition:all 1s ease .6s;}
.hero.in .hero-sub{ opacity:1; transform:translateY(0);}
.hero-img{
  position:relative; z-index:1; align-self:end;
  width:100%; max-width:520px; margin-left:auto; aspect-ratio:3/4;
  background:var(--bg-3); overflow:hidden;
  clip-path:inset(100% 0 0 0); transition: clip-path 1.4s cubic-bezier(.7,0,.2,1) .25s;
}
.hero.in .hero-img{ clip-path:inset(0 0 0 0);}
.hero-img .img-inner{ position:absolute; inset:0; transition:transform 1.6s ease;}
.hero-img .placeholder, .img-slot .placeholder{
  position:absolute; inset:0;
  background: repeating-linear-gradient(45deg, var(--bg-2) 0 12px, var(--bg-3) 12px 24px);
  display:flex; align-items:flex-end; padding:20px;
}
.hero-img .placeholder span, .img-slot .placeholder span{ font-family:var(--mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted);}
.hero-img img, .img-slot img{ width:100%; height:100%; object-fit:cover;}
@media (max-width: 1024px){
  .hero-layout{ grid-template-columns:1fr; gap:32px;}
  .hero-img{ width:100%; max-width:100%; margin-left:0; aspect-ratio:4/5;}
  .hero-bottom{ grid-template-columns:1fr; gap:24px;}
}
@media (max-width: 900px){
  .hero{ padding:130px var(--pad) 60px; gap:32px;}
  .hero-headline{ font-size:clamp(54px, 14vw, 110px); line-height:.92; max-width:100%;}
}

/* ---------- MENU FULLSCREEN ---------- */
.fs-menu{ position:fixed; inset:0; z-index:300; pointer-events:none; }
.fs-menu .veil{ position:absolute; inset:0; background:var(--bg); clip-path: inset(0 0 100% 0); transition: clip-path 1s cubic-bezier(.7,0,.2,1);}
.fs-menu.open{ pointer-events:auto;}
.fs-menu.open .veil{ clip-path:inset(0 0 0 0);}
.fs-inner{ position:relative; height:100%; display:grid; grid-template-columns:1.2fr 1fr; gap:48px; padding:120px var(--pad) 60px;}
.fs-inner--single{ grid-template-columns:1fr !important;}
.fs-list{ display:flex; flex-direction:column; gap:6px; }
.fs-item{ display:flex; align-items:baseline; gap:14px; padding:8px 0; border-bottom:1px solid var(--line-2); overflow:hidden;}
.fs-item .k{ font-family:var(--mono); font-size:11px; color:var(--muted); width:30px;}
.fs-item .v{ font-family:var(--serif); font-size: clamp(40px, 6vw, 88px); line-height:1; letter-spacing:-.02em; transform:translateY(120%); transition: transform .9s cubic-bezier(.7,0,.2,1); display:inline-block;}
.fs-menu.open .fs-item .v{ transform:translateY(0);}
.fs-menu.open .fs-item:nth-child(1) .v{ transition-delay:.15s;}
.fs-menu.open .fs-item:nth-child(2) .v{ transition-delay:.20s;}
.fs-menu.open .fs-item:nth-child(3) .v{ transition-delay:.25s;}
.fs-menu.open .fs-item:nth-child(4) .v{ transition-delay:.30s;}
.fs-menu.open .fs-item:nth-child(5) .v{ transition-delay:.35s;}
.fs-menu.open .fs-item:nth-child(6) .v{ transition-delay:.40s;}
.fs-menu.open .fs-item:nth-child(7) .v{ transition-delay:.45s;}
.fs-meta{ display:flex; flex-direction:column; gap:48px; padding-top:60px;}
.fs-meta h6{ font-family:var(--mono); font-size:10.5px; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); margin-bottom:12px;}
.fs-meta p, .fs-meta a{ font-family:var(--serif); font-size:18px; line-height:1.4;}
.fs-close{ position:absolute; top:22px; right:var(--pad); width:42px; height:42px; border-radius:999px; border:1px solid var(--line); display:flex; align-items:center; justify-content:center;}
.fs-item:hover .v{ font-style:italic; color:var(--accent);}
@media (max-width:900px){ .fs-inner{ grid-template-columns:1fr; gap:24px;} .fs-meta{ padding-top:0;}}

/* ---------- AREAS / CARDS ---------- */
.area-card{
  position:relative; padding:38px 32px 32px; border:1px solid var(--card-odd-border);
  display:flex; flex-direction:column; gap:24px; min-height:400px;
  transition: transform .55s cubic-bezier(.6,.05,.2,1), box-shadow .55s, border-color .35s, background .35s;
  background:var(--card-odd); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  box-shadow:var(--card-shadow);
  overflow:hidden; cursor:pointer; border-radius:4px;
}
.area-card:nth-child(even){ background:var(--card-even); border-color:var(--card-even-border);}
.area-card:hover{ transform:translateY(-4px); box-shadow:0 24px 60px rgba(30,20,10,.14), inset 0 1px 0 rgba(255,255,255,.8); border-color:var(--accent);}
.area-card::before{ content:""; position:absolute; inset:0; background:radial-gradient(600px circle at var(--mx,50%) var(--my,50%), rgba(139,115,85,.10), transparent 40%); opacity:0; transition:opacity .35s; pointer-events:none;}
.area-card:hover::before{ opacity:1;}
.area-card .num{ display:flex; align-items:center; justify-content:space-between;}
.area-card .num .arrow{ width:28px; height:1px; background:var(--ink); position:relative; transition: width .4s;}
.area-card .num .arrow::after{ content:""; position:absolute; right:0; top:-3px; width:7px; height:7px; border-top:1px solid var(--ink); border-right:1px solid var(--ink); transform:rotate(45deg);}
.area-card:hover .arrow{ width:48px;}
.area-card h3{ font-family:var(--serif); font-weight:500; font-size: clamp(28px, 2.4vw, 40px); line-height:1.04; letter-spacing:-.015em; margin-top:auto;}
.area-card .tags{ display:flex; flex-wrap:wrap; gap:6px;}
.area-card .tag{ font-family:var(--mono); font-size:10px; letter-spacing:.15em; text-transform:uppercase; padding:5px 10px; border:1px solid var(--line); color:var(--muted);}
.area-card.dark{
  background:#0E0C0A; color:#EDE7DA; border-color:rgba(237,231,218,.18);
}
.area-card.dark h3, .area-card.dark .num{ color:#EDE7DA;}
.area-card.dark .num{ color:#B89466;}
.area-card.dark .arrow{ background:#B89466;}
.area-card.dark .arrow::after{ border-color:#B89466;}
.area-card.dark .tag{ border-color:rgba(237,231,218,.18); color:#8A8275;}
.area-card.dark:hover{ background:#15120F; border-color:#B89466;}

/* ---------- TIMELINE / CV ---------- */
.tl-row{ display:grid; grid-template-columns:120px 1fr 2fr; gap:32px; padding:26px 0; border-bottom:1px solid var(--line-2); align-items:start;}
.tl-row .y{ font-family:var(--mono); font-size:11px; letter-spacing:.16em; color:var(--muted); padding-top:6px;}
.tl-row .t{ font-family:var(--serif); font-size:22px; line-height:1.25; letter-spacing:-.01em;}
.tl-row .d{ font-size:14px; color:var(--ink-2); line-height:1.6; font-weight:300;}
@media (max-width:760px){ .tl-row{ grid-template-columns:1fr; gap:8px;} }

/* ---------- LOGIN / DASH ---------- */
.field{ display:flex; flex-direction:column; gap:8px;}
.field label{ font-family:var(--mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted);}
.field input, .field textarea, .field select{
  background:transparent; border:0; border-bottom:1px solid var(--line);
  padding:12px 0; font:inherit; color:var(--ink); font-family:var(--serif); font-size:18px;
  transition: border-color var(--t-fast); width:100%;
}
.field input:focus, .field textarea:focus{ outline:0; border-bottom-color:var(--ink);}
.btn-line{
  display:inline-flex; align-items:center; gap:14px; padding:18px 28px;
  border:1px solid var(--ink); font-family:var(--mono); font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  background:var(--ink); color:var(--bg); transition:all var(--t-fast); position:relative; overflow:hidden;
}
.btn-line:hover{ background:transparent; color:var(--ink);}
.btn-ghost{
  display:inline-flex; align-items:center; gap:14px; padding:18px 28px;
  border:1px solid var(--ink); font-family:var(--mono); font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  background:transparent; color:var(--ink); transition:all var(--t-fast);
}
.btn-ghost:hover{ background:var(--ink); color:var(--bg);}
.btn-arrow{ font-size:14px;}

/* ---------- DASHBOARD ---------- */
.dash-shell{ display:grid; grid-template-columns: 240px 1fr; min-height:100vh;}
.dash-side{ border-right:1px solid var(--line); padding:32px 22px; display:flex; flex-direction:column; gap:32px; position:sticky; top:0; height:100vh;}
.dash-main{ padding:42px var(--pad);}
.dash-nav{ display:flex; flex-direction:column; gap:2px; margin-top:8px;}
.dash-nav a{ display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-radius:2px; font-size:14px; color:var(--ink-2); transition: all var(--t-fast);}
.dash-nav a:hover{ background:var(--bg-2);}
.dash-nav a.active{ background:var(--ink); color:var(--bg);}
.dash-card{ border:1px solid var(--line); padding:24px; background:var(--bg-2); transition: border-color var(--t-fast);}
.dash-card:hover{ border-color:var(--ink);}
.dash-stat{ display:flex; flex-direction:column; gap:10px;}
.dash-stat .v{ font-family:var(--serif); font-size:48px; line-height:1; letter-spacing:-.02em;}
.proc-row{ display:grid; grid-template-columns: 70px 2fr 1.4fr 1fr 1fr 24px; gap:16px; padding:16px 0; border-bottom:1px solid var(--line-2); align-items:center; font-size:14px;}
.proc-row.head{ font-family:var(--mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); padding-bottom:14px;}
.pill{ display:inline-flex; align-items:center; gap:6px; padding:5px 10px; border:1px solid var(--line); font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase;}
.pill .d{ width:5px; height:5px; border-radius:50%;}
.pill.ok .d{ background:#5A7B4F;}
.pill.run .d{ background:#B89466;}
.pill.wait .d{ background:#8C6A4A;}
.msg{ display:grid; grid-template-columns: 40px 1fr auto; gap:14px; padding:16px 0; border-bottom:1px solid var(--line-2); align-items:flex-start;}
.av{ width:40px; height:40px; border-radius:50%; background:var(--bg-3); display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-size:16px;}
.doc{ display:grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap:18px;}
.doc-card{ border:1px solid var(--line); padding:18px; display:flex; flex-direction:column; gap:18px; transition: all var(--t-fast); cursor:pointer;}
.doc-card:hover{ background:var(--bg-2); transform:translateY(-2px);}
.doc-card .ico{ width:44px; height:54px; border:1px solid var(--line); position:relative;}
.doc-card .ico::after{ content:""; position:absolute; right:-1px; top:-1px; width:14px; height:14px; background:var(--bg); border-left:1px solid var(--line); border-bottom:1px solid var(--line);}
@media (max-width:1024px){
  .dash-shell{ grid-template-columns:1fr;}
  .dash-side{ position:relative; height:auto; border-right:0; border-bottom:1px solid var(--line); flex-direction:row; flex-wrap:wrap; align-items:center; gap:20px;}
  .dash-nav{ flex-direction:row; flex-wrap:wrap; margin-top:0;}
  .doc{ grid-template-columns: 1fr 1fr;}
  .proc-row{ grid-template-columns: 60px 2fr 1fr; }
  .proc-row > *:nth-child(n+4){ display:none;}
}
@media (max-width:600px){
  .dash-shell{ font-size:14px;}
  .dash-side{ padding:18px 16px; gap:12px;}
  .dash-main{ padding:28px 16px;}
  .dash-stat .v{ font-size:36px;}
  .doc{ grid-template-columns: 1fr;}
  .proc-row{ grid-template-columns: 48px 1fr 80px;}
  .proc-row > *:nth-child(n+4){ display:none;}
  .msg{ grid-template-columns: 36px 1fr auto; gap:10px;}
  .av{ width:36px; height:36px; font-size:13px;}
  .dash-card{ padding:16px;}
}

/* ---------- IMG SLOT ---------- */
.img-slot{ position:relative; background:var(--bg-3); overflow:hidden;}
.img-slot.editable{ cursor:pointer;}
.img-slot.editable:hover::after{ content:"clique para editar"; position:absolute; inset:auto 0 0 0; padding:10px 14px; background:var(--ink); color:var(--bg); font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase;}

/* ---------- ROUTER VIEWS ---------- */
.view{ display:none; opacity:0; transform:translateY(20px); transition: opacity .8s ease, transform .8s ease;}
.view.active{ display:block;}
.view.ready{ opacity:1; transform:translateY(0);}

/* ---------- REVEAL ---------- */
.rv{ opacity:0; transform:translateY(28px); transition: opacity 1s ease, transform 1s ease;}
.rv.in{ opacity:1; transform:translateY(0);}
.rv.delay-1{ transition-delay:.1s;} .rv.delay-2{ transition-delay:.2s;} .rv.delay-3{ transition-delay:.3s;} .rv.delay-4{ transition-delay:.4s;}

/* ---------- MARQUEE ---------- */
.marquee{ overflow:hidden; padding:24px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); white-space:nowrap;}
.marquee .track{ display:inline-flex; gap:72px; animation: mq 50s linear infinite; padding-right:72px;}
.marquee .track span{ font-family:var(--serif); font-size: clamp(36px, 6vw, 88px); letter-spacing:-.02em;}
.marquee .track .star{ font-family:var(--serif); color:var(--accent); align-self:center; font-size: clamp(20px, 3vw, 40px);}
@keyframes mq{ to{ transform:translateX(-50%);} }

/* ---------- OAB TAG ---------- */
.oab-tag{ font-size:10px; letter-spacing:.12em; text-transform:uppercase; opacity:.50; font-family:var(--mono); display:inline-block; margin-left:8px;}
.oab-tag.below{ display:block; margin-left:0; margin-top:3px;}

/* ---------- IMG WRAPPER ---------- */
.img-wrapper{ overflow:hidden; border-radius:2px; position:relative;}
.img-wrapper img{ width:100%; height:100%; object-fit:cover; transition:transform 2.5s cubic-bezier(.25,.46,.45,.94);}
.img-wrapper:hover img{ transform:scale(1.04);}

/* ---------- SCROLL BLUR ---------- */
.scroll-blur{ transition:filter .4s ease, opacity .4s ease; will-change:filter, opacity;}
.scroll-blur-light{ transition:filter .5s ease, opacity .5s ease; will-change:filter, opacity;}

/* ---------- BIO CREDENTIALS ---------- */
.bio-credentials{ display:grid; grid-template-columns:repeat(4,1fr); gap:32px; margin-top:48px; border-top:1px solid var(--line); padding-top:40px;}
.cred-number{ font-family:var(--serif); font-size:clamp(22px,3vw,34px); display:block; margin-bottom:6px;}
.cred-label{ font-size:10px; letter-spacing:.12em; text-transform:uppercase; opacity:.45;}
@media (max-width:768px){ .bio-credentials{ grid-template-columns:repeat(2,1fr); gap:24px;} }

/* ---------- SERVICE LIST (areas) ---------- */
.service-list{ list-style:none; padding:0; margin:20px 0; display:flex; flex-direction:column; gap:8px;}
.service-list li{ font-size:13px; opacity:.65; padding-left:14px; border-left:1px solid var(--line); line-height:1.5;}
.area-card.dark .service-list li{ color:rgba(240,236,227,.70); border-left-color:rgba(139,115,85,.35);}
.area-positioning{ font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); margin-top:20px; opacity:.85;}
.area-sub{ font-size:14px; font-style:italic; opacity:.70; margin:14px 0 18px; line-height:1.55;}

/* ---------- CASE FORM ---------- */
.case-section{ padding:120px var(--pad) 140px; border-top:1px solid var(--line);}
.case-section__inner{ display:grid; grid-template-columns:1fr 1.4fr; gap:80px; align-items:start; max-width:var(--maxw); margin:0 auto;}
.case-section__header{ position:sticky; top:120px;}
.case-title{ font-family:var(--serif); font-size:clamp(36px,5.5vw,68px); line-height:1.05; margin:24px 0 20px; font-weight:500;}
.case-title em{ color:var(--accent); font-style:italic;}
.case-subtitle{ font-size:15px; line-height:1.65; opacity:.65; margin-bottom:28px;}
.case-guarantee{ display:flex; flex-direction:column; gap:8px;}
.case-guarantee span{ font-family:var(--mono); font-size:11px; letter-spacing:.08em; opacity:.50; text-transform:uppercase;}
.case-form{ display:flex; flex-direction:column; gap:22px;}
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.form-group label{ display:block; font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; opacity:.65; margin-bottom:8px;}
.form-group input[type=text], .form-group select, .form-group textarea{
  width:100%; background:transparent; border:none; border-bottom:1px solid var(--line); color:var(--ink); padding:12px 0; font-size:15px; font-family:inherit; outline:none; transition:border-color .25s ease;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus{ border-bottom-color:var(--accent);}
.form-group textarea{ resize:vertical; line-height:1.55;}
.urgency-options{ display:flex; gap:10px; flex-wrap:wrap; margin-top:6px;}
.urgency-option{ display:inline-flex; align-items:center; cursor:pointer; padding:8px 16px; border:1px solid var(--line); border-radius:2px; font-size:12px; letter-spacing:.05em; transition:all .2s ease;}
.urgency-option input[type="radio"]{ position:absolute; opacity:0; width:0; height:0;}
.urgency-option:has(input:focus-visible){ outline:2px solid var(--accent); outline-offset:2px;}
.urgency-option:hover{ border-color:var(--accent);}
.urgency-option:has(input:checked){ background:var(--ink); color:var(--bg); border-color:var(--ink);}
.char-count{ display:block; font-family:var(--mono); font-size:10px; opacity:.40; margin-top:6px; text-align:right;}
.checkbox-label{ display:flex; gap:12px; align-items:flex-start; cursor:pointer; font-size:13px; opacity:.75; line-height:1.55;}
.checkbox-label input{ margin-top:3px; flex-shrink:0;}
.case-submit{ background:var(--ink); color:var(--bg); border:none; padding:18px 32px; font-family:inherit; font-size:13px; letter-spacing:.12em; text-transform:uppercase; cursor:pointer; transition:opacity .2s ease; align-self:flex-start; margin-top:8px;}
.case-submit:hover{ opacity:.85;}
.form-success{ padding:24px; border:1px solid var(--accent); background:rgba(139,115,85,.08); font-size:14px; line-height:1.6;}
@media (max-width:900px){
  .case-section__inner{ grid-template-columns:1fr; gap:48px;}
  .case-section__header{ position:static;}
  .form-row{ grid-template-columns:1fr;}
  .case-section{ padding:80px 24px 100px;}
}

/* ---------- FOOTER ---------- */
footer{ padding:80px var(--pad) 32px; border-top:1px solid var(--line);}
.foot-grid{ display:grid; grid-template-columns: 2.4fr 1fr 1fr 1fr; gap:clamp(24px, 4vw, 64px); margin-bottom:80px;}
.foot-grid .h-eyebrow{ font-size:10.5px; margin-bottom:18px;}
.foot-grid a, .foot-grid p{ display:block; font-size:14px; line-height:1.9; color:var(--ink-2);}
.foot-bottom{ display:flex; justify-content:space-between; align-items:center; padding-top:28px; border-top:1px solid var(--line-2); flex-wrap:wrap; gap:16px;}
.foot-bottom .num{ font-size:10.5px;}
.bigfoot{ font-family:var(--serif); font-size: clamp(64px, 14vw, 240px); line-height:.9; letter-spacing:-.03em; margin: 0 0 60px; }
.bigfoot .sec{ font-style:italic; color:var(--accent); display:block;}
@media (max-width:900px){ .foot-grid{ grid-template-columns:1fr 1fr; gap:36px;} }


/* CASE CARD FLUTUANTE */
.case-section{ background:transparent; border-top:none !important; padding:120px var(--pad) 60px;}
.case-card-shell{
  max-width: calc(var(--maxw) + 80px); margin: 0 auto;
  background: var(--bg);
  border: 1px solid var(--line-2);
  border-radius: 20px;
  padding: 80px 64px;
  box-shadow: 0 40px 100px -20px rgba(60,40,20,.18), 0 8px 24px rgba(60,40,20,.06);
  position: relative;
  isolation: isolate;
}
html[data-mode="dark"] .case-card-shell{
  background: var(--bg-2);
  box-shadow: 0 40px 100px -20px rgba(0,0,0,.35), 0 8px 24px rgba(0,0,0,.18);
}
.case-card-shell::before{
  content:""; position:absolute; inset:0; border-radius:20px;
  background: linear-gradient(180deg, rgba(255,255,255,.6), rgba(246,244,239,.4));
  z-index:-1;
}
@media (max-width:900px){ .case-card-shell{ padding:48px 24px; border-radius:14px;} }

/* CTA VAMOS CONVERSAR — verde profundo */
.cta-conversa-shell{
  max-width: calc(var(--maxw) + 80px); margin: 80px auto 120px;
  background: linear-gradient(135deg, #1a2e25 0%, #243d31 100%);
  color: #f0ece3;
  border-radius: 20px;
  padding: 80px 64px;
  box-shadow: 0 40px 100px -20px rgba(20,40,30,.35);
  position: relative; overflow: hidden;
}
.cta-conversa-shell::before{
  content:""; position:absolute; inset:0;
  background: radial-gradient(800px circle at 90% 20%, rgba(184,148,102,.18), transparent 50%);
  pointer-events:none;
}
.cta-conversa-shell .grid-12{ gap: 32px; margin: 0; position:relative;}
.cta-conversa-shell .h-eyebrow{ color: rgba(240,236,227,.55);}
.cta-conversa-shell .h-display{ color: #f0ece3;}
.cta-conversa-shell .h-display em{ color: #d4b88c !important;}
.cta-conversa-shell .body-m{ color: rgba(240,236,227,.78);}
.cta-conversa-shell .btn-line{ background: #d4b88c; color: #1a2e25; border-color: #d4b88c;}
.cta-conversa-shell .btn-line:hover{ background: #f0ece3; border-color: #f0ece3; color: #1a2e25;}
@media (max-width:900px){ .cta-conversa-shell{ padding:48px 24px; border-radius:14px; margin:48px 16px 80px;} }

/* FOOTER ESTÁTICO MARCA */
.footer-brand{
  background: #1a1410;
  color: #d4c5a8;
  padding: 90px var(--pad) 36px;
  border-top: none !important;
}
.footer-brand .foot-grid .h-eyebrow{ color: #8b7355; opacity: 1;}
.footer-brand .foot-grid a, .footer-brand .foot-grid p{ color: #d4c5a8; opacity: .85; transition: color .25s, opacity .25s;}
.footer-brand .foot-grid a:hover{ color: #f0ece3; opacity:1;}
.footer-brand .foot-grid a.ul{ color:#d4b88c;}
.footer-brand .bigfoot{ color:#f0ece3; margin-bottom:50px;}
.footer-brand .bigfoot .sec{ color:#d4b88c;}
.footer-brand .foot-bottom{ border-top-color: rgba(212,197,168,.18); color: #8b7355;}
.footer-brand .foot-bottom .num{ color:#8b7355;}


/* ---------- RESPONSIVE MOBILE ---------- */
@media (max-width: 900px){
  :root{ --pad: 20px; }
  .grid-12{ grid-template-columns: 1fr !important; gap: 24px !important;}
  .grid-12 > *{ grid-column: span 1 !important;}
  .cols-3, .cols-2{ grid-template-columns: 1fr !important; gap: 18px !important;}
  .strip{ grid-template-columns: 1fr !important;}
  .h-display{ font-size: clamp(36px, 9vw, 56px) !important;}
  .case-title, .bigfoot{ font-size: clamp(40px, 12vw, 80px) !important;}
  .bigfoot{ margin-bottom: 32px;}
  .bigfoot span{ font-size: inherit !important;}
  .section{ padding: 60px var(--pad);}
  .area-card{ min-height: auto !important; padding: 28px 22px !important;}
  .area-card[data-area]{ width: auto !important; height: auto !important; margin: 0 !important;}
  .area-card.dark[href="#/penal"]{ grid-template-columns: 1fr !important; padding: 32px 22px !important; gap: 24px !important;}
  .case-section{ padding: 60px 16px 30px !important;}
  .case-card-shell{ padding: 36px 20px !important; border-radius: 14px;}
  .cta-conversa-shell{ margin: 48px 16px 60px !important; padding: 48px 24px !important;}
  .footer-brand{ padding: 60px 20px 28px !important;}
  .foot-grid{ grid-template-columns: 1fr 1fr !important; gap: 28px !important; margin-bottom: 48px !important;}
  .foot-bottom{ flex-direction: column; align-items: flex-start; gap: 8px;}
  header.nav, .nav{ padding: 16px 20px !important;}
  .menu-overlay .menu-grid{ grid-template-columns: 1fr !important;}
  .case-section__inner{ grid-template-columns: 1fr !important; gap: 36px !important;}
  .case-section__header{ position: static !important;}
  .form-row{ grid-template-columns: 1fr !important;}
  .hero-grid{ grid-template-columns: 1fr !important;}
  .hero-img-wrap, .hero-image{ aspect-ratio: 3/4;}
  .login-shell, .dashboard-shell{ padding: 24px 16px !important;}
  table{ font-size: 12px;}
  .num{ font-size: 10px;}
}
@media (max-width: 600px){
  :root{ --pad: 16px;}
  body{ font-size: 15px;}
  .h-display{ font-size: clamp(32px, 10vw, 48px) !important; line-height: 1.05;}
  .area-card h3{ font-size: 24px !important;}
  .btn-line, .btn-ghost{ font-size: 12px; padding: 12px 18px;}
  .admin-toggle{ font-size: 11px; padding: 8px 14px;}
}

/* ---------- ADMIN PANEL ---------- */
.admin{ position:fixed; right:18px; top:18px; bottom:18px; width:380px; z-index:400; background:var(--bg); border:1px solid var(--ink); box-shadow:0 30px 60px rgba(0,0,0,.18); display:none; flex-direction:column;}
.admin.open{ display:flex; animation: ain .5s ease;}
@keyframes ain{ from{ opacity:0; transform:translateX(40px);} to{ opacity:1; transform:translateX(0);} }
.admin-head{ display:flex; justify-content:space-between; align-items:center; padding:18px 20px; border-bottom:1px solid var(--line);}
.admin-tabs{ display:flex; border-bottom:1px solid var(--line); overflow-x:auto; scrollbar-width:none;}
.admin-tabs::-webkit-scrollbar{ display:none;}
.admin-tabs button{ flex:0 0 auto; padding:12px 10px; font-family:var(--mono); font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; border-bottom:2px solid transparent; color:var(--muted); white-space:nowrap;}
.admin-tabs button.active{ color:var(--ink); border-bottom-color:var(--ink);}
.admin-body{ overflow-y:auto; padding:18px 20px; flex:1; display:flex; flex-direction:column; gap:18px;}
.admin .field input, .admin .field textarea{ font-family:var(--sans); font-size:14px; padding:8px 0;}
.admin .group{ border:1px solid var(--line); padding:14px; display:flex; flex-direction:column; gap:12px;}
.admin .group h6{ font-family:var(--mono); font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted);}
.admin-img-drop{ border:1px dashed var(--line); padding:12px; text-align:center; cursor:pointer; display:flex; gap:10px; align-items:center;}
.admin-img-drop .pv{ width:54px; height:54px; background:var(--bg-3); flex-shrink:0; background-size:cover; background-position:center;}
.admin-img-drop:hover{ border-color:var(--ink);}
.admin-toggle{
  position:fixed; right:22px; bottom:80px; z-index:399;
  background:var(--ink); color:var(--bg); padding:14px 18px;
  font-family:var(--mono); font-size:10.5px; letter-spacing:.2em; text-transform:uppercase;
  border-radius:999px; display:none; align-items:center; gap:10px;
}
.admin-toggle.show{ display:inline-flex;}
.live-badge{ position:fixed; left:22px; bottom:80px; z-index:398; background:var(--ink); color:var(--bg); padding:10px 14px; font-family:var(--mono); font-size:10px; letter-spacing:.18em; text-transform:uppercase; border-radius:999px; display:none; align-items:center; gap:8px;}
.live-badge.show{ display:inline-flex;}
.live-badge .pulse{ width:7px; height:7px; border-radius:50%; background:var(--hi); animation:pulse 1.4s infinite;}
@keyframes pulse{ 0%,100%{ opacity:1;} 50%{ opacity:.4;} }
@media (max-width:760px){
  .admin{ left:8px; right:8px; top:8px; bottom:8px; width:auto;}
  /* admin CRUD tables stack on narrow screens */
  .adm-table{ font-size:12px;}
  .adm-table th:nth-child(n+3),.adm-table td:nth-child(n+3){ display:none;}
  .adm-edit-form{ display:flex; flex-direction:column; gap:8px;}
  .adm-edit-form input,.adm-edit-form select,.adm-edit-form textarea{ font-size:13px;}
}

/* ---------- TWEAKS ---------- */
[contenteditable="true"]:focus{ outline:1px dashed var(--accent); outline-offset:6px;}
.editing-on [data-edit]{ outline:1px dashed var(--line); outline-offset:6px; cursor:text;}
.editing-on [data-edit]:hover{ outline-color:var(--accent);}

/* dark/light per-section override (criminal sempre dark) */
.section.always-dark{
  background:#0E0C0A; color:#EDE7DA;
}
.section.always-dark .h-eyebrow{ color:#8A8275;}
.section.always-dark .body-m{ color:#D9D2C0;}
.section.always-dark .num{ color:#B89466;}

/* responsive grids */
.cols-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:32px;}
.cols-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.cols-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
@media (max-width:1024px){ .cols-3{ grid-template-columns:repeat(2,1fr);} .cols-4{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){ .cols-2,.cols-3,.cols-4{ grid-template-columns:1fr;} }

/* TOC */
.toc{ position:fixed; right:var(--pad); top:50%; transform:translateY(-50%); z-index:80; display:flex; flex-direction:column; gap:8px;}
.toc a{ width:24px; height:1px; background:var(--ink); opacity:.25; transition: opacity var(--t-fast), width var(--t-fast);}
.toc a.active{ opacity:1; width:34px;}
@media (max-width:1100px){ .toc{ display:none;} }

/* Content widths */
.content-narrow{ max-width:900px; margin:auto;}
.content-reading{ max-width:760px; margin:auto;}

/* Curtain refined: blur + opacity layered */
.curtain{ backdrop-filter: blur(0px); transition: clip-path .9s cubic-bezier(.7,0,.2,1), backdrop-filter .9s ease;}
.curtain.show{ backdrop-filter: blur(8px);}

/* hover image expand */
.hover-img{ overflow:hidden;}
.hover-img img{ transition: transform 1.6s cubic-bezier(.7,0,.2,1);}
.hover-img:hover img{ transform:scale(1.05);}

/* underline link */
.ul{ position:relative; display:inline-block;}
.ul::after{ content:""; position:absolute; left:0; right:0; bottom:-3px; height:1px; background:currentColor; transform-origin:right; transform:scaleX(1); transition: transform .6s cubic-bezier(.7,0,.2,1);}
.ul:hover::after{ transform-origin:left; transform:scaleX(0);}

/* blockquote */
.bq{ font-family:var(--serif); font-size: clamp(24px, 2.6vw, 38px); line-height:1.3; letter-spacing:-.01em; max-width:880px;}
.bq::before{ content:"“"; font-size:1.4em; color:var(--accent); margin-right:8px;}

/* table-of-contents look list */
.list-numbered{ list-style:none;}
.list-numbered li{ display:grid; grid-template-columns:54px 1fr; gap:12px; padding:14px 0; border-bottom:1px solid var(--line-2); align-items:baseline;}
.list-numbered li .n{ font-family:var(--mono); font-size:11px; color:var(--muted);}
.list-numbered li .v{ font-family:var(--serif); font-size:18px; line-height:1.4;}

/* contact area */
.contact-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:120px;}
.contact-grid .body-l{ font-size:18px;}
@media (max-width:900px){ .contact-grid{ grid-template-columns:1fr; gap:56px;} }

/* photo strip */
.strip{ display:grid; grid-template-columns: 1.2fr 1fr 1.4fr; gap:18px; height:60vh;}
@media (max-width:800px){ .strip{ grid-template-columns:1fr; height:auto;} .strip > *{ aspect-ratio:4/5;} }

/* ---------- HERO IMAGE FILTER ---------- */
.hero-img-slot img{ filter:grayscale(8%) contrast(1.05);}

/* ---------- SKIP LINK ---------- */
.skip-link{
  position:fixed; top:-100%; left:50%; transform:translateX(-50%);
  z-index:10001; background:var(--ink); color:var(--bg);
  padding:12px 24px; font-family:var(--mono); font-size:12px;
  letter-spacing:.16em; text-transform:uppercase; transition:top .25s ease;
  white-space:nowrap;
}
.skip-link:focus{ top:8px;}

/* ---------- FOCUS VISIBLE ---------- */
:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:4px;
}
/* Remove custom outline on elements that have their own focus style */
.field input:focus-visible,
.field textarea:focus-visible,
.field select:focus-visible,
.form-group input:focus-visible,
.form-group select:focus-visible,
.form-group textarea:focus-visible{
  outline:none;
  border-bottom-color:var(--ink);
}

/* ---------- AREA CARD -- PENAL FEATURE ---------- */
.area-card--feature{
  margin-top:24px; padding:48px;
  display:grid; grid-template-columns:1.2fr 1.4fr;
  gap:48px; align-items:start;
}
@media (max-width:900px){
  .area-card--feature{ grid-template-columns:1fr !important; padding:32px 22px; gap:28px;}
}
.penal-card-title{ font-size:clamp(28px, 3.5vw, 52px) !important;}
.penal-card-sub{ font-size:15px !important;}
.penal-card-chip{ margin-top:24px; width:max-content; background:rgba(184,148,102,.12); border-color:rgba(184,148,102,.35); color:#B89466;}
.penal-card-dot{ background:#B89466;}
.penal-card-body{ color:rgba(240,236,227,.75) !important;}
.penal-card-positioning{ color:#B89466; margin-top:30px;}

/* ---------- HOME CTA TITLE ---------- */
.home-cta-title{ font-size:clamp(48px, 7.5vw, 100px); margin-top:24px;}

/* ---------- DEMO NOTICE ---------- */
.demo-notice{
  display:flex; align-items:center; gap:10px;
  padding:12px 18px; margin-bottom:28px;
  background:var(--bg-2); border:1px solid var(--line);
  font-family:var(--mono); font-size:11px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted); border-radius:2px;
}
.demo-notice--compact{ margin-bottom:0; padding:8px 12px; font-size:10px;}
.demo-notice .demo-dot{ width:6px; height:6px; border-radius:50%; background:var(--accent); flex-shrink:0;}

/* ---------- LOGIN ERROR ---------- */
.login-error{ color:var(--ink-2) !important; font-size:12px;}

/* ---------- FORM GROUP LEGEND ---------- */
.form-group-legend{ font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; opacity:.65; margin-bottom:8px; display:block; font-weight:normal;}

/* ---------- BTN PENAL (dark bg context) ---------- */
.btn-penal{ border-color:#B89466; color:#B89466; background:transparent;}
.btn-penal:hover{ background:#B89466; color:#0E0C0A; border-color:#B89466;}

/* ---------- PREFERS REDUCED MOTION ---------- */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
    scroll-behavior:auto !important;
  }
  .marquee .track{ animation:none;}
  .rv{ opacity:1; transform:none; transition:none;}
  .curtain{ display:none;}
  .hero-headline .line > span{ transform:none; transition:none;}
  .hero-sub{ opacity:1; transform:none; transition:none;}
  .hero-img{ clip-path:inset(0 0 0 0); transition:none;}
  .preloader .pl-mark span{ opacity:1; transform:none; animation:none;}
  .preloader .pl-bar::after{ animation:none; transform:scaleX(1);}
}

/* ======================================================= 
   PRINT — CV
   Triggered by window.print() on the CV page.
   Hides chrome, forces light mode, clean layout.
   ======================================================= */


@media (max-width:480px){
  .dash-side .brand{ display:none;}
  .dash-nav a{ padding:9px 10px; font-size:12px;}
  .proc-row{ grid-template-columns: 1fr 80px;}
  .proc-row > *:nth-child(n+3){ display:none;}
  .dash-stat{ flex-direction:row; align-items:center; justify-content:space-between;}
  .dash-stat .v{ font-size:28px;}
}

/* ============= TOAST NOTIFICATIONS ============= */
#toast-stack{ position:fixed; bottom:24px; right:24px; z-index:900; display:flex; flex-direction:column; gap:8px; pointer-events:none;}
.toast{ display:flex; align-items:center; gap:10px; padding:12px 18px; background:var(--ink); color:var(--bg); font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; border-radius:2px; opacity:0; transform:translateX(20px); transition:opacity .3s ease,transform .3s ease; pointer-events:auto; max-width:320px;}
.toast.in{ opacity:1; transform:translateX(0);}
.toast-dot{ width:6px; height:6px; border-radius:50%; flex-shrink:0;}
.toast--success .toast-dot{ background:#5A7B4F;}
.toast--error .toast-dot{ background:#B04A4A;}
.toast--warning .toast-dot{ background:#B89466;}
.toast--info .toast-dot{ background:var(--muted);}
@media (max-width:600px){ #toast-stack{ bottom:16px; right:16px; left:16px;} .toast{ max-width:100%;} }

/* ============= SITE ALERT BANNER ============= */
.site-alert{ width:100%; padding:10px var(--pad); font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; display:flex; align-items:center; justify-content:center;}
.site-alert-inner{ display:flex; align-items:center; gap:12px; max-width:var(--max);}
.site-alert-text{ flex:1;}
.site-alert-icon{ font-size:14px; flex-shrink:0;}
.site-alert-close{ background:none; border:none; font-size:16px; cursor:pointer; opacity:.6; padding:0 4px; line-height:1; color:inherit;}
.site-alert-close:hover{ opacity:1;}
.site-alert--info{ background:var(--bg-2); color:var(--ink); border-bottom:1px solid var(--line);}
.site-alert--aviso{ background:#B89466; color:#0E0C0A;}
.site-alert--urgente{ background:#B04A4A; color:#F5F0E8;}

@media print {
  /* — Reset to clean white sheet — */
  :root {
    --bg: #FFFFFF;
    --ink: #0E0C0A;
    --ink-muted: #3B3A35;
    --accent: #8A6C3C;
    --line: rgba(0,0,0,.12);
  }

  body { background:#FFF; color:#0E0C0A; }

  /* — Hide all chrome — */
  header,
  .skip-link,
  .fs-menu,
  .admin-toggle,
  .admin,
  .live-badge,
  .preloader,
  footer,
  .divide,
  .curtain,
  .marquee { display:none !important; }

  /* — Hide every view except CV — */
  .view { display:none !important; }
  .view[data-view="cv"] { display:block !important; }

  /* — Hide CV action buttons — */
  #v-cv .rv.delay-2 { display:none !important; }

  /* — Remove reveal animations — */
  .rv { opacity:1 !important; transform:none !important; }

  /* — Typography adjustments — */
  .h-display { font-size:42pt !important; line-height:1 !important; }
  .h-eyebrow { font-size:8pt; letter-spacing:.12em; }
  .body-m, .body-l { font-size:10pt; line-height:1.6; }
  .body-s { font-size:9pt; }

  /* — Layout — */
  .wrap { max-width:100%; padding:0 18mm; }
  .section { padding:18pt 0 !important; }
  .section.tight { padding:12pt 0 !important; }
  .grid-12 { display:grid; grid-template-columns:repeat(12,1fr); gap:14pt; }
  .cols-2 { display:grid; grid-template-columns:1fr 1fr; gap:12pt; }

  /* — Avoid page breaks inside cards — */
  .cv-entry,
  .area-card,
  .cols-2 > * { break-inside:avoid; }

  /* — Ensure page breaks on main sections — */
  .section { break-after:auto; }

  /* — Print margin — */
  @page { margin:20mm 18mm; }
}

/* ============================================================
   MODELOS & DOCUMENTOS — Public page
   ============================================================ */

/* filter bar */
.modelos-filters{ display:flex; flex-direction:column; gap:12px; margin-bottom:36px; padding-bottom:24px; border-bottom:1px solid var(--line);}
.modelos-filter-group{ display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.modelos-filter-label{ font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); min-width:40px;}
.modelos-chip{ padding:6px 14px; border:1px solid var(--line); background:transparent; color:var(--ink); font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; cursor:pointer; transition:background .2s, color .2s, border-color .2s; border-radius:2px;}
.modelos-chip:hover{ border-color:var(--ink);}
.modelos-chip.active{ background:var(--ink); color:var(--bg); border-color:var(--ink);}

/* cards grid */
.modelos-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-bottom:40px;}
@media (max-width:1024px){ .modelos-grid{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){ .modelos-grid{ grid-template-columns:1fr;} }

.modelo-card{ border:1px solid var(--line); padding:28px 24px; display:flex; flex-direction:column; gap:10px; transition:border-color .25s, box-shadow .25s; position:relative;}
.modelo-card:hover{ border-color:var(--ink); box-shadow:0 8px 28px rgba(0,0,0,.07);}
.modelo-card--locked{ opacity:.65;}
.modelo-card--locked:hover{ border-color:var(--line); box-shadow:none;}

.modelo-card-top{ display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.modelo-tag{ font-family:var(--mono); font-size:9px; letter-spacing:.16em; text-transform:uppercase; padding:3px 8px; border:1px solid var(--line); color:var(--muted);}
.modelo-tag--copy{ border-color:var(--accent); color:var(--accent);}
.modelo-lock{ font-size:13px;}
.modelo-area{ font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted);}
.modelo-title{ font-family:var(--serif); font-size:18px; line-height:1.3; color:var(--ink);}
.modelo-desc{ font-size:13px; line-height:1.6; color:var(--ink); opacity:.7; flex:1;}
.modelo-foot{ display:flex; gap:10px; flex-wrap:wrap; margin-top:4px;}
.modelo-btn{ padding:10px 16px; font-size:11px !important;}
.modelo-date{ font-family:var(--mono); font-size:9px; color:var(--muted); letter-spacing:.1em; text-transform:uppercase; margin-top:4px;}

/* login notice */
.modelos-login-notice{ display:flex; align-items:center; gap:6px; font-family:var(--mono); font-size:11px; letter-spacing:.1em; color:var(--muted); padding:16px 0; border-top:1px solid var(--line);}

/* ============================================================
   DOC MODAL — Visualizador / Editor
   ============================================================ */

#doc-modal{ position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center;}
#doc-modal[hidden]{ display:none;}
.doc-modal-backdrop{ position:absolute; inset:0; background:rgba(14,12,10,.55); backdrop-filter:blur(4px);}

.doc-modal-inner{ position:relative; z-index:1; background:var(--bg); border:1px solid var(--ink); width:min(780px, 95vw); max-height:92vh; display:flex; flex-direction:column; box-shadow:0 40px 80px rgba(0,0,0,.25);}

.doc-modal-head{ display:flex; justify-content:space-between; align-items:flex-start; padding:20px 24px 16px; border-bottom:1px solid var(--line);}
.doc-modal-title{ font-family:var(--serif); font-size:20px; margin-top:4px; color:var(--ink);}
.doc-modal-close{ background:none; border:none; font-size:22px; cursor:pointer; color:var(--ink); opacity:.5; padding:0 4px; line-height:1; transition:opacity .2s; flex-shrink:0;}
.doc-modal-close:hover{ opacity:1;}

.doc-modal-tabs{ display:flex; border-bottom:1px solid var(--line); padding:0 24px;}
.doc-tab{ padding:12px 14px; font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; background:none; border:none; border-bottom:2px solid transparent; color:var(--muted); cursor:pointer; transition:color .2s, border-color .2s;}
.doc-tab:hover{ color:var(--ink);}
.doc-tab.active{ color:var(--ink); border-bottom-color:var(--ink);}

.doc-modal-body{ flex:1; overflow:hidden; padding:0;}
.doc-editor{ width:100%; height:100%; min-height:340px; max-height:50vh; border:none; background:var(--bg); color:var(--ink); font-family:var(--mono); font-size:12.5px; line-height:1.7; padding:20px 24px; resize:none; outline:none; display:block; box-sizing:border-box; overflow-y:auto;}
.doc-editor--edit{ background:var(--bg-2);}
.doc-editor[readonly]{ cursor:default; color:var(--ink);}

.doc-modal-foot{ padding:16px 24px; border-top:1px solid var(--line); display:flex; gap:12px; flex-wrap:wrap; align-items:center;}
.doc-modal-foot .btn-line,
.doc-modal-foot .btn-ghost{ padding:10px 16px; font-size:11px;}

@media (max-width:600px){
  .doc-modal-inner{ width:100%; max-height:100dvh; border-left:none; border-right:none; border-radius:0;}
  .doc-modal-head{ padding:16px 16px 12px;}
  .doc-editor{ padding:16px; font-size:12px;}
  .doc-modal-foot{ padding:12px 16px;}
}

/* ============================================================
   NAV — Modelos link (footer + FS menu)
   ============================================================ */