/* ============================================================
   APOSTOLADO DA NOBRE ORDEM DOS CAVALEIROS DE SANTA CRUZ
   Design system — Século XIX Imperial Brasileiro
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,600&family=EB+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Cormorant+SC:wght@400;500;600;700&family=Roboto:ital,wght@0,300;0,400;0,500;0,700;1,400&display=swap');

:root{
  /* ---- Heráldica / paleta ---- */
  --blue:        #232058;   /* azul imperial (brasão) */
  --blue-deep:   #181541;
  --blue-ink:    #12102f;
  --red:         #9c1c1a;   /* vermelho heráldico / carmesim */
  --red-bright:  #c1272d;   /* cruz de Jerusalém */
  --red-deep:    #7d1614;
  --gold:        #b08a2e;   /* ouro nobre */
  --gold-light:  #cba85b;
  --gold-bright: #e0c270;
  --gold-pale:   #e9dcb4;
  --green:       #1f5c39;   /* verde heráldico (paquife) */

  --ivory:       #f6f0e1;   /* marfim de fundo */
  --paper:       #fbf7ec;   /* cartão / superfície */
  --paper-warm:  #f1e9d6;
  --ink:         #2a2521;   /* texto */
  --ink-soft:    #5d544a;
  --ink-faint:   #8a8070;
  --line:        #ddd2ba;

  /* ---- Tipografia ---- */
  --display: 'Playfair Display', Georgia, serif;
  --serif:   'EB Garamond', Georgia, serif;
  --cormo:   'Cormorant Garamond', Georgia, serif;
  --smallcaps: 'Cormorant SC', 'Playfair Display', serif;
  --sans:    'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --maxw: 1240px;
  --gutter: clamp(20px, 5vw, 64px);
  --radius: 3px;

  --shadow-sm: 0 1px 3px rgba(24,21,65,.08), 0 1px 2px rgba(24,21,65,.06);
  --shadow-md: 0 6px 22px -8px rgba(24,21,65,.28);
  --shadow-lg: 0 24px 60px -22px rgba(24,21,65,.42);

  --ease: cubic-bezier(.2,.7,.2,1);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0;
  font-family:var(--sans);
  font-size:18px;
  line-height:1.62;
  font-weight:400;
  color:var(--ink);
  background-color:var(--ivory);
  background-image:
    radial-gradient(circle at 18% 12%, rgba(176,138,46,.05), transparent 42%),
    radial-gradient(circle at 84% 78%, rgba(35,32,88,.045), transparent 46%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block;}
a{color:inherit;}
button{font-family:inherit;cursor:pointer;}
::selection{background:var(--gold-light);color:var(--blue-ink);}

:focus-visible{outline:2.5px solid var(--gold);outline-offset:3px;border-radius:2px;}

/* ============ Tipografia ============ */
h1,h2,h3,h4{font-family:var(--display);font-weight:700;line-height:1.08;color:var(--ink);margin:0;letter-spacing:-.01em;}
p{margin:0 0 1em;text-wrap:pretty;}
.eyebrow{
  font-family:var(--smallcaps);
  font-weight:600;
  letter-spacing:.26em;
  text-transform:uppercase;
  font-size:.84rem;
  color:var(--red);
  margin:0 0 .9rem;
  display:inline-flex;align-items:center;gap:.7em;
}
.eyebrow--gold{color:var(--gold);}
.eyebrow--light{color:var(--gold-bright);}
.eyebrow::before,.eyebrow::after{
  content:"";height:1px;width:26px;background:currentColor;opacity:.55;
}
.eyebrow.no-rule::before,.eyebrow.no-rule::after{display:none;}

.lead{font-family:var(--serif);font-size:1.32rem;color:var(--ink-soft);font-weight:400;}
.sec-head p,.page-hero p{font-family:var(--serif);}
.script{font-family:var(--cormo);font-style:italic;}

/* ============ Layout ============ */
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter);}
.wrap--narrow{max-width:820px;}
.wrap--wide{max-width:1400px;}
section{position:relative;}
.section-pad{padding-block:clamp(64px,8vw,118px);}

