/* ============================================================== */
/*  JF GUEDES · One Page — Design System foundations              */
/*  Black & Gold (John Player Special / Lotus livery inspired)    */
/*  Reaproveita tokens e classes do design_system.html            */
/* ============================================================== */
:root{
  /* Brand — JPS gold + lacquer black */
  --c-gold:#C9A24B; --c-gold-600:#A9863A; --c-gold-700:#8C6E2E;
  --c-gold-400:#D9BC73; --c-gold-300:#E7CF94; --c-gold-200:#F1E1B5; --c-gold-50:#FBF4E2;
  --c-champagne:#EAD9AE;
  --c-ink:#0A0A0B; --c-ink-soft:#111113; --c-carbon:#17171A; --c-carbon-2:#1F1F24;
  --c-graphite-700:#2C2C33; --c-graphite-500:#55555F; --c-graphite-400:#7A7A85;
  --c-graphite-300:#A5A5AE; --c-graphite-200:#CFCFD5; --c-graphite-100:#E6E6EA; --c-graphite-50:#F4F4F6;
  --c-cream:#F7F3EA; --c-bg:#0B0B0C; --c-bg-light:#F6F4EE; --c-surface:#101013; --c-surface-light:#FFFFFF;
  --c-success:#6FB98F; --c-danger:#C6534E;

  --font-display:'Playfair Display',Georgia,'Times New Roman',serif;
  --font-body:'Inter',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;

  --gold-foil:linear-gradient(135deg,#8C6E2E 0%,#E7CF94 22%,#C9A24B 48%,#F6EDCF 66%,#A9863A 84%,#E7CF94 100%);
  --gold-line:linear-gradient(90deg,transparent,var(--c-gold),transparent);

  --gx-1:6%; --gx-2:28%; --gx-3:62%; --gx-4:94%;
  --grid-color:rgba(201,162,75,0.10); --beam-color:#E7CF94;
  --plate-clip:polygon(0 0,calc(100% - 0.7rem) 0,100% 0.7rem,100% 100%,0.7rem 100%,0 calc(100% - 0.7rem));
}

*{ -webkit-font-smoothing:antialiased; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
html,body{ background:var(--c-bg); color:var(--c-cream); margin:0; }
body{ font-family:var(--font-body); font-weight:400; font-size:16px; letter-spacing:-0.003em; overflow-x:hidden; }
a{ text-decoration:none; color:inherit; }
::selection{ background:var(--c-gold); color:var(--c-ink); }

.font-display{ font-family:var(--font-display); font-weight:800; letter-spacing:-0.01em; }
.font-mono{ font-family:var(--font-mono); }

/* Gold foil text */
.text-gold{ background:var(--gold-foil); background-size:220% auto; -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; }
.text-gold-shimmer{ animation:foil-shift 6s linear infinite; }
.text-gold-solid{ color:var(--c-gold); }
@keyframes foil-shift{ to{ background-position:220% center; } }

/* ============================================================== */
/*  GRID GUIDES + BEAMS                                            */
/* ============================================================== */
.grid-line-v{ position:absolute; top:0; bottom:0; width:1px; background:var(--grid-color); z-index:1; pointer-events:none; }
.grid-line-h{ position:absolute; left:0; right:0; height:1px; background:var(--grid-color); z-index:1; pointer-events:none; }
@keyframes beam-h{ 0%{ left:-220px; opacity:0; } 10%{ opacity:1; } 90%{ opacity:1; } 100%{ left:100%; opacity:0; } }
@keyframes beam-v{ 0%{ top:-220px; opacity:0; } 10%{ opacity:1; } 90%{ opacity:1; } 100%{ top:100%; opacity:0; } }
.beam-h{ position:absolute; height:1px; width:220px; opacity:0; z-index:8; background:linear-gradient(90deg,transparent,var(--beam-color),transparent); }
.beam-v{ position:absolute; width:1px; height:220px; opacity:0; z-index:8; background:linear-gradient(180deg,transparent,var(--beam-color),transparent); }

/* ============================================================== */
/*  GOLD PINSTRIPE — signature JPS livery                          */
/* ============================================================== */
.pinstripe-x{ height:2px; width:100%; background:var(--gold-foil); background-size:200% auto; box-shadow:0 0 12px rgba(201,162,75,0.45); animation:foil-shift 8s linear infinite; }
.pinstripe-double{ position:relative; height:6px; width:100%;
  background:linear-gradient(var(--c-gold),var(--c-gold)) top/100% 1px no-repeat,
            linear-gradient(var(--c-gold),var(--c-gold)) bottom/100% 1px no-repeat; opacity:.8; }
@keyframes draw-line{ from{ transform:scaleX(0);} to{ transform:scaleX(1);} }
.pinstripe-draw{ transform-origin:left; }
.is-visible .pinstripe-draw{ animation:draw-line 1.1s cubic-bezier(0.16,1,0.3,1) forwards; }

/* ============================================================== */
/*  BACKGROUNDS                                                    */
/* ============================================================== */
.carbon-weave{ background-color:var(--c-ink);
  background-image:linear-gradient(27deg,#131316 5px,transparent 5px),linear-gradient(207deg,#131316 5px,transparent 5px),
                   linear-gradient(27deg,#0d0d10 5px,transparent 5px),linear-gradient(207deg,#0d0d10 5px,transparent 5px);
  background-size:10px 18px; background-position:0 0,5px 9px,5px 9px,10px 18px; }
.steel-mesh-dark{ background-image:linear-gradient(rgba(201,162,75,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(201,162,75,0.05) 1px,transparent 1px); background-size:34px 34px; }

/* ============================================================== */
/*  ANIMATIONS                                                     */
/* ============================================================== */
@keyframes reveal-up{ 0%{ clip-path:inset(100% 0 0 0); transform:translateY(20px); opacity:0; } 100%{ clip-path:inset(0 0 0 0); transform:translateY(0); opacity:1; } }
@keyframes fade-in{ from{ opacity:0 } to{ opacity:1 } }
@keyframes float-y{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-12px) } }
@keyframes spin-slow{ to{ transform:rotate(360deg); } }
@keyframes pulse-gold{ 0%,100%{ box-shadow:0 0 0 0 rgba(201,162,75,0.5),0 0 24px rgba(201,162,75,0.15); } 50%{ box-shadow:0 0 0 12px rgba(201,162,75,0),0 0 42px rgba(201,162,75,0.32); } }
@keyframes glow-pulse{ 0%,100%{ filter:drop-shadow(0 0 10px rgba(201,162,75,0.40)); } 50%{ filter:drop-shadow(0 0 26px rgba(231,207,148,0.85)); } }
@keyframes beacon{ 0%,100%{ opacity:0.4; transform:scale(0.9); } 50%{ opacity:1; transform:scale(1.08); } }
@keyframes drift{ 0%{ transform:translate3d(0,0,0); opacity:0; } 10%{ opacity:.9; } 90%{ opacity:.9; } 100%{ transform:translate3d(var(--dx,20px),-160px,0); opacity:0; } }
@keyframes bob{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(8px); } }

.animate-reveal{ opacity:0; animation:reveal-up 1s cubic-bezier(0.16,1,0.3,1) forwards; }
.animate-float{ animation:float-y 6s ease-in-out infinite; }
.animate-spin-slow{ animation:spin-slow 32s linear infinite; }
.animate-pulse-gold{ animation:pulse-gold 2.8s ease-in-out infinite; }
.animate-glow{ animation:glow-pulse 3.2s ease-in-out infinite; }
.animate-beacon{ animation:beacon 2s ease-in-out infinite; }

.delay-100{ animation-delay:.1s; transition-delay:.1s; } .delay-200{ animation-delay:.2s; transition-delay:.2s; }
.delay-300{ animation-delay:.3s; transition-delay:.3s; } .delay-400{ animation-delay:.4s; transition-delay:.4s; }
.delay-500{ animation-delay:.5s; transition-delay:.5s; } .delay-600{ animation-delay:.6s; transition-delay:.6s; }
.delay-700{ animation-delay:.7s; transition-delay:.7s; } .delay-900{ animation-delay:.9s; transition-delay:.9s; }

/* Scroll reveal */
.scroll-reveal,.reveal{ opacity:0; transform:translateY(28px); transition:opacity 1s cubic-bezier(0.16,1,0.3,1),transform 1s cubic-bezier(0.16,1,0.3,1); }
.scroll-reveal.is-visible,.reveal.active{ opacity:1; transform:translateY(0); }

/* Marquee */
@keyframes marquee-scroll{ from{ transform:translateX(0);} to{ transform:translateX(-100%);} }
.marquee-container{ display:flex; overflow:hidden; user-select:none; }
.marquee-content{ flex-shrink:0; display:flex; justify-content:space-around; min-width:100%; animation:marquee-scroll 40s linear infinite; gap:3rem; align-items:center; }

/* Grain overlay */
.noise-overlay{ position:fixed; inset:0; pointer-events:none; z-index:9000; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E"); }

/* Orbit ring */
.orbit-ring{ position:absolute; border:1px solid rgba(201,162,75,0.18); border-radius:9999px; animation:spin-slow 60s linear infinite; }
.orbit-ring::before{ content:""; position:absolute; top:-4px; left:50%; transform:translateX(-50%); width:8px; height:8px; border-radius:9999px; background:var(--c-gold); box-shadow:0 0 16px var(--c-gold); }

/* ============================================================== */
/*  MONOGRAM (logo mark JFG)                                       */
/* ============================================================== */
.monogram{ font-family:var(--font-display); font-weight:900; font-style:italic; letter-spacing:-0.08em; line-height:1; display:inline-flex; align-items:center; }
.monogram .glyph{ background:var(--gold-foil); background-size:200% auto; -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; }
.monogram .glyph.overlap{ margin-left:-0.22em; }

/* ============================================================== */
/*  BUTTONS                                                        */
/* ============================================================== */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.6rem; font-family:var(--font-body); font-weight:600;
  padding:.9rem 1.9rem; transition:all .35s cubic-bezier(0.16,1,0.3,1); position:relative; overflow:hidden;
  letter-spacing:.14em; text-transform:uppercase; font-size:.72rem; border-radius:999px; cursor:pointer; border:0; }
.btn iconify-icon{ transition:transform .35s cubic-bezier(0.16,1,0.3,1); }
.btn:hover iconify-icon{ transform:translateX(4px); }
.btn-primary{ background:var(--gold-foil); background-size:200% auto; color:var(--c-ink); font-weight:700; box-shadow:0 12px 30px -12px rgba(201,162,75,0.6),inset 0 0 0 1px rgba(255,255,255,0.2); }
.btn-primary:hover{ background-position:right center; transform:translateY(-2px); box-shadow:0 20px 44px -12px rgba(201,162,75,0.8),inset 0 0 0 1px rgba(255,255,255,0.35); }
.btn-glow-wrap{ display:inline-block; position:relative; transition:transform .35s cubic-bezier(0.16,1,0.3,1); }
.btn-glow-wrap::before{ content:""; position:absolute; inset:-5px; z-index:-1; border-radius:999px; background:var(--c-gold); opacity:0; transition:opacity .4s ease; filter:blur(14px); }
.btn-glow-wrap:hover::before{ opacity:.6; }
.btn-glow-wrap:hover{ transform:translateY(-2px); }
.btn-dark{ background:var(--c-ink); color:var(--c-champagne); border:1px solid rgba(201,162,75,0.3); }
.btn-dark:hover{ background:var(--c-carbon); transform:translateY(-2px); border-color:var(--c-gold); }
.btn-outline{ background:transparent; color:var(--c-gold); border:1px solid var(--c-gold); padding:calc(.9rem - 1px) calc(1.9rem - 1px); }
.btn-outline:hover{ background:var(--c-gold); color:var(--c-ink); transform:translateY(-2px); box-shadow:0 14px 30px -14px rgba(201,162,75,0.7); }
.btn-ghost{ background:transparent; color:var(--c-cream); }
.btn-ghost:hover{ background:rgba(201,162,75,0.1); color:var(--c-gold); }
.btn-shimmer::before{ content:""; position:absolute; top:0; left:-110%; width:60%; height:100%; background:linear-gradient(110deg,transparent,rgba(255,255,255,0.55),transparent); transition:left .8s ease; z-index:1; pointer-events:none; }
.btn-shimmer:hover::before{ left:130%; }

/* ============================================================== */
/*  INPUTS / FORM FIELDS (do design system)                       */
/* ============================================================== */
.field-base{ width:100%; padding:.95rem 1.1rem; background:rgba(255,255,255,0.03); border:1px solid rgba(201,162,75,0.22);
  border-radius:10px; color:var(--c-cream); font-family:var(--font-body); font-size:.95rem; transition:all .25s ease; }
.field-base::placeholder{ color:var(--c-graphite-400); }
.field-base:focus{ outline:none; border-color:var(--c-gold); box-shadow:0 0 0 4px rgba(201,162,75,0.16); background:rgba(255,255,255,0.05); }
textarea.field-base{ resize:vertical; min-height:120px; line-height:1.6; }
/* Autofill — evita o fundo branco do Chrome */
.field-base:-webkit-autofill,
.field-base:-webkit-autofill:hover,
.field-base:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--c-cream);
  -webkit-box-shadow:0 0 0 1000px #15141a inset;
  caret-color:var(--c-cream);
  transition:background-color 9999s ease-out 0s;
}
.field-label{ font-family:var(--font-mono); font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--c-gold); }

