/*
Theme Name: Herbert Cabochard
Theme URI: https://example.com/
Author: Herbert Cabochard
Description: Tema WordPress autoral para o compositor Herbert Cabochard.
Version: 1.4.0
Text Domain: herbert-cabochard
*/

:root {
  --hc-black: #171716;
  --hc-red: #b62d24;
  --hc-cream: #f4ede4;
  --hc-paper: #fbf8f3;
  --hc-muted: #756f68;
  --hc-border: rgba(23,23,22,.14);
  --hc-max: 1180px;
  --hc-line: rgba(23,23,22,.08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--hc-paper);
  color: var(--hc-black);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
}
a { color: inherit; }
img { max-width: 100%; height: auto; }

.hc-page { overflow: hidden; }
.hc-container { width: min(var(--hc-max), calc(100% - 48px)); margin: 0 auto; }

.hc-header {
  position: absolute;
  inset: 0 0 auto;
  z-index: 20;
  padding: 26px 0;
}
.hc-header-inner { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.hc-mini-logo { width: 170px; display:block; }
.hc-nav { display:flex; gap:28px; font-size:13px; text-transform:uppercase; letter-spacing:.14em; font-weight:700; }
.hc-nav a { text-decoration:none; opacity:.82; transition:opacity .2s, color .2s; }
.hc-nav a:hover { opacity:1; color:var(--hc-red); }

.hc-hero {
  position:relative;
  isolation:isolate;
  min-height: 720px;
  display:grid;
  align-items:center;
  padding: 140px 0 90px;
  background:
    radial-gradient(circle at 85% 20%, rgba(182,45,36,.10), transparent 28%),
    linear-gradient(135deg, #f7f1e9 0%, #eee4d8 100%);
}
.hc-hero::before {
  content:"";
  position:absolute;
  z-index:-1;
  width:430px;
  height:430px;
  right:-120px;
  top:90px;
  border:1px solid rgba(23,23,22,.08);
  border-radius:50%;
  box-shadow:0 0 0 34px rgba(23,23,22,.025), 0 0 0 68px rgba(23,23,22,.018);
  pointer-events:none;
}
.hc-hero::after {
  content:"HC";
  position:absolute;
  z-index:-1;
  right:54px;
  bottom:68px;
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border:1px solid rgba(182,45,36,.35);
  border-radius:50%;
  color:rgba(182,45,36,.42);
  font-family:Georgia,serif;
  font-size:12px;
  letter-spacing:.08em;
  pointer-events:none;
}
.hc-hero-grid { display:grid; grid-template-columns: 1.1fr .9fr; gap:70px; align-items:center; }
.hc-kicker { margin:0 0 18px; color:var(--hc-red); text-transform:uppercase; letter-spacing:.2em; font-size:12px; font-weight:800; }
.hc-hero h1 {
  margin:0;
  max-width:700px;
  font-family: Georgia, "Times New Roman", serif;
  font-weight:400;
  font-size:clamp(48px, 7vw, 88px);
  line-height:.98;
  letter-spacing:-.045em;
}
.hc-hero h1 em { color:var(--hc-red); font-style:normal; }
.hc-hero-copy { max-width:600px; margin:28px 0 34px; font-size:18px; color:#4f4a45; }
.hc-actions { display:flex; flex-wrap:wrap; gap:12px; }
.hc-button { display:inline-flex; align-items:center; justify-content:center; min-height:50px; padding:0 22px; border:1px solid var(--hc-black); text-decoration:none; text-transform:uppercase; letter-spacing:.12em; font-size:12px; font-weight:800; transition:.2s; }
.hc-button-primary { background:var(--hc-black); color:#fff; }
.hc-button-primary:hover { background:var(--hc-red); border-color:var(--hc-red); }
.hc-button-light:hover { background:#fff; }

.hc-logo-card { display:flex; align-items:center; justify-content:center; }
.hc-logo-card img { width:min(100%, 520px); mix-blend-mode:multiply; }

.hc-section { position:relative; padding:110px 0; }
.hc-section:not(.hc-section-dark)::after {
  content:"•  )))  •";
  position:absolute;
  right:5%;
  top:48px;
  color:rgba(182,45,36,.18);
  font-size:15px;
  letter-spacing:.16em;
  transform:rotate(-8deg);
  pointer-events:none;
}
.hc-section-dark::before {
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
}
.hc-section-dark { background:var(--hc-black); color:#fff; }
.hc-section-head { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:38px; }
.hc-section-title { margin:0; font-family:Georgia, "Times New Roman", serif; font-size:clamp(38px,5vw,62px); line-height:1; font-weight:400; letter-spacing:-.035em; }
.hc-section-title span { color:var(--hc-red); }
.hc-section-head { position:relative; }
.hc-section-intro { max-width:520px; color:var(--hc-muted); margin:0; }
.hc-section-dark .hc-section-intro { color:#aaa49e; }

.hc-video-grid { display:grid; grid-template-columns:1fr .75fr; gap:50px; align-items:center; }
.hc-video-frame { position:relative; aspect-ratio:16/9; background:#000; box-shadow:0 20px 60px rgba(0,0,0,.2); }
.hc-video-frame::after {
  content:"";
  position:absolute;
  width:54px;
  height:54px;
  right:-12px;
  bottom:-12px;
  border:1px solid rgba(182,45,36,.65);
  border-radius:50%;
  pointer-events:none;
}
.hc-video-frame iframe { width:100%; height:100%; border:0; display:block; }
.hc-video-copy .hc-label { color:var(--hc-red); }
.hc-video-copy h3 { font-family:Georgia,serif; font-size:42px; line-height:1.05; font-weight:400; margin:10px 0 18px; }
.hc-video-copy p { color:#aaa49e; }
.hc-label { text-transform:uppercase; letter-spacing:.18em; font-size:11px; font-weight:800; }

.hc-pillars { position:relative; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--hc-border); border-bottom:1px solid var(--hc-border); }
.hc-pillar { padding:34px 28px 34px 0; border-right:1px solid var(--hc-border); }
.hc-pillar + .hc-pillar { padding-left:28px; }
.hc-pillar:last-child { border-right:0; }
.hc-pillar strong { display:block; position:relative; font-family:Georgia,serif; font-size:25px; font-weight:400; margin-bottom:8px; }
.hc-pillar strong::before { content:"•"; display:inline-block; margin-right:10px; color:var(--hc-red); font-family:Georgia,serif; font-size:.8em; transform:translateY(-2px); }
.hc-pillar p { margin:0; color:var(--hc-muted); font-size:15px; }

.hc-about { display:grid; grid-template-columns:.8fr 1.2fr; gap:80px; align-items:start; }
.hc-about-copy { font-size:18px; color:#4f4a45; }
.hc-about-copy p:first-child { margin-top:0; }
.hc-facts { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--hc-border); }
.hc-fact { background:var(--hc-paper); padding:30px; }
.hc-fact b { display:block; font-family:Georgia,serif; font-size:36px; font-weight:400; }
.hc-fact span { color:var(--hc-muted); font-size:13px; text-transform:uppercase; letter-spacing:.12em; }

.hc-music { position:relative; text-align:center; padding:90px 0; }
.hc-music::before, .hc-music::after { content:""; position:absolute; top:50%; width:42px; height:42px; border:1px solid rgba(182,45,36,.26); border-radius:50%; transform:translateY(-50%); }
.hc-music::before { left:8%; box-shadow:0 0 0 7px rgba(182,45,36,.035); }
.hc-music::after { right:8%; box-shadow:0 0 0 7px rgba(182,45,36,.035); }
.hc-music p { color:var(--hc-muted); max-width:600px; margin:16px auto 28px; }

.hc-section-mark { display:block; margin-bottom:12px; color:var(--hc-red); font-size:12px; line-height:1; }
.hc-section-cream { background:var(--hc-cream); }
.hc-feature-grid { display:grid; grid-template-columns:.78fr 1.22fr; gap:80px; align-items:center; }
.hc-feature-art { min-height:420px; padding:54px; display:flex; flex-direction:column; justify-content:space-between; position:relative; overflow:hidden; background:var(--hc-black); color:#fff; box-shadow:0 24px 70px rgba(23,23,22,.14); }
.hc-feature-art::before, .hc-feature-art::after { content:""; position:absolute; border:1px solid rgba(255,255,255,.13); border-radius:50%; pointer-events:none; }
.hc-feature-art::before { width:300px; height:300px; right:-120px; top:-100px; }
.hc-feature-art::after { width:180px; height:180px; left:-85px; bottom:-75px; border-color:rgba(182,45,36,.45); }
.hc-art-label { position:relative; z-index:1; color:var(--hc-red); font-size:11px; letter-spacing:.2em; font-weight:800; }
.hc-feature-art strong { position:relative; z-index:1; font-family:Georgia,serif; font-size:clamp(32px,4vw,52px); line-height:.94; font-weight:400; letter-spacing:-.035em; }
.hc-feature-art small { position:relative; z-index:1; color:#b8b1aa; letter-spacing:.14em; text-transform:uppercase; font-size:11px; }
.hc-feature-copy > p:not(.hc-note) { max-width:600px; font-size:19px; color:#4f4a45; }
.hc-feature-meta { display:flex; gap:42px; margin:32px 0; padding-top:24px; border-top:1px solid var(--hc-border); }
.hc-feature-meta span { color:var(--hc-muted); text-transform:uppercase; letter-spacing:.1em; font-size:11px; }
.hc-feature-meta b { display:block; color:var(--hc-black); font-family:Georgia,serif; font-size:28px; font-weight:400; letter-spacing:0; text-transform:none; margin-bottom:4px; }
.hc-note { color:#8b847d; font-size:12px; line-height:1.5; font-style:italic; }
.hc-theatre-section { background:var(--hc-paper); }
.hc-theatre-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:14px; }
.hc-play-card { grid-column:span 3; min-height:270px; padding:28px; background:#fff; border:1px solid var(--hc-border); display:flex; flex-direction:column; transition:transform .2s, box-shadow .2s; }
.hc-play-card:hover { transform:translateY(-4px); box-shadow:0 18px 40px rgba(23,23,22,.08); }
.hc-play-card-featured { grid-column:span 6; background:var(--hc-black); color:#fff; border-color:var(--hc-black); }
.hc-play-card > span { color:var(--hc-red); font-size:10px; text-transform:uppercase; letter-spacing:.16em; font-weight:800; }
.hc-play-card h3 { font-family:Georgia,serif; font-size:30px; line-height:1.05; font-weight:400; margin:34px 0 12px; }
.hc-play-card p { margin:0; color:#77716b; font-size:14px; }
.hc-play-card-featured p { color:#b3ada7; }
.hc-play-card small { margin-top:auto; color:#9a938d; font-size:11px; text-transform:uppercase; letter-spacing:.1em; }
.hc-theatre-note { margin:22px 0 0; }
.hc-footer { padding:34px 0; background:#111110; color:#aaa49e; font-size:12px; }
.hc-footer-inner { display:flex; justify-content:space-between; gap:20px; align-items:center; }
.hc-footer a { color:#fff; text-decoration:none; }
.hc-footer a:hover { color:var(--hc-red); }

@media (max-width: 900px) {
  .hc-hero-grid, .hc-video-grid, .hc-about { grid-template-columns:1fr; gap:40px; }
  .hc-hero { min-height:auto; }
  .hc-logo-card { order:-1; }
  .hc-logo-card img { max-width:440px; }
  .hc-pillars { grid-template-columns:1fr; }
  .hc-pillar, .hc-pillar + .hc-pillar { padding:28px 0; border-right:0; border-bottom:1px solid var(--hc-border); }
  .hc-pillar:last-child { border-bottom:0; }
}
@media (max-width: 640px) {
  .hc-hero::before { width:260px; height:260px; right:-100px; top:150px; }
  .hc-hero::after { right:20px; bottom:28px; }
  .hc-music::before, .hc-music::after { width:30px; height:30px; }
  .hc-container { width:min(var(--hc-max), calc(100% - 32px)); }
  .hc-header { position:relative; background:var(--hc-paper); }
  .hc-header-inner { flex-direction:column; align-items:flex-start; }
  .hc-nav { gap:16px; flex-wrap:wrap; }
  .hc-mini-logo { width:140px; }
  .hc-hero { padding:70px 0; }
  .hc-hero h1 { font-size:50px; }
  .hc-section { padding:75px 0; }
  .hc-section-head { display:block; }
  .hc-section-intro { margin-top:20px; }
  .hc-facts { grid-template-columns:1fr; }
  .hc-feature-grid { grid-template-columns:1fr; gap:42px; }
  .hc-feature-art { min-height:360px; }
  .hc-theatre-grid { grid-template-columns:1fr; }
  .hc-play-card, .hc-play-card-featured { grid-column:span 1; min-height:230px; }
  .hc-footer-inner { flex-direction:column; align-items:flex-start; }
}

/* Header / navigation */
.hc-site-logo { display:block; line-height:0; text-decoration:none; }
.hc-site-logo .custom-logo-link { display:block; line-height:0; }
.hc-site-logo .custom-logo { display:block; width:auto; max-width:170px; max-height:58px; object-fit:contain; }
.hc-menu-toggle { display:none; appearance:none; border:0; background:transparent; padding:10px 0 10px 10px; cursor:pointer; }
.hc-menu-icon { display:flex; width:28px; flex-direction:column; gap:5px; }
.hc-menu-icon i { display:block; width:100%; height:2px; background:currentColor; transition:transform .2s, opacity .2s; }
.hc-menu-toggle[aria-expanded="true"] .hc-menu-icon i:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hc-menu-toggle[aria-expanded="true"] .hc-menu-icon i:nth-child(2) { opacity:0; }
.hc-menu-toggle[aria-expanded="true"] .hc-menu-icon i:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
.screen-reader-text { border:0; clip:rect(1px,1px,1px,1px); clip-path:inset(50%); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; white-space:nowrap; }

@media (max-width: 640px) {
  .hc-header { padding:18px 0; }
  .hc-header-inner { position:relative; flex-direction:row; align-items:center; }
  .hc-site-logo .custom-logo { max-width:145px; max-height:50px; }
  .hc-mini-logo { width:145px; }
  .hc-menu-toggle { display:block; margin-left:auto; z-index:22; }
  .hc-nav { position:absolute; top:calc(100% + 10px); left:0; right:0; display:flex; flex-direction:column; gap:0; padding:8px 20px; background:var(--hc-black); color:#fff; box-shadow:0 16px 35px rgba(0,0,0,.16); opacity:0; visibility:hidden; transform:translateY(-8px); pointer-events:none; transition:opacity .2s, transform .2s, visibility .2s; }
  .hc-nav.is-open { opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto; }
  .hc-nav a { display:block; padding:14px 0; border-bottom:1px solid rgba(255,255,255,.12); color:#fff; }
  .hc-nav a:last-child { border-bottom:0; }
  .hc-nav a:hover { color:var(--hc-red); }
  body.hc-menu-open { overflow:hidden; }
}


/* Hero portrait */
.hc-hero-photo { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.hc-photo-frame { position:relative; width:min(100%, 500px); aspect-ratio:1/1; overflow:visible; }
.hc-photo-frame::before { content:""; position:absolute; inset:18px -18px -18px 18px; border:1px solid rgba(182,45,36,.34); z-index:-1; }
.hc-photo-frame::after { content:""; position:absolute; width:110px; height:110px; right:-28px; top:-28px; border:1px solid rgba(23,23,22,.12); border-radius:50%; box-shadow:0 0 0 14px rgba(23,23,22,.025); z-index:-1; }
.hc-photo-frame img { width:100%; height:100%; display:block; object-fit:cover; object-position:center center; border-radius:2px; box-shadow:0 24px 60px rgba(23,23,22,.18); filter:saturate(.88) contrast(1.03); }
.hc-photo-accent { position:absolute; left:-14px; bottom:26px; width:48px; height:48px; border-radius:50%; background:var(--hc-red); box-shadow:0 0 0 8px rgba(182,45,36,.10); }
.hc-photo-accent::before, .hc-photo-accent::after { content:""; position:absolute; background:#fff; opacity:.92; }
.hc-photo-accent::before { width:2px; height:18px; left:20px; top:11px; }
.hc-photo-accent::after { width:12px; height:2px; left:20px; top:28px; }
.hc-photo-caption { margin-top:22px; align-self:flex-start; color:var(--hc-muted); font-size:11px; text-transform:uppercase; letter-spacing:.16em; }

@media (max-width: 900px) {
  .hc-photo-frame { width:min(100%, 520px); }
  .hc-photo-caption { align-self:center; }
}
@media (max-width: 640px) {
  .hc-hero-photo { order:-1; margin-bottom:10px; }
  .hc-photo-frame { width:min(100%, 420px); }
  .hc-photo-frame::before { inset:12px -10px -10px 10px; }
  .hc-photo-frame::after { width:72px; height:72px; right:-14px; top:-14px; }
  .hc-photo-accent { width:40px; height:40px; left:-8px; bottom:18px; }
  .hc-photo-accent::before { height:15px; left:17px; top:9px; }
  .hc-photo-accent::after { width:10px; left:17px; top:23px; }
}
