/* Unscarred brand hub skin
   Based on the live Netlify membership skin:
   dark ritual shell, gold sigil, Cormorant display type, mono labels, sharp buttons. */

:root{
  --bg:#08060a;
  --bg-1:#0d0a10;
  --bg-2:#15101a;
  --bg-3:#1a121f;
  --ink:#f3ead6;
  --ink-mute:#a89b7d;
  --ink-dim:#6b6253;
  --line:#231b24;
  --line-soft:#1a1418;
  --gold:#d8b366;
  --gold-bright:#e9c878;
  --gold-deep:#8a6b30;
  --gold-faint:rgba(216,179,102,.18);
  --purple:#8a5fc2;
  --purple-deep:#3a2554;
  --serif:'Cormorant Garamond','Times New Roman',serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --sans:'Inter',system-ui,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html,body{
  margin:0;
  padding:0!important;
  background:var(--bg)!important;
  color:var(--ink)!important;
  font-family:var(--sans)!important;
  font-weight:300;
  -webkit-font-smoothing:antialiased;
  line-height:1.55;
}
body.global-nav{padding-top:0!important}
a{color:inherit;text-decoration:none}
main{position:relative;z-index:1;background:var(--bg)}

body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 78% 20%, rgba(216,179,102,.13), transparent 36%),
    radial-gradient(circle at 18% 82%, rgba(138,95,194,.11), transparent 46%),
    linear-gradient(180deg, rgba(8,6,10,.2), rgba(8,6,10,.92));
}

.mesh,.bg-glow{display:none!important}

.wrap{
  width:auto!important;
  max-width:1440px!important;
  margin:0 auto!important;
  padding:0 48px!important;
  position:relative;
  z-index:1;
}

.hero{
  position:relative;
  min-height:780px!important;
  overflow:hidden;
  display:flex!important;
  align-items:center!important;
  padding:92px 0 70px!important;
  border-bottom:1px solid var(--line-soft);
  background:
    radial-gradient(circle at 80% 50%, rgba(216,179,102,.16), transparent 50%),
    radial-gradient(circle at 15% 90%, rgba(138,95,194,.13), transparent 60%),
    #000;
}

.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(8,6,10,.94) 0%, rgba(8,6,10,.65) 48%, rgba(8,6,10,.18) 100%),
    radial-gradient(circle at 72% 48%, transparent 0 92px, rgba(216,179,102,.42) 93px 94px, transparent 95px 155px, rgba(216,179,102,.24) 156px 157px, transparent 158px 245px, rgba(216,179,102,.16) 246px 247px, transparent 248px);
  pointer-events:none;
}

.hero::after{
  content:"UN\00a0\00b7\00a0SCARRED";
  position:absolute;
  right:clamp(28px,8vw,140px);
  top:50%;
  transform:translateY(-50%);
  width:330px;
  height:330px;
  border:1px solid rgba(216,179,102,.45);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:rgba(243,234,214,.68);
  font-family:var(--serif);
  font-style:italic;
  font-size:26px;
  letter-spacing:.32em;
  text-align:center;
  box-shadow:
    inset 0 0 0 70px rgba(8,6,10,.34),
    inset 0 0 0 71px rgba(216,179,102,.56),
    0 0 80px rgba(216,179,102,.08);
  pointer-events:none;
}

h1,h2,h3{font-family:var(--serif)!important;color:var(--ink);letter-spacing:-.01em!important}
h1{
  max-width:780px!important;
  margin:36px 0 32px!important;
  font-weight:400!important;
  font-size:clamp(56px,7.2vw,104px)!important;
  line-height:.96!important;
}
h1 em,.gold{font-style:italic;color:var(--gold);font-weight:500}

.eyebrow{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  margin:0!important;
  font-family:var(--mono)!important;
  font-size:11px!important;
  letter-spacing:.28em!important;
  text-transform:uppercase!important;
  color:var(--ink-mute)!important;
  font-weight:400!important;
}
.eyebrow::before{
  content:"";
  width:28px;
  height:1px;
  background:var(--gold);
  flex:0 0 auto;
}