/* ============================================================== */
/*  BADGES                                                         */
/* ============================================================== */
.badge{ display:inline-flex; align-items:center; gap:.4rem; padding:.4rem .85rem; border-radius:999px; font-size:.64rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; font-family:var(--font-mono); }
.badge-live{ background:var(--gold-foil); color:var(--c-ink); }
.badge-glass{ background:rgba(255,255,255,0.05); color:var(--c-cream); border:1px solid rgba(201,162,75,0.3); backdrop-filter:blur(10px); }
.badge-outline{ background:transparent; color:var(--c-gold); border:1px solid var(--c-gold); }

.mono-caption{ font-family:var(--font-mono); font-size:.68rem; color:var(--c-gold); letter-spacing:.16em; text-transform:uppercase; }
.gold-divider{ height:1px; width:100%; background:var(--gold-line); }

/* ============================================================== */
/*  SECTION WRAPPER (para as próximas dobras)                      */
/* ============================================================== */
.section{ position:relative; z-index:10; padding:7rem 0; background:var(--c-bg); color:var(--c-cream); overflow:hidden; }
.section.alt{ background:#0E0E11; }
.section.ivory{ background:var(--c-bg-light); color:var(--c-ink); }
.container{ max-width:1200px; margin:0 auto; padding:0 1.5rem; }
.eyebrow{ display:inline-flex; align-items:center; gap:.55rem; font-family:var(--font-mono); font-size:.7rem; text-transform:uppercase; letter-spacing:.28em; color:var(--c-gold); margin-bottom:1rem; }
.eyebrow::before{ content:""; width:26px; height:1px; background:var(--c-gold); display:inline-block; }
.section-title{ font-family:var(--font-display); font-weight:800; font-size:clamp(2.2rem,4.6vw,3.75rem); letter-spacing:-0.02em; line-height:1.04; color:var(--c-cream); }
.section.ivory .section-title{ color:var(--c-ink); }
.section.ivory .eyebrow{ color:var(--c-gold-700); }

/* ============================================================== */
/*  NAVBAR                                                         */
/* ============================================================== */
.nav{ position:fixed; top:0; left:0; right:0; z-index:100; transition:background .4s ease,border-color .4s ease,backdrop-filter .4s ease; border-bottom:1px solid transparent; }
.nav.scrolled{ background:rgba(10,10,11,0.78); backdrop-filter:blur(18px) saturate(150%); -webkit-backdrop-filter:blur(18px) saturate(150%); border-bottom:1px solid rgba(201,162,75,0.14); }
.nav-inner{ max-width:1280px; margin:0 auto; height:76px; padding:0 1.5rem; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; }
.nav-logo{ display:flex; align-items:center; gap:.6rem; }
.nav-logo .logo-word{ font-family:var(--font-display); font-weight:700; font-style:italic; font-size:1.35rem; color:var(--c-cream); letter-spacing:.01em; }
.nav-logo .logo-word b{ font-weight:700; }
.nav-logo img { height: 50px; }
.nav-links{ display:flex; align-items:center; gap:2rem; }
.nav-links a{ font-family:var(--font-body); font-size:.82rem; font-weight:500; letter-spacing:.02em; color:rgba(247,243,234,0.72); position:relative; padding:.25rem 0; transition:color .3s ease; }
.nav-links a::after{ content:""; position:absolute; left:0; bottom:-2px; width:0; height:1px; background:var(--gold-foil); transition:width .35s cubic-bezier(0.16,1,0.3,1); }
.nav-links a:hover{ color:var(--c-gold); }
.nav-links a:hover::after{ width:100%; }
.nav-right{ display:flex; align-items:center; gap:1rem; }

/* Language selector */
.lang{ position:relative; }
.lang-toggle{ display:inline-flex; align-items:center; gap:.5rem; padding:.5rem .8rem; border-radius:999px; background:rgba(255,255,255,0.05); border:1px solid rgba(201,162,75,0.28); color:var(--c-cream); font-family:var(--font-mono); font-size:.72rem; letter-spacing:.08em; cursor:pointer; transition:border-color .3s ease,background .3s ease; }
.lang-toggle:hover{ border-color:var(--c-gold); }
.lang-toggle .flag{ width:18px; height:13px; border-radius:2px; object-fit:cover; display:inline-block; box-shadow:0 0 0 1px rgba(255,255,255,0.15); }
.lang-toggle .chev{ transition:transform .3s ease; }
.lang.open .lang-toggle .chev{ transform:rotate(180deg); }
.lang-menu{ position:absolute; top:calc(100% + 10px); right:0; min-width:210px; background:rgba(16,16,19,0.96); backdrop-filter:blur(16px); border:1px solid rgba(201,162,75,0.25); border-radius:14px; padding:.4rem; box-shadow:0 30px 60px -30px rgba(0,0,0,0.85); opacity:0; visibility:hidden; transform:translateY(-8px); transition:all .3s cubic-bezier(0.16,1,0.3,1); overflow:hidden; }
.lang-menu::before{ content:""; position:absolute; top:0; left:0; right:0; height:2px; background:var(--gold-foil); }
.lang.open .lang-menu{ opacity:1; visibility:visible; transform:translateY(0); }
.lang-item{ display:flex; align-items:center; gap:.7rem; padding:.65rem .8rem; border-radius:10px; cursor:pointer; transition:background .25s ease; }
.lang-item:hover{ background:rgba(201,162,75,0.1); }
.lang-item .flag{ width:22px; height:16px; border-radius:3px; object-fit:cover; box-shadow:0 0 0 1px rgba(255,255,255,0.15); }
.lang-item .name{ font-size:.9rem; color:var(--c-cream); font-weight:500; flex:1; }
.lang-item .code{ font-family:var(--font-mono); font-size:.66rem; color:var(--c-gold); letter-spacing:.1em; }
.lang-item.active{ background:rgba(201,162,75,0.08); }
.lang-item.active .name{ color:var(--c-gold); }

/* Mobile menu button */
.nav-burger{ display:none; width:44px; height:44px; border-radius:10px; background:rgba(255,255,255,0.05); border:1px solid rgba(201,162,75,0.28); color:var(--c-gold); align-items:center; justify-content:center; cursor:pointer; }

/* ============================================================== */
/*  HERO                                                          */
/* ============================================================== */
.hero{ position:relative; min-height:100vh; display:flex; align-items:flex-end; overflow:hidden; background:#060607; padding-bottom:15vh; }
.hero::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:320px; z-index:3; pointer-events:none;
  background:linear-gradient(180deg,rgba(11,11,12,0) 0%,rgba(11,11,12,0.55) 40%,rgba(11,11,12,0.9) 75%,#0B0B0C 100%); }
.hero-bg{ position:absolute; inset:0; z-index:0; }
.hero-bg img{ width:100%; height:100%; object-fit:cover; opacity:.92; transform:scale(1.05); animation:hero-zoom 18s ease-out forwards; }
@keyframes hero-zoom{ to{ transform:scale(1); } }
.hero-bg::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(90deg,rgba(6,6,7,0.92) 0%,rgba(6,6,7,0.7) 32%,rgba(6,6,7,0.2) 58%,rgba(6,6,7,0.05) 100%); }
.hero-overlay-top{ position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(ellipse 60% 50% at 15% 40%,rgba(201,162,75,0.14),transparent 60%),
             radial-gradient(ellipse 50% 60% at 90% 90%,rgba(201,162,75,0.08),transparent 60%); }
.hero-vignette{ position:absolute; inset:0; z-index:1; pointer-events:none; background:radial-gradient(ellipse at center,transparent 35%,rgba(6,6,7,0.6) 100%); }
.hero-watermark{ position:absolute; right:-3%; top:8%; font-family:var(--font-display); font-weight:900; font-style:italic; font-size:clamp(8rem,20vw,24rem); letter-spacing:-0.04em; color:transparent; -webkit-text-stroke:1px rgba(201,162,75,0.1); white-space:nowrap; pointer-events:none; z-index:1; line-height:1; }
.hero-dust{ position:absolute; inset:0; z-index:4; pointer-events:none; overflow:hidden; }
.hero-content{ position:relative; z-index:5; max-width:1280px; margin:0 auto; padding:0 1.5rem; width:100%; }
.hero-inner{ max-width:760px; }
.hero-title{ font-family:var(--font-display); font-weight:700; text-transform:uppercase; font-size:clamp(1.7rem,3.4vw,2.85rem); line-height:1.18; letter-spacing:0.005em; color:var(--c-cream); margin:0; }
.hero-sub{ margin-top:1.5rem; max-width:600px; font-size:clamp(.95rem,1.15vw,1.05rem); line-height:1.7; color:rgba(247,243,234,0.7); }
.hero-cta{ margin-top:2.25rem; display:flex; flex-wrap:wrap; gap:1rem; }
.hero-meta{ margin-top:3.5rem; display:flex; gap:2.5rem; flex-wrap:wrap; }
.hero-meta .item .num{ font-family:var(--font-display); font-weight:800; font-size:2rem; line-height:1; color:var(--c-gold); }
.hero-meta .item .lbl{ font-family:var(--font-mono); font-size:.64rem; letter-spacing:.14em; text-transform:uppercase; color:var(--c-graphite-400); margin-top:.4rem; }
.hero-meta .divider{ width:1px; background:rgba(201,162,75,0.2); align-self:stretch; }

/* Scroll cue */
.scroll-cue{ position:absolute; bottom:2rem; left:50%; transform:translateX(-50%); z-index:5; display:flex; flex-direction:column; align-items:center; gap:.5rem; color:var(--c-gold); }
.scroll-cue .mouse{ width:22px; height:36px; border:1px solid rgba(201,162,75,0.5); border-radius:12px; display:flex; justify-content:center; padding-top:6px; }
.scroll-cue .mouse span{ width:3px; height:7px; background:var(--c-gold); border-radius:2px; animation:bob 1.6s ease-in-out infinite; }
.scroll-cue .txt{ font-family:var(--font-mono); font-size:.56rem; letter-spacing:.24em; text-transform:uppercase; color:var(--c-graphite-400); }

/* Hero brand strip */
.hero-strip{ position:absolute; bottom:0; left:0; right:0; z-index:4; }
.brand-item{ font-family:var(--font-display); font-weight:700; font-style:italic; font-size:1.25rem; color:rgba(247,243,234,0.4); transition:color .3s ease,transform .3s ease; white-space:nowrap; }
.brand-item:hover{ color:var(--c-gold); transform:translateY(-2px); }

/* Preloader */
.loader{ position:fixed; inset:0; background:var(--c-ink); z-index:10000; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:1.75rem; }
.loader-mark{ display:flex; align-items:center; gap:.85rem; }
.loader-mark .dot{ width:9px; height:9px; border-radius:50%; background:var(--c-gold); animation:beacon 1.2s ease-in-out infinite; }
.loader-mark span{ font-family:var(--font-mono); font-size:.75rem; letter-spacing:.24em; text-transform:uppercase; color:var(--c-cream); }
.loader-strip{ width:240px; height:1px; background:var(--gold-line); }
.loader-bar{ position:absolute; bottom:0; left:0; height:2px; background:var(--gold-foil); width:0%; }

iconify-icon{ display:inline-flex; align-items:center; justify-content:center; vertical-align:middle; }

/* ============================================================== */
/*  2ª DOBRA · ABOUT (A JF Guedes)                                */
/* ============================================================== */
.about{ position:relative; }
.about::before{ content:""; position:absolute; top:0; left:0; right:0; height:220px; z-index:1; pointer-events:none;
  background:linear-gradient(180deg,#060607 0%,rgba(6,6,7,0.85) 30%,rgba(6,6,7,0) 100%); }
.about-grid{ display:grid; grid-template-columns:1.05fr 0.95fr; gap:4rem; align-items:center; }
.about-text{ position:relative; }
.about-deco{ position:absolute; top:-10px; left:-56px; display:grid; grid-template-columns:repeat(3,6px); gap:14px; opacity:.5; }
.about-deco span{ width:6px; height:6px; border-radius:50%; background:var(--c-gold); box-shadow:0 0 8px rgba(201,162,75,0.5); }
.about-p{ color:rgba(247,243,234,0.68); line-height:1.85; font-size:1rem; margin:0 0 1.4rem; max-width:56ch; }
.about-media{ position:relative; }
.about-frame{ position:relative; border-radius:16px; overflow:hidden; border:1px solid rgba(201,162,75,0.28); box-shadow:0 40px 80px -40px rgba(0,0,0,0.85); aspect-ratio:4/3.4; }
.about-frame img{ width:100%; height:100%; object-fit:cover; }
.about-frame::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,10,11,0.15),rgba(10,10,11,0.55)); pointer-events:none; }
.about-frame-line{ position:absolute; inset:10px; border:1px solid rgba(231,207,148,0.35); border-radius:10px; z-index:2; pointer-events:none; }
.about-media-badge{ position:absolute; bottom:-18px; left:24px; z-index:3; display:inline-flex; align-items:center; gap:.5rem; padding:.6rem 1.1rem; border-radius:999px; background:var(--c-ink); border:1px solid var(--c-gold); color:var(--c-gold); font-family:var(--font-mono); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; box-shadow:0 18px 40px -18px rgba(0,0,0,0.8); }

.stats-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; margin-top:6rem; padding-top:3rem; border-top:1px solid rgba(201,162,75,0.16); }
.stat{ text-align:center; padding:0 .5rem; position:relative; }
.stat + .stat::before{ content:""; position:absolute; left:-1rem; top:10%; bottom:10%; width:1px; background:rgba(201,162,75,0.12); }
.stat .num{ font-family:var(--font-display); font-weight:800; font-size:clamp(1.8rem,3vw,2.6rem); line-height:1; color:var(--c-gold); letter-spacing:-0.01em; }
.stat .lbl{ margin-top:.85rem; font-size:.86rem; line-height:1.5; color:rgba(247,243,234,0.6); max-width:22ch; margin-left:auto; margin-right:auto; }
.about-caption{ margin:4.5rem auto 0; max-width:900px; text-align:center; font-family:var(--font-display); font-style:italic; font-weight:400; font-size:clamp(1.05rem,1.6vw,1.4rem); line-height:1.6; color:rgba(247,243,234,0.82); }