/* ============ Ornamentos ============ */
.filet{height:2px;background:linear-gradient(90deg,transparent,var(--gold) 18%,var(--gold-light) 50%,var(--gold) 82%,transparent);border:0;}
.filet-thin{height:1px;background:var(--gold);opacity:.5;border:0;}

/* divisor com cruz/fleuron central */
.ornament{display:flex;align-items:center;justify-content:center;gap:1.1rem;color:var(--gold);margin-inline:auto;}
.ornament::before,.ornament::after{content:"";height:1px;width:min(120px,18vw);background:linear-gradient(90deg,transparent,var(--gold));}
.ornament::after{transform:scaleX(-1);}
.ornament .glyph{font-size:1.1rem;line-height:1;color:var(--gold);}
.ornament img{width:24px;height:24px;opacity:.92;filter:drop-shadow(0 1px 0 rgba(0,0,0,.06));}

.fleuron{color:var(--gold);font-size:1.4rem;line-height:1;}

/* Moldura heráldica — fina borda dupla dourada */
.frame{position:relative;}
.frame::after{
  content:"";position:absolute;inset:9px;border:1px solid var(--gold);opacity:.5;pointer-events:none;
}
.frame--card{border:1px solid var(--line);box-shadow:var(--shadow-sm);}

/* ============ Botões ============ */
.btn{
  --bg:var(--red);--fg:#fff;--bd:var(--red);
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  font-family:var(--smallcaps);font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  font-size:.94rem;line-height:1;
  padding:.92em 1.7em;
  color:var(--fg);background:var(--bg);border:1.5px solid var(--bd);
  border-radius:var(--radius);text-decoration:none;cursor:pointer;
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s,color .25s;
  box-shadow:var(--shadow-sm);position:relative;
}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
.btn:active{transform:translateY(0);}
.btn--gold{--bg:linear-gradient(180deg,var(--gold-light),var(--gold));--bd:var(--gold);--fg:var(--blue-ink);}
.btn--blue{--bg:var(--blue);--bd:var(--blue);--fg:#fff;}
.btn--ghost{--bg:transparent;--fg:var(--ink);--bd:var(--gold);}
.btn--ghost:hover{--bg:var(--paper-warm);}
.btn--ghost-light{--bg:transparent;--fg:#fff;--bd:var(--gold-light);}
.btn--ghost-light:hover{background:rgba(255,255,255,.08);}
.btn--lg{padding:1.08em 2.1em;font-size:1rem;}
.btn--sm{padding:.62em 1.1em;font-size:.82rem;}

/* link de texto ornamentado */
.tlink{
  font-family:var(--smallcaps);font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  font-size:.9rem;color:var(--red);text-decoration:none;display:inline-flex;align-items:center;gap:.5em;
  border-bottom:1px solid transparent;transition:gap .25s,border-color .25s;padding-bottom:2px;
}
.tlink:hover{gap:.85em;border-color:var(--gold);}
.tlink .arrow{transition:transform .25s var(--ease);}
.tlink:hover .arrow{transform:translateX(3px);}

/* ============ Chips / categorias ============ */
.chip{
  display:inline-flex;align-items:center;gap:.45em;
  font-family:var(--smallcaps);font-weight:600;letter-spacing:.16em;text-transform:uppercase;font-size:.72rem;
  color:var(--red);background:rgba(156,28,26,.07);
  padding:.42em .8em;border:1px solid rgba(156,28,26,.22);border-radius:2px;
}
.chip--blue{color:var(--blue);background:rgba(35,32,88,.07);border-color:rgba(35,32,88,.2);}
.chip--green{color:var(--green);background:rgba(31,92,57,.08);border-color:rgba(31,92,57,.22);}
.chip--gold{color:#7a5e15;background:rgba(176,138,46,.12);border-color:rgba(176,138,46,.35);}

/* ============ Utilidades ============ */
.center{text-align:center;}
.mt-0{margin-top:0;}
.muted{color:var(--ink-soft);}
.dropcap::first-letter{
  font-family:var(--display);font-weight:800;color:var(--red);
  float:left;font-size:4.6em;line-height:.74;padding:.06em .12em 0 0;margin-top:.04em;
}

/* reveal on scroll */
[data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
[data-reveal].in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1!important;transform:none!important;transition:none;}
  html{scroll-behavior:auto;}
}
