/* Luis Bustamante Experience · PreGO LIVE 19 · 2026-08-11 */
:root {
  --ink: #111111;
  --charcoal: #2b2b2b;
  --gold: #c8a064;
  --gold-deep: #9d7742;
  --ivory: #f2efea;
  --paper: #fbfaf7;
  --muted: #a9a29a;
  --line: rgba(200,160,100,.32);
  --shadow: 0 28px 80px rgba(0,0,0,.18);
  --radius: 2px;
  --content: 1180px;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); line-height:1.6; -webkit-font-smoothing:antialiased; }
img { max-width:100%; display:block; }
a { color:inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.skip-link { position:absolute; left:-9999px; top:0; background:var(--gold); color:var(--ink); padding:.8rem 1rem; z-index:10000; }
.skip-link:focus { left:1rem; top:1rem; }
.site-header { position:sticky; top:0; z-index:999; background:rgba(242,239,234,.96); backdrop-filter:blur(14px); border-bottom:1px solid rgba(17,17,17,.08); }
.header-inner { max-width:var(--content); margin:auto; padding:.95rem 1.4rem; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; }
.brand img { width:min(430px, 44vw); height:auto; }
.main-nav { display:flex; align-items:center; gap:1.25rem; font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; font-weight:700; }
.main-nav a { text-decoration:none; position:relative; padding:.35rem 0; }
.main-nav a::after { content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--gold-deep); transition:width .25s ease; }
.main-nav a:hover::after, .main-nav a:focus-visible::after { width:100%; }
.langs { display:flex; gap:.45rem; border-left:1px solid rgba(17,17,17,.18); padding-left:1rem; }
.langs a { color:#5e5953; }
.langs .active { color:var(--gold-deep); }
.nav-cta { border:1px solid var(--ink); padding:.62rem .85rem !important; }
.nav-cta::after { display:none; }
.menu-toggle { display:none; background:none; border:1px solid rgba(17,17,17,.2); padding:.55rem .65rem; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; }
.container { width:min(var(--content), calc(100% - 2.8rem)); margin:auto; }
section { padding:7rem 0; }
section[id] { scroll-margin-top:150px; }
.eyebrow { color:var(--gold-deep); font-size:.76rem; text-transform:uppercase; letter-spacing:.22em; font-weight:800; margin:0 0 1.2rem; }
.display { font-family:var(--serif); font-weight:400; font-size:clamp(3rem, 7vw, 6.6rem); line-height:.95; letter-spacing:-.035em; margin:0; }
.h2 { font-family:var(--serif); font-weight:400; font-size:clamp(2.35rem, 5vw, 4.8rem); line-height:1.02; letter-spacing:-.025em; margin:.25rem 0 1.4rem; }
.h3 { font-family:var(--serif); font-weight:400; font-size:clamp(1.45rem, 2.4vw, 2.15rem); line-height:1.15; margin:0 0 .75rem; }
.lead { font-size:clamp(1.06rem, 1.7vw, 1.3rem); max-width:720px; color:#d8d2ca; }
.copy { max-width:760px; color:#5c5751; }
.btn-row { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2.2rem; }
.btn { background:transparent; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:.85rem 1.15rem; text-decoration:none; text-transform:uppercase; letter-spacing:.105em; font-size:.75rem; font-weight:800; border:1px solid currentColor; transition:transform .2s ease, background .2s ease, color .2s ease; }
.btn:hover { transform:translateY(-2px); }
.btn-primary { background:var(--gold); border-color:var(--gold); color:var(--ink); }
.btn-secondary { color:var(--ivory); border-color:rgba(242,239,234,.45); }
.btn-dark { color:var(--ink); }
.hero { background:var(--ink); color:var(--ivory); padding:6.4rem 0 5rem; min-height:78vh; display:flex; align-items:center; overflow:hidden; position:relative; }
.hero::before { content:'LB'; position:absolute; right:-.03em; bottom:-.22em; font-family:var(--serif); font-size:clamp(18rem, 38vw, 44rem); color:transparent; -webkit-text-stroke:1px rgba(200,160,100,.14); line-height:.8; pointer-events:none; }
.hero-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(280px,.55fr); gap:5rem; align-items:end; position:relative; z-index:1; }
.hero .signature { margin-top:2rem; color:var(--gold); font-family:var(--serif); font-style:italic; font-size:1.25rem; }
.hero-side { border-left:1px solid var(--line); padding-left:2rem; padding-bottom:.35rem; }
.hero-side p { margin:.4rem 0; font-size:.84rem; color:#b9b2aa; }
.hero-side strong { color:var(--ivory); font-weight:600; }
.stats { padding:0; background:var(--ivory); border-bottom:1px solid rgba(17,17,17,.09); }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.stat { padding:2rem 1.4rem; border-right:1px solid rgba(17,17,17,.1); }
.stat:last-child { border-right:0; }
.stat b { display:block; font-family:var(--serif); font-size:1.6rem; font-weight:400; margin-bottom:.25rem; }
.stat span { color:#6b655f; font-size:.78rem; }
.dark { background:var(--charcoal); color:var(--ivory); }
.grid-2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(2rem,6vw,6rem); align-items:center; }
.media-frame { position:relative; }
.media-frame::before { content:''; position:absolute; inset:-12px 12px 12px -12px; border:1px solid var(--gold); pointer-events:none; }
.media-frame img { width:100%; aspect-ratio:16/10; object-fit:cover; box-shadow:var(--shadow); }
.training-image img { object-position:center 48%; }
.program-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:rgba(242,239,234,.18); margin-top:3rem; }
.program { background:var(--charcoal); padding:2rem; min-height:230px; }
.program .num { color:var(--gold); font-size:.75rem; letter-spacing:.18em; }
.program p { color:#bdb6ae; font-size:.92rem; }
.program.featured { background:#242424; }
.school-home, .school-training { position:relative; overflow:hidden; background:var(--ink); color:var(--ivory); }
.school-home::after, .school-training::after { content:'ESCUELA'; position:absolute; right:-.04em; bottom:-.18em; color:transparent; -webkit-text-stroke:1px rgba(200,160,100,.1); font-family:var(--serif); font-size:clamp(8rem,22vw,23rem); line-height:.8; pointer-events:none; }
.school-intro-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(340px,.72fr); gap:clamp(2.5rem,6vw,6rem); align-items:start; position:relative; z-index:1; }
.school-lead { max-width:760px; color:#c9c2b9; font-size:clamp(1.05rem,1.55vw,1.25rem); }
.school-proof { border-left:1px solid var(--gold); padding:1.2rem 0 1.2rem 2rem; }
.school-proof span { display:block; color:var(--gold); font-size:.72rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; margin-bottom:1.25rem; }
.school-proof p { color:#bbb3aa; margin:.7rem 0; }
.school-proof strong { color:var(--ivory); font-weight:650; }
.school-format-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:rgba(242,239,234,.19); margin-top:3rem; position:relative; z-index:1; }
.school-format { background:#222; padding:2rem 1.55rem; min-height:285px; }
.school-format:nth-child(even) { background:#282828; }
.school-format small { display:block; color:var(--gold); font-size:.72rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; margin-bottom:2.3rem; }
.school-format h3 { font-family:var(--serif); font-size:clamp(1.35rem,2vw,1.8rem); font-weight:400; line-height:1.15; margin:0 0 1rem; }
.school-format p, .school-format li { color:#bbb3aa; font-size:.88rem; }
.school-format ul { padding-left:1rem; margin:.9rem 0 0; }
.school-home .btn-row, .school-training .btn-row { position:relative; z-index:1; }
.other-audiences { background:var(--paper); }
.audience-grid, .service-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:rgba(17,17,17,.12); margin-top:3rem; }
.audience-grid.audience-grid--three { grid-template-columns:repeat(3,1fr); }
.audience, .service { background:var(--paper); padding:2rem 1.55rem; min-height:230px; }
.audience small, .service small { color:var(--gold-deep); letter-spacing:.18em; font-weight:800; }
.audience p, .service p { color:#6a645d; font-size:.92rem; }
.service-grid { grid-template-columns:repeat(3,1fr); }
.about-image img { width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center 38%; }
.quote { font-family:var(--serif); font-size:clamp(1.7rem,3vw,2.8rem); line-height:1.2; border-top:1px solid var(--gold); padding-top:1.4rem; margin-top:2rem; }
.timeline { margin-top:3.2rem; border-top:1px solid rgba(242,239,234,.18); }
.timeline-item { display:grid; grid-template-columns:180px 1fr; gap:2rem; padding:1.6rem 0; border-bottom:1px solid rgba(242,239,234,.16); }
.timeline-item time { color:var(--gold); font-family:var(--serif); font-size:1.4rem; }
.timeline-item h3 { margin:0 0 .35rem; font-size:1.1rem; letter-spacing:.06em; text-transform:uppercase; }
.timeline-item p { margin:0; color:#bdb6ae; }
.mib-card { margin-top:4rem; display:grid; grid-template-columns:minmax(300px,.85fr) minmax(0,1fr); gap:4rem; align-items:center; }
.mib-visual { position:relative; aspect-ratio:3/2; margin:0; overflow:hidden; isolation:isolate; background:linear-gradient(135deg,#151515 0%,#26231f 100%); box-shadow:var(--shadow); }
.mib-visual::before { content:''; position:absolute; inset:12px; border:1px solid rgba(200,160,100,.36); z-index:4; pointer-events:none; }
.mib-visual::after { content:''; position:absolute; left:64%; top:-18%; width:2px; height:138%; background:var(--gold); transform:rotate(13deg); transform-origin:center; z-index:3; box-shadow:0 0 0 1px rgba(17,17,17,.28); pointer-events:none; }
.mib-photo { position:absolute; display:block; max-width:none; }
.mib-photo--bar { inset:0 auto 0 0; width:74%; height:100%; object-fit:cover; object-position:center 42%; clip-path:polygon(0 0,100% 0,83% 100%,0 100%); filter:contrast(1.03); z-index:1; }
.mib-photo--trophy { top:6%; right:4%; width:37%; height:88%; object-fit:cover; object-position:center 34%; border:1px solid rgba(242,239,234,.72); box-shadow:-18px 24px 48px rgba(0,0,0,.42); transform:rotate(2.6deg); z-index:2; }
.speaking-card { display:grid; grid-template-columns:420px 1fr; gap:4rem; align-items:center; }
.speaking-card img { width:100%; aspect-ratio:1; object-fit:cover; object-position:left center; }
.method { counter-reset:steps; display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:rgba(17,17,17,.12); margin-top:3rem; }
.method article { background:var(--paper); padding:2rem 1.4rem; min-height:225px; }
.method article::before { counter-increment:steps; content:'0' counter(steps); display:block; color:var(--gold-deep); font-family:var(--serif); font-size:1.35rem; margin-bottom:2.5rem; }
.contact { background:var(--gold); color:var(--ink); }
.contact-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:5rem; align-items:end; }
.contact-lines a { display:block; text-decoration:none; font-family:var(--serif); font-size:clamp(1.3rem,2.8vw,2.2rem); padding:.85rem 0; border-bottom:1px solid rgba(17,17,17,.28); }
.site-footer { background:var(--ink); color:#bdb6ae; padding:3rem 0; font-size:.78rem; }
.footer-grid { display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:end; }
.footer-links { display:flex; gap:1.1rem; flex-wrap:wrap; }
.footer-links a { text-decoration:none; }
.internal-note { border:1px solid rgba(200,160,100,.42); color:#c9c0b5; padding:1rem 1.2rem; font-size:.8rem; margin-top:2rem; }
.legal-page { padding:clamp(4rem,8vw,7rem) 0; min-height:70vh; }
.legal-page > header { max-width:820px; margin-bottom:3rem; }
.legal-section { max-width:820px; padding:1.6rem 0; border-top:1px solid rgba(17,17,17,.14); }
.legal-section h2 { font-family:var(--serif); font-size:clamp(1.45rem,2.4vw,2rem); font-weight:400; line-height:1.2; margin:0 0 .8rem; }
.legal-section p, .legal-section li { color:#5c5751; }
.legal-section ul { padding-left:1.25rem; }
.legal-data { padding:1.2rem 1.35rem; background:var(--ivory); border-left:3px solid var(--gold); }
.legal-data p { margin:.3rem 0; }
.form-privacy-summary { margin:.9rem 0 0; padding:.9rem 1rem; background:var(--ivory); border-left:3px solid var(--gold); color:#5c5751; font-size:.78rem; }
.form-privacy-summary p { margin:0 0 .35rem; }
.form-privacy-summary p:last-child { margin-bottom:0; }
.reveal { opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.reveal.is-visible { opacity:1; transform:none; }
.subhero { background:var(--ink); color:var(--ivory); padding:5.5rem 0; position:relative; overflow:hidden; }
.subhero::after { content:'FORMACIÓN'; position:absolute; right:-1rem; bottom:-.25em; font-family:var(--serif); font-size:clamp(8rem,18vw,19rem); color:transparent; -webkit-text-stroke:1px rgba(200,160,100,.12); pointer-events:none; }
.program-detail { padding:2.2rem 0; border-top:1px solid rgba(17,17,17,.16); display:grid; grid-template-columns:300px 1fr; gap:3rem; }
.program-detail ul { columns:2; padding-left:1.1rem; color:#655f59; }
.mode-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(17,17,17,.12); margin-top:3rem; }
.mode { background:var(--paper); padding:2rem; min-height:210px; }
.placeholder { min-height:70vh; display:grid; place-items:center; text-align:center; background:var(--ink); color:var(--ivory); padding:3rem; }
.placeholder .box { max-width:720px; }
.placeholder a { color:var(--gold); }
@media (max-width: 980px) {
  .menu-toggle { display:block; }
  .main-nav { position:absolute; left:0; right:0; top:100%; background:var(--ivory); padding:1.2rem 1.4rem 1.5rem; display:none; flex-direction:column; align-items:flex-start; border-bottom:1px solid rgba(17,17,17,.12); }
  .main-nav.open { display:flex; }
  .langs { border-left:0; padding-left:0; }
  .hero-grid, .grid-2, .mib-card, .speaking-card, .contact-grid, .school-intro-grid { grid-template-columns:1fr; gap:3rem; }
  .hero-side { border-left:0; border-top:1px solid var(--line); padding:1.5rem 0 0; }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
  .stat:nth-child(2) { border-right:0; }
  .stat:nth-child(-n+2) { border-bottom:1px solid rgba(17,17,17,.1); }
  .audience-grid { grid-template-columns:repeat(2,1fr); }
  .audience-grid.audience-grid--three { grid-template-columns:repeat(3,1fr); }
  .school-format-grid { grid-template-columns:repeat(2,1fr); }
  .school-proof { border-left:0; border-top:1px solid var(--gold); padding:1.6rem 0 0; }
  .service-grid, .method, .mode-grid { grid-template-columns:1fr; }
  .program-detail { grid-template-columns:1fr; gap:1rem; }
  .program-detail ul { columns:1; }
}
@media (max-width: 640px) {
  section { padding:5rem 0; }
  .container { width:min(100% - 2rem, var(--content)); }
  .header-inner { padding:.75rem 1rem; }
  .brand img { width:245px; max-width:68vw; }
  .hero { min-height:auto; padding:5rem 0 4rem; }
  .hero-grid { gap:2.2rem; }
  .display { font-size:clamp(2.8rem,14vw,4.6rem); }
  .program-grid, .audience-grid, .audience-grid.audience-grid--three, .school-format-grid { grid-template-columns:1fr; }
  .school-format { min-height:auto; }
  .timeline-item { grid-template-columns:1fr; gap:.35rem; }
  .mib-visual { aspect-ratio:4/3; }
  .mib-visual::before { inset:8px; }
  .mib-visual::after { left:65%; transform:rotate(12deg); }
  .mib-photo--bar { width:77%; }
  .mib-photo--trophy { top:8%; right:3%; width:39%; height:84%; }
  .btn { width:100%; }
  .footer-grid { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
  .reveal { opacity:1; transform:none; }
}

html[lang="ca"] .subhero::after{content:"FORMACIÓ";}
html[lang="en"] .subhero::after{content:"TRAINING";}
html[lang="ca"] .school-home::after, html[lang="ca"] .school-training::after{content:"ESCOLA";}
html[lang="en"] .school-home::after, html[lang="en"] .school-training::after{content:"SCHOOL";}


/* Private callback form */
.callback-inline, .callback-link, .contact-link, .footer-button { font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; text-align:left; }
.callback-inline { margin-top:.65rem; color:var(--gold); text-decoration:underline; text-underline-offset:.22em; font-size:.84rem; }
.contact-link { display:block; width:100%; font-family:var(--serif); font-size:clamp(1.3rem,2.8vw,2.2rem); padding:.85rem 0; border-bottom:1px solid rgba(17,17,17,.28); }
.footer-button { color:inherit; font-size:inherit; }
.callback-dialog { width:min(760px, calc(100% - 2rem)); max-height:90vh; border:1px solid var(--line); padding:0; background:var(--paper); color:var(--ink); box-shadow:0 35px 120px rgba(0,0,0,.45); }
.callback-dialog::backdrop { background:rgba(0,0,0,.72); backdrop-filter:blur(4px); }
.callback-shell { position:relative; padding:clamp(1.5rem,4vw,3rem); overflow:auto; max-height:90vh; }
.dialog-close { position:absolute; top:1rem; right:1rem; width:42px; height:42px; border:1px solid rgba(17,17,17,.22); background:transparent; font-size:1.8rem; line-height:1; cursor:pointer; }
.callback-intro { color:#5c5751; max-width:620px; }
.callback-form { margin-top:1.5rem; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.form-grid label { display:flex; flex-direction:column; gap:.4rem; font-size:.78rem; font-weight:700; letter-spacing:.04em; }
.form-grid input, .form-grid select, .form-grid textarea { width:100%; border:1px solid rgba(17,17,17,.22); background:#fff; color:var(--ink); font:inherit; padding:.82rem .9rem; border-radius:0; }
.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus { outline:2px solid var(--gold); outline-offset:1px; border-color:var(--gold-deep); }
.form-wide { grid-column:1 / -1; }
.privacy-check { display:flex; gap:.7rem; align-items:flex-start; margin:1.1rem 0; color:#5c5751; font-size:.82rem; }
.privacy-check input { margin-top:.3rem; flex:0 0 auto; }
.privacy-check a { color:var(--gold-deep); }
.callback-actions { margin-top:1rem; }
.form-error { color:#9b2525; min-height:1.4em; margin:.7rem 0 0; font-weight:700; font-size:.82rem; }
.form-status { min-height:1.6em; margin:.9rem 0 0; font-weight:700; }
.callback-form.is-submitted .form-status { color:#315c3c; }
.honeypot { position:absolute !important; left:-9999px !important; width:1px !important; height:1px !important; overflow:hidden !important; }
.callback-form button:disabled { opacity:.55; cursor:wait; }
@media (max-width:640px) {
  .form-grid { grid-template-columns:1fr; }
  .form-wide { grid-column:auto; }
  .callback-shell { padding:1.4rem; }
  .dialog-close { top:.6rem; right:.6rem; }
}