@media (max-width:900px){
  .about-grid{ grid-template-columns:1fr; gap:3rem; }
  .about-deco{ display:none; }
  .stats-row{ grid-template-columns:repeat(2,1fr); gap:2.5rem 1rem; }
  .stat:nth-child(3)::before, .stat + .stat::before{ display:none; }
}
@media (max-width:480px){
  .stats-row{ grid-template-columns:1fr; }
}

/* ============================================================== */
/*  3ª DOBRA · O QUE GUIA (Missão / Visão / Valores)             */
/* ============================================================== */
.guia{ position:relative; }
.guia-blueprint{ position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.5;
  background-image:
    repeating-linear-gradient(45deg, rgba(201,162,75,0.05) 0 1px, transparent 1px 60px),
    repeating-linear-gradient(-45deg, rgba(201,162,75,0.04) 0 1px, transparent 1px 90px);
  -webkit-mask-image:radial-gradient(ellipse 70% 70% at 50% 40%, #000, transparent 80%);
          mask-image:radial-gradient(ellipse 70% 70% at 50% 40%, #000, transparent 80%); }
.guia-watermark{ position:absolute; top:2.5rem; left:0; right:0; text-align:center; z-index:0; pointer-events:none;
  font-family:var(--font-display); font-weight:900; font-style:italic; font-size:clamp(4rem,12vw,11rem); line-height:1;
  color:transparent; -webkit-text-stroke:1px rgba(201,162,75,0.06); letter-spacing:-0.02em; user-select:none; }

.guia-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2.5rem; margin-top:3.5rem; }
.guia-card{ position:relative; background:var(--c-carbon); border:1px solid rgba(201,162,75,0.16); border-radius:18px;
  padding:3.75rem 2rem 2.25rem; transition:transform .5s cubic-bezier(0.16,1,0.3,1), border-color .4s, box-shadow .5s; overflow:visible; }
.guia-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:2px; border-radius:18px 18px 0 0; background:var(--gold-foil); opacity:0; transition:opacity .5s ease; }
.guia-card:hover{ transform:translateY(-6px); border-color:rgba(201,162,75,0.5); box-shadow:0 40px 80px -40px rgba(0,0,0,0.85); }
.guia-card:hover::before{ opacity:1; }
.guia-icon{ position:absolute; top:-26px; left:28px; width:60px; height:60px; border-radius:16px;
  background:var(--gold-foil); background-size:200% auto; color:var(--c-ink);
  display:inline-flex; align-items:center; justify-content:center;
  box-shadow:0 16px 34px -12px rgba(201,162,75,0.6), inset 0 0 0 1px rgba(255,255,255,0.25);
  transition:transform .5s cubic-bezier(0.16,1,0.3,1); }
.guia-card:hover .guia-icon{ transform:translateY(-4px) rotate(-6deg); }
.guia-title{ font-family:var(--font-display); font-weight:700; font-size:1.6rem; color:var(--c-cream); text-align:center; margin:.25rem 0 1.25rem; letter-spacing:.01em; }
.guia-text{ color:rgba(247,243,234,0.66); line-height:1.8; font-size:.96rem; margin:0; }

@media (max-width:900px){
  .guia-grid{ grid-template-columns:1fr; gap:3rem; }
}

/* ============================================================== */
/*  4ª DOBRA · ÁREAS DE CONEXÃO (carrossel de flip cards)         */
/* ============================================================== */
.areas-lead{ max-width:64ch; margin:1.5rem 0 0; color:rgba(247,243,234,0.68); line-height:1.8; font-size:1.02rem; }
.areas-hint{ display:inline-flex; align-items:center; gap:.5rem; margin-top:1.75rem; font-family:var(--font-mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--c-gold); opacity:.85; }

.areas-carousel{ position:relative; margin-top:3rem; display:flex; align-items:center; gap:1rem; }
.areas-track{ display:flex; gap:1.5rem; overflow-x:auto; scroll-snap-type:x mandatory; padding:1.75rem 1.5rem 2rem; scroll-padding-left:1.5rem;
  -ms-overflow-style:none; scrollbar-width:none; flex:1; }
.areas-track::-webkit-scrollbar{ display:none; }

.areas-card{ flex:0 0 300px; scroll-snap-align:start; height:420px; perspective:1600px; }
@media (min-width:1280px){ .areas-card{ flex-basis:290px; } }

/* Flip mechanics */
.flip-inner{ position:relative; width:100%; height:100%; transition:transform .9s cubic-bezier(0.16,1,0.3,1); transform-style:preserve-3d; }
.areas-card:hover .flip-inner, .areas-card.is-flipped .flip-inner{ transform:rotateY(180deg); }
.flip-face{ position:absolute; inset:0; -webkit-backface-visibility:hidden; backface-visibility:hidden; border-radius:18px; overflow:hidden; border:1px solid rgba(201,162,75,0.2); }

/* Front */
.flip-front{ background:var(--c-carbon); }
.flip-front img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.85; transition:transform 1.2s cubic-bezier(0.16,1,0.3,1); }
.areas-card:hover .flip-front img{ transform:scale(1.05); }
.flip-front::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(6,6,7,0.15) 0%,rgba(6,6,7,0.35) 45%,rgba(6,6,7,0.92) 100%); }
.flip-front-body{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:1.5rem; }
.areas-index{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.2em; color:var(--c-gold); }
.areas-name{ font-family:var(--font-display); font-weight:700; font-size:1.4rem; line-height:1.2; color:var(--c-cream); margin:.4rem 0 0; }

