/* ============================================================
   AETHERCORE LABS — Design System
   White marble · soft gold · engraved serif · ancient↔future
   ============================================================ */

:root{
  /* Marble */
  --marble-0:#FBFAF6;
  --marble-1:#F8F6F1;
  --marble-2:#F2EFE9;
  --marble-3:#EAE6DE;
  --marble-4:#E1DCD2;
  --accent:#F9F9F9;

  /* Gold (tweakable) */
  --gold:#C9A227;
  --gold-bright:#D4AF37;
  --gold-pale:#E7D49B;
  --gold-deep:#A8821B;

  /* Ink */
  --ink:#1A1A1A;
  --ink-2:#4B4B4B;
  --ink-3:#7C766B;
  --hair:rgba(26,26,26,0.10);
  --hair-2:rgba(26,26,26,0.06);

  /* Type */
  --serif:'Cormorant Garamond', 'Playfair Display', serif;
  --display:'Cinzel', 'Playfair Display', serif;
  --body:'Inter', system-ui, sans-serif;
  --num:'Space Grotesk', monospace;

  /* Motion */
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-soft:cubic-bezier(.4,0,.2,1);
  --motion:1; /* tweakable multiplier 0..1.4 */

  --maxw:1240px;
}

*{box-sizing:border-box}
html{scroll-behavior:auto;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{
  margin:0;
  font-family:var(--body);
  color:var(--ink);
  background:var(--marble-1);
  overflow-x:hidden;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
::selection{background:rgba(201,162,39,0.22);color:var(--ink)}

/* ---- Marble surfaces ---- */
.marble{
  position:relative;
  background:
    radial-gradient(120% 90% at 20% 0%, #FFFFFF 0%, rgba(255,255,255,0) 55%),
    radial-gradient(100% 80% at 85% 30%, #FCFBF8 0%, rgba(252,251,248,0) 60%),
    linear-gradient(180deg, var(--marble-1), var(--marble-2));
}
.marble-deep{
  background:
    radial-gradient(110% 90% at 80% 10%, #FFFFFF 0%, rgba(255,255,255,0) 50%),
    linear-gradient(180deg, var(--marble-2), var(--marble-3));
}
/* faint veining overlay */
.veined::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  opacity:.5;mix-blend-mode:multiply;
  background-image:
    radial-gradient(closest-side at 12% 30%, rgba(150,140,120,.05), transparent 70%),
    radial-gradient(closest-side at 75% 65%, rgba(150,140,120,.045), transparent 70%);
  background-size: 60% 80%, 70% 90%;
}
.grain::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---- Layout ---- */
.section{position:relative;padding:clamp(96px,12vw,180px) 0;z-index:1}
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 32px;position:relative;z-index:2}
.wrap-wide{max-width:1480px}

/* ---- Typography ---- */
.kicker{
  font-family:var(--body);
  font-size:12px;font-weight:500;letter-spacing:.42em;text-transform:uppercase;
  color:var(--gold-deep);
  display:inline-flex;align-items:center;gap:.9em;
}
.kicker::before{content:"";width:26px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.kicker.center::after{content:"";width:26px;height:1px;background:linear-gradient(90deg,var(--gold),transparent)}

.display{
  font-family:var(--display);
  font-weight:500;
  line-height:1.08;
  letter-spacing:.012em;
  color:var(--ink);
}
/* Cinzel has no true italic; keep gilded emphasis upright, not synthesized-oblique */
.display .italic, .greek .italic, .display.italic, .greek.italic{font-style:normal}
.h-xl{font-size:clamp(46px,7vw,104px)}
.h-lg{font-size:clamp(38px,5.2vw,76px)}
.h-md{font-size:clamp(30px,3.6vw,52px)}
.serif-lead{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(22px,2.5vw,34px);
  line-height:1.32;
  color:var(--ink-2);
  letter-spacing:.002em;
}
.body{font-size:clamp(15px,1.1vw,18px);line-height:1.72;color:var(--ink-2);font-weight:400}
.italic{font-style:italic}

/* All eyebrow labels in Greek inscription style */
.kicker{font-family:'Cinzel', var(--body); font-weight:600; letter-spacing:.34em}

/* Ancient inscription style (Greek/Roman capitals) */
.greek{font-family:'Cinzel', var(--display); font-weight:600; letter-spacing:.04em; line-height:1.12; color:var(--ink);}
.greek .gild{font-family:inherit}
span.kicker.greek{font-family:'Cinzel', var(--body); font-weight:600; letter-spacing:.3em;}

/* Engraved text (debossed into marble) */
.engrave{
  color:transparent;
  background:linear-gradient(180deg,#cdc7ba,#efe9dd 40%, #d8d2c4);
  -webkit-background-clip:text;background-clip:text;
  text-shadow:0 1px 0 rgba(255,255,255,.7), 0 -1px 1px rgba(120,110,90,.35);
}
/* Gilded text */
.gild{
  color:transparent;
  background:linear-gradient(180deg,var(--gold-pale) 0%, var(--gold-bright) 38%, var(--gold) 60%, var(--gold-deep) 100%);
  -webkit-background-clip:text;background-clip:text;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.55));
}

/* Hairline divider with gold spark */
.rule{display:flex;align-items:center;justify-content:center;gap:14px;color:var(--gold)}
.rule .line{height:1px;width:min(220px,30vw);background:linear-gradient(90deg,transparent,var(--gold))}
.rule .line.r{background:linear-gradient(90deg,var(--gold),transparent)}
.spark{width:14px;height:14px;flex:none;color:var(--gold)}
.spark svg{width:100%;height:100%;display:block}

/* ---- Buttons ---- */
.btn{
  --bx:0;--by:0;
  position:relative;display:inline-flex;align-items:center;gap:.6em;
  font-family:var(--body);font-size:14px;font-weight:500;letter-spacing:.02em;
  padding:15px 30px;border-radius:999px;cursor:pointer;border:none;
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), background .4s;
  transform:translate(var(--bx),var(--by));
  white-space:nowrap;
}
.btn-gold{
  background:linear-gradient(180deg,var(--gold-bright),var(--gold));
  color:#fff;
  box-shadow:0 8px 24px -10px rgba(168,130,27,.7), inset 0 1px 0 rgba(255,255,255,.4);
}
.btn-gold:hover{box-shadow:0 14px 40px -10px rgba(168,130,27,.85), inset 0 1px 0 rgba(255,255,255,.5)}
.btn-ghost{
  background:rgba(255,255,255,.5);
  color:var(--ink);
  box-shadow:inset 0 0 0 1px var(--hair), 0 6px 18px -12px rgba(0,0,0,.3);
  backdrop-filter:blur(8px);
}
.btn-ghost:hover{box-shadow:inset 0 0 0 1px rgba(201,162,39,.55), 0 10px 26px -14px rgba(0,0,0,.35)}
.btn-dark{
  background:rgba(255,255,255,.08);color:#fff;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.28);
  backdrop-filter:blur(10px);
}
.btn-dark:hover{background:rgba(255,255,255,.16)}
.btn .arr{transition:transform .5s var(--ease)}
.btn:hover .arr{transform:translateX(4px)}

/* ---- Glass card ---- */
.glass{
  background:rgba(255,255,255,.55);
  backdrop-filter:blur(14px) saturate(1.1);
  -webkit-backdrop-filter:blur(14px) saturate(1.1);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7), 0 24px 60px -34px rgba(60,52,36,.5);
  border:1px solid rgba(255,255,255,.6);
}
.card-marble{
  position:relative;overflow:hidden;
  background:linear-gradient(180deg,#fff,var(--marble-2));
  border:1px solid var(--hair-2);
  box-shadow:0 30px 60px -40px rgba(60,52,36,.45), inset 0 1px 0 #fff;
  transition:transform .6s var(--ease), box-shadow .6s var(--ease);
}
.card-marble:hover{transform:translateY(-6px);box-shadow:0 44px 80px -42px rgba(60,52,36,.55), inset 0 1px 0 #fff}

/* ---- Reveal / motion utilities ---- */
.reveal{opacity:0;transform:translateY(calc(34px * var(--motion)));transition:opacity calc(1.1s * var(--motion) + .15s) var(--ease), transform calc(1.1s * var(--motion) + .15s) var(--ease), letter-spacing calc(1.1s * var(--motion) + .15s) var(--ease), filter calc(1.1s * var(--motion) + .15s) var(--ease)}
.reveal.r-left{transform:translateX(calc(-46px * var(--motion)))}
.reveal.r-right{transform:translateX(calc(46px * var(--motion)))}
.reveal.r-scale{transform:scale(calc(1 - .06*var(--motion)))}
.reveal.r-blur{filter:blur(calc(10px * var(--motion)))}
/* Greek headings carry a touch more inscriptional tracking */
.display:not(.kicker),.greek:not(.kicker){letter-spacing:.03em}
.reveal.is-in{opacity:1;transform:none;filter:none}

@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1!important;transform:none!important;filter:none!important;transition:none}
}

/* float keyframes */
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
@keyframes floaty-2{0%,100%{transform:translateY(0)}50%{transform:translateY(-26px)}}
@keyframes spin-slow{to{transform:rotate(360deg)}}
@keyframes spin-rev{to{transform:rotate(-360deg)}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
@keyframes pulse-gold{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes draw{to{stroke-dashoffset:0}}

.float{animation:floaty 7s var(--ease-soft) infinite}
.float-2{animation:floaty-2 9s var(--ease-soft) infinite}

/* Number / counter */
.stat-num{font-family:var(--num);font-weight:500;font-variant-numeric:tabular-nums;letter-spacing:-.02em}

/* utility */
.center{text-align:center}
.mx-auto{margin-left:auto;margin-right:auto}
.eyebrow-row{display:flex;justify-content:center}
.fadeup-delay-1{transition-delay:.12s}
.fadeup-delay-2{transition-delay:.24s}
.fadeup-delay-3{transition-delay:.36s}
.fadeup-delay-4{transition-delay:.48s}
.fadeup-delay-5{transition-delay:.6s}

/* scrollbar */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--marble-2)}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--gold),var(--gold-deep));border-radius:10px;border:2px solid var(--marble-2)}

/* loading splash */
#splash{position:fixed;inset:0;z-index:9999;background:var(--marble-1);display:flex;align-items:center;justify-content:center;transition:opacity .8s ease, visibility .8s;animation:splashOut .7s ease 1.4s forwards}
#splash.gone{opacity:0;visibility:hidden}
@keyframes splashOut{to{opacity:0;visibility:hidden}}