.lead{
  font-family:var(--serif)!important;
  font-size:23px!important;
  line-height:1.45!important;
  color:#cdc1a3!important;
  max-width:540px!important;
  margin:0 0 40px!important;
  font-weight:400;
}

.actions{
  display:flex!important;
  gap:14px!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  margin-top:0!important;
}
.btn{
  display:inline-flex!important;
  align-items:center!important;
  gap:12px!important;
  min-height:auto!important;
  padding:18px 30px!important;
  border-radius:2px!important;
  font-family:var(--mono)!important;
  font-size:11px!important;
  letter-spacing:.28em!important;
  text-transform:uppercase!important;
  transition:all .2s ease!important;
  cursor:pointer;
  text-decoration:none!important;
  border:0!important;
  font-weight:400!important;
}
.btn.primary,.btn-primary{
  background:linear-gradient(180deg,#e9c878,#b8893f)!important;
  color:#1a1206!important;
  border:1px solid var(--gold-bright)!important;
  box-shadow:0 0 0 1px rgba(216,179,102,.2),0 12px 40px -10px rgba(216,179,102,.4)!important;
}
.btn.primary:hover,.btn-primary:hover{
  transform:translateY(-1px);
  box-shadow:0 0 0 1px rgba(216,179,102,.4),0 18px 48px -10px rgba(216,179,102,.6)!important;
}
.btn:not(.primary):not(.btn-primary){
  background:transparent!important;
  color:var(--ink)!important;
  border:1px solid var(--line)!important;
}
.btn:not(.primary):not(.btn-primary):hover{
  border-color:var(--gold)!important;
  color:var(--gold)!important;
}

.section{
  position:relative;
  padding:124px 0!important;
  border-top:0!important;
  border-bottom:1px solid var(--line-soft);
  background:var(--bg);
}
.section:nth-of-type(even){
  background:linear-gradient(180deg,var(--bg-1),var(--bg));
}
.section-head{
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  gap:32px!important;
  align-items:end!important;
  margin-bottom:64px!important;
}
.section-head::before{
  content:"";
  font-family:var(--serif);
  font-style:italic;
  color:var(--gold);
  font-size:18px;
  align-self:start;
}
.section:nth-of-type(2) .section-head::before{content:"01"}
.section:nth-of-type(3) .section-head::before{content:"02"}
.section:nth-of-type(4) .section-head::before{content:"03"}
.section-head h2{
  font-family:var(--serif)!important;
  font-weight:500!important;
  font-size:clamp(40px,5vw,72px)!important;
  line-height:1!important;
  letter-spacing:-.005em!important;
  margin:0!important;
}
.section-head h2 em{font-style:italic;color:var(--gold)}
.section-head p{
  font-family:var(--mono)!important;
  font-size:10px!important;
  letter-spacing:.22em!important;
  color:var(--ink-mute)!important;
  text-transform:uppercase!important;
  text-align:right!important;
  max-width:360px!important;
  line-height:1.65!important;
  margin:0!important;
}

.grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:1px!important;
  background:var(--line);
  border:1px solid var(--line);
}
.card{
  min-height:300px!important;
  padding:34px!important;
  border:0!important;
  border-radius:0!important;
  background:linear-gradient(180deg,var(--bg-2),#0b080d)!important;
  text-decoration:none!important;
  color:inherit!important;
  display:flex!important;
  flex-direction:column!important;
  position:relative;
  overflow:hidden;
  transition:background .2s ease,transform .2s ease!important;
}
.card:hover{
  background:linear-gradient(180deg,#1d1422,#0d090f)!important;
  transform:none!important;
}
.card::after{
  content:"";
  position:absolute;
  right:28px;
  bottom:26px;
  width:42px;
  height:42px;
  border:1px solid var(--gold-deep);
  border-radius:50%;
  opacity:.45;
}
.card small{
  display:block!important;
  margin:0 0 22px!important;
  font-family:var(--mono)!important;
  font-size:10px!important;
  letter-spacing:.24em!important;
  color:var(--gold)!important;
  text-transform:uppercase!important;
  font-weight:400!important;
}
.card strong{
  display:block!important;
  font-family:var(--serif)!important;
  font-size:30px!important;
  font-weight:500!important;
  line-height:1.08!important;
  color:var(--ink)!important;
  margin:0 0 16px!important;
}
.card span{
  display:block!important;
  color:var(--ink-mute)!important;
  font-size:15px!important;
  line-height:1.65!important;
  max-width:34ch;
}
.wide-card{grid-column:span 2!important}
.wide-card strong{font-size:38px!important;max-width:16ch}

.strip{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:1px!important;
  border:1px solid var(--line)!important;
  background:var(--line)!important;
  border-radius:0!important;
  overflow:visible!important;
}
.strip a,.path{
  display:grid!important;
  gap:10px!important;
  padding:28px 30px!important;
  border:0!important;
  border-radius:0!important;
  background:var(--bg-2)!important;
  color:var(--ink-mute)!important;
  text-decoration:none!important;
  margin:0!important;
  transition:background .2s ease,color .2s ease!important;
}
.path{grid-template-columns:170px 1fr auto!important;align-items:center;border-bottom:1px solid var(--line)!important}
.strip a:hover,.path:hover{background:#1d1422!important;color:var(--ink)!important}
.strip strong,.path strong{
  display:block!important;
  font-family:var(--serif)!important;
  font-size:24px!important;
  font-weight:500!important;
  color:var(--ink)!important;
  line-height:1.1!important;
}
.path b{
  font-family:var(--mono)!important;
  font-size:10px!important;
  letter-spacing:.24em!important;
  color:var(--gold)!important;
  text-transform:uppercase!important;
  font-weight:400!important;
}
.path span{color:var(--ink-mute)!important;font-size:14px!important}

.cta{
  position:relative;
  overflow:hidden;
  padding:72px!important;
  border-radius:0!important;
  border:1px solid var(--gold-deep)!important;
  background:radial-gradient(ellipse at 50% 30%,#1a0e26 0%,#08060a 62%)!important;
  text-align:center;
}
.cta::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:560px;
  height:560px;
  border:1px solid var(--gold-deep);
  border-radius:50%;
  opacity:.16;
  pointer-events:none;
}
.cta h2{
  position:relative;
  font-family:var(--serif)!important;
  font-weight:500!important;
  font-size:clamp(44px,5.5vw,78px)!important;
  line-height:.98!important;
  margin:0 0 22px!important;
}
.cta p{
  position:relative;
  font-family:var(--serif)!important;
  font-size:22px!important;
  line-height:1.5!important;
  color:#cdc1a3!important;
  max-width:760px!important;
  margin:0 auto 36px!important;
}
.cta .actions{justify-content:center!important}

@media(max-width:980px){
  .wrap{padding:0 24px!important}
  .hero{min-height:auto!important;padding:120px 0 84px!important}
  .hero::after{display:none}
  h1{font-size:clamp(54px,14vw,78px)!important}
  .section{padding:88px 0!important}
  .section-head{grid-template-columns:1fr!important;gap:16px!important}
  .section-head p{text-align:left!important;max-width:560px!important}
  .grid,.strip{grid-template-columns:1fr!important}
  .wide-card{grid-column:auto!important}
  .path{grid-template-columns:1fr!important}
  .cta{padding:44px 24px!important}
}

@media(max-width:560px){
  .actions{flex-direction:column!important;align-items:stretch!important}
  .btn{width:100%;justify-content:center!important}
  .card{min-height:auto!important;padding:28px!important}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation:none!important;transition:none!important}
}