/* Back */
.flip-back{ background:linear-gradient(155deg,#16130b,#0B0B0C 70%); transform:rotateY(180deg); display:flex; flex-direction:column; justify-content:center; padding:2rem 1.75rem; box-shadow:inset 0 0 0 1px rgba(201,162,75,0.35); }
.flip-back .pinstripe-x{ position:absolute; top:0; left:0; }
.areas-back-tag{ font-family:var(--font-mono); font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--c-gold); margin-bottom:1rem; }
.areas-back-text{ font-family:var(--font-display); font-style:italic; font-size:1.12rem; line-height:1.6; color:rgba(247,243,234,0.9); margin:0; }

/* Arrows */
.areas-arrow{ flex:0 0 auto; width:52px; height:52px; border-radius:50%; background:rgba(255,255,255,0.03); border:1px solid rgba(201,162,75,0.3); color:var(--c-gold); display:inline-flex; align-items:center; justify-content:center; cursor:pointer; transition:all .35s cubic-bezier(0.16,1,0.3,1); }
.areas-arrow:hover{ background:var(--gold-foil); color:var(--c-ink); border-color:transparent; transform:scale(1.08); box-shadow:0 14px 30px -12px rgba(201,162,75,0.6); }
.areas-arrow:disabled{ opacity:.3; cursor:default; pointer-events:none; }

@media (max-width:640px){
  .areas-arrow{ display:none; }
  .areas-card{ flex-basis:78%; height:400px; }
}

/* ============================================================== */
/*  5ª DOBRA · MARCAS CONECTADAS                                  */
/* ============================================================== */
.marcas-lead{ max-width:60ch; margin:1.5rem 0 0; color:rgba(247,243,234,0.68); line-height:1.8; font-size:1.02rem; }
.brand-row{ display:grid; grid-template-columns:0.95fr 1.05fr; gap:4rem; align-items:center; margin-top:5rem; }
.brand-row.reverse .brand-media{ order:2; }
.brand-row.reverse .brand-copy{ order:1; }
.brand-media{ position:relative; }
.brand-frame{ position:relative; border-radius:16px; overflow:hidden; border:1px solid rgba(201,162,75,0.28); box-shadow:0 40px 80px -40px rgba(0,0,0,0.85); aspect-ratio:4/3.2; }
.brand-frame img{ width:100%; height:100%; object-fit:cover; }
.brand-frame::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,10,11,0.1),rgba(10,10,11,0.5)); pointer-events:none; }
.brand-frame-line{ position:absolute; inset:10px; border:1px solid rgba(231,207,148,0.35); border-radius:10px; z-index:2; pointer-events:none; }
.brand-eyebrow{ display:inline-flex; font-family:var(--font-mono); font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:var(--c-gold); margin-bottom:1.1rem; }
.brand-heading{ font-family:var(--font-display); font-weight:700; font-size:clamp(1.5rem,2.4vw,2.1rem); line-height:1.22; color:var(--c-cream); margin:0 0 1.5rem; letter-spacing:-0.01em; }
.brand-p{ color:rgba(247,243,234,0.68); line-height:1.85; font-size:1rem; margin:0 0 1.25rem; }
.brand-copy .btn{ margin-top:.75rem; }

@media (max-width:900px){
  .brand-row{ grid-template-columns:1fr; gap:2.5rem; margin-top:3.5rem; }
  .brand-row.reverse .brand-media{ order:0; }
  .brand-row.reverse .brand-copy{ order:0; }
}

/* ============================================================== */
/*  6ª DOBRA · CONTATO                                            */
/* ============================================================== */
.contato-head{ text-align:center; max-width:760px; margin:0 auto; }
.contato-lead{ margin:1.5rem auto 0; color:rgba(247,243,234,0.68); line-height:1.8; font-size:1.02rem; }
.contact-card{ position:relative; max-width:880px; margin:3.5rem auto 0; background:var(--c-carbon); border:1px solid rgba(201,162,75,0.28); border-radius:20px; padding:3rem clamp(1.5rem,4vw,3.25rem) 3rem; overflow:hidden; box-shadow:0 50px 100px -50px rgba(0,0,0,0.9); }
.contact-card .pinstripe-x{ position:absolute; top:0; left:0; }
.contact-caption{ text-align:center; max-width:520px; margin:0 auto 2.5rem; color:rgba(247,243,234,0.62); line-height:1.65; font-size:.98rem; }
.contact-form{ display:flex; flex-direction:column; gap:1.5rem; }
.contact-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.field{ display:flex; flex-direction:column; gap:.55rem; }
.contact-submit{ display:flex; flex-direction:column; align-items:center; gap:1rem; margin-top:.75rem; }
.contact-feedback{ font-family:var(--font-mono); font-size:.78rem; letter-spacing:.04em; margin:0; }
.contact-feedback.ok{ color:var(--c-success); }
.contact-feedback.err{ color:var(--c-danger); }

@media (max-width:640px){
  .contact-grid-2{ grid-template-columns:1fr; }
  .contact-card{ padding:2.25rem 1.35rem; }
}

/* ============================================================== */
/*  7ª DOBRA · RODAPÉ                                             */
/* ============================================================== */
.footer{ position:relative; z-index:20; background:linear-gradient(180deg,#08080A 0%,#060607 100%); padding:0 0 2.5rem; }

/* Barra de contato flutuante (sobrepõe o topo do rodapé) */
.footer-contactbar{ position:relative; z-index:3; display:grid; grid-template-columns:1fr auto 1fr; align-items:center;
  gap:1rem; background:var(--c-carbon); border:1px solid rgba(201,162,75,0.3); border-radius:18px;
  padding:1.75rem 2.5rem; margin-top:-70px; box-shadow:0 40px 90px -40px rgba(0,0,0,0.9); }
.fc-item{ display:flex; align-items:center; gap:1.1rem; transition:transform .35s cubic-bezier(0.16,1,0.3,1); }
.fc-item:hover{ transform:translateY(-2px); }
.fc-icon{ flex:0 0 auto; width:56px; height:56px; border-radius:50%; background:linear-gradient(150deg,rgba(201,162,75,0.18),rgba(201,162,75,0.04));
  border:1px solid rgba(201,162,75,0.35); color:var(--c-gold); display:inline-flex; align-items:center; justify-content:center; transition:all .4s cubic-bezier(0.16,1,0.3,1); }
.fc-item:hover .fc-icon{ background:var(--gold-foil); color:var(--c-ink); box-shadow:0 12px 26px -10px rgba(201,162,75,0.6); }
.fc-body{ display:flex; flex-direction:column; gap:.3rem; }
.fc-label{ font-family:var(--font-mono); font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--c-gold); }
.fc-value{ font-family:var(--font-display); font-size:1.15rem; color:var(--c-cream); display:inline-flex; align-items:center; gap:.35rem; }
.fc-value iconify-icon{ color:var(--c-gold); transition:transform .35s cubic-bezier(0.16,1,0.3,1); }
.fc-item:hover .fc-value iconify-icon{ transform:translate(2px,-2px); }
.fc-divider{ width:1px; align-self:stretch; background:rgba(201,162,75,0.18); }

/* Corpo */
.footer-main{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:3rem; padding-top:4.5rem; align-items:start; }
.footer-brand .logo-word{ font-family:var(--font-display); font-weight:700; font-style:italic; color:var(--c-cream); }
.footer-copy{ margin:1.25rem 0 0; max-width:36ch; color:rgba(247,243,234,0.5); font-size:.9rem; line-height:1.7; }
.footer-nav-title{ display:block; font-family:var(--font-mono); font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--c-gold); margin-bottom:1.35rem; }
.footer-nav{ display:flex; flex-direction:column; gap:.9rem; }
.footer-nav a{ color:rgba(247,243,234,0.68); font-size:.95rem; width:fit-content; position:relative; transition:color .3s ease, padding-left .3s ease; }
.footer-nav a::before{ content:""; position:absolute; left:0; top:50%; width:0; height:1px; background:var(--c-gold); transition:width .3s ease; }
.footer-nav a:hover{ color:var(--c-gold); padding-left:18px; }
.footer-nav a:hover::before{ width:12px; }
.footer-cta{ display:flex; flex-direction:column; align-items:flex-start; }
.footer-wpp{ gap:.55rem; }

.footer-bottom{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; margin-top:1.5rem;
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.04em; color:var(--c-graphite-500); }
.footer-made{ color:var(--c-gold); opacity:.7; }

@media (max-width:900px){
  .footer-contactbar{ grid-template-columns:1fr; gap:1.5rem; padding:1.75rem; }
  .fc-divider{ width:100%; height:1px; }
  .footer-main{ grid-template-columns:1fr; gap:2.5rem; padding-top:3.5rem; }
}

/* ============================================================== */
/*  IMG ZOOM (util)                                               */
/* ============================================================== */
.img-zoom{ overflow:hidden; }
.img-zoom img{ transition:transform 1.4s cubic-bezier(0.16,1,0.3,1),filter 1s; }
.img-zoom:hover img{ transform:scale(1.06); filter:saturate(1.08) contrast(1.04); }

/* ============================================================== */
/*  RESPONSIVE                                                     */
/* ============================================================== */
@media (max-width:1024px){
  .nav-links{ display:none; }
  .nav-burger{ display:inline-flex; }
}
@media (max-width:640px){
  .hero-meta{ gap:1.5rem; }
  .hero-meta .divider{ display:none; }
  .hero-cta{ flex-direction:column; align-items:flex-start; }
  .hero-cta .btn{ width:100%; }
  .lang-toggle .lang-label{ display:none; }
  .section{ padding:4.5rem 0; }
}

/* ===================================================================== */
/* Vindo do <style> inline do index.html original                         */
/* ===================================================================== */

/* ---- Hero: vídeo de fundo (mescla das duas marcas) ---- */
.hero-bg video.hero-video{
  width:100%; height:100%; object-fit:cover; opacity:.92;
  transform:scale(1.05); animation:hero-zoom 18s ease-out forwards;
}
.hero-bg video.hero-video img{ width:100%; height:100%; object-fit:cover; }

/* Fade inferior reforçado — cobre a marca d'água do gerador de vídeo
   e funde o topo com a seção seguinte. Sobrescreve o .hero::after acima. */
.hero::after{
  height:42vh; min-height:340px;
  background:linear-gradient(180deg,
    rgba(11,11,12,0)    0%,
    rgba(11,11,12,0.08) 20%,
    rgba(11,11,12,0.22) 40%,
    rgba(11,11,12,0.45) 60%,
    rgba(11,11,12,0.72) 80%,
    rgba(11,11,12,0.92) 94%,
    #0B0B0C             100%);
}

@media (prefers-reduced-motion: reduce){
  .hero-bg video.hero-video{ animation:none; transform:none; }
}

/* Mobile nav overlay */
@media (max-width:1024px){
  #navLinks.mobile-open{ display:flex; position:fixed; inset:76px 0 0; flex-direction:column; align-items:center; justify-content:center; gap:2rem;
    background:rgba(8,8,9,0.97); backdrop-filter:blur(20px); z-index:99; }
  #navLinks.mobile-open a{ font-size:1.4rem; font-family:var(--font-display); font-style:italic; color:var(--c-cream); }
}

/* Logo enviada pelo painel (substitui a marca textual) */
.nav-logo .logo-img{ height:34px; width:auto; display:block; }
.footer-logo{ display:inline-block; }
.footer-brand .logo-img{ height:40px; width:auto; display:block; margin-bottom:1rem; }