:root{
  color-scheme:dark;
  --gold:#c9aa6f;
  --ivory:#ebe2cf;
  --muted:#aaa79f;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#020304}
body{
  min-height:100vh;
  overflow-x:hidden;
  color:var(--ivory);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}
a{color:inherit;text-decoration:none}

/* Exact v08.6 landing-page scene treatment, held at its final revealed state. */
.background{position:fixed;inset:0;overflow:hidden;z-index:0;background:#020304;pointer-events:none}
.scene-stage{
  position:absolute;left:50%;top:50%;
  width:max(100vw,calc(100vh * 1.7768331562));
  height:max(100vh,calc(100vw / 1.7768331562));
  transform:translate(-50%,-50%);
  overflow:hidden;
}
.space-bg{
  position:absolute;inset:0;
  background:url("assets/cosmic-background.webp") center/100% 100% no-repeat;
  filter:brightness(1) contrast(1.02) saturate(.86);
  transform:scale(1.004);
  transform-origin:center;
}
.flare,.sunrise-haze{
  position:absolute;
  left:23.20574163%;
  top:52.39107333%;
  pointer-events:none;
  mix-blend-mode:screen;
}
.sunrise-haze{z-index:4;opacity:.18}
.sunrise-haze-wide{
  width:860px;height:620px;
  transform:translate(-42%,-48%) scale(1.05);
  background:radial-gradient(ellipse at 18% 50%,rgba(248,223,168,.12) 0%,rgba(214,170,88,.05) 15%,rgba(114,89,49,.08) 31%,rgba(27,24,22,.03) 48%,transparent 68%);
  filter:blur(6px);
}
.sunrise-haze-local{
  width:420px;height:420px;
  transform:translate(-50%,-50%) scale(1.32);
  background:radial-gradient(circle,rgba(255,247,228,.11) 0%,rgba(240,204,133,.05) 16%,rgba(189,139,58,.07) 34%,transparent 62%);
}
.flare{z-index:7;opacity:.52}
.flare-core{
  width:250px;height:250px;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(255,255,250,1) 0 1.1%,rgba(255,248,226,1) 2.2%,rgba(249,221,165,.78) 4.7%,rgba(224,181,99,.34) 11%,rgba(193,140,55,.11) 25%,transparent 58%);
  filter:blur(.12px);
}
.flare-core::after{
  content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;transform:translate(-50%,-50%);background:#fffdf4;
  box-shadow:0 0 10px 4px rgba(255,252,238,1),0 0 30px 10px rgba(245,213,151,.82),0 0 68px 22px rgba(214,166,80,.36);
}
.flare-beam-left{
  width:27%;height:1px;right:0;left:auto;transform:translateY(-50%);transform-origin:right center;
  background:linear-gradient(90deg,transparent 0%,rgba(200,154,75,.03) 30%,rgba(240,208,149,.13) 70%,rgba(255,249,230,.56) 100%);
  box-shadow:0 0 7px rgba(234,196,124,.14);
}
.flare-beam-right{
  width:2.1%;height:1px;left:0;transform:translateY(-50%);transform-origin:left center;
  background:linear-gradient(90deg,rgba(255,249,230,.42),rgba(231,190,112,.12) 48%,transparent 100%);
  box-shadow:0 0 5px rgba(234,196,124,.11);
}
.flare-vertical{
  width:1px;height:132px;transform:translate(-50%,-50%);
  background:linear-gradient(180deg,transparent,rgba(240,209,151,.08),rgba(255,248,224,.40),rgba(235,197,126,.07),transparent);
}
.stars{
  position:absolute;inset:0;z-index:1;opacity:.17;
  background-image:radial-gradient(circle,rgba(255,245,220,.55) 0 1px,transparent 1.2px),radial-gradient(circle,rgba(226,183,105,.32) 0 .7px,transparent 1px);
  background-size:171px 163px,251px 229px;background-position:29px 47px,101px 73px;
}
.dark-veil{
  position:absolute;inset:0;z-index:8;
  background:radial-gradient(ellipse at 24% 34%,rgba(0,0,0,.50) 0%,rgba(0,0,0,.72) 38%,rgba(0,0,0,.88) 68%,rgba(0,0,0,.97) 100%),linear-gradient(180deg,rgba(0,0,0,.76),rgba(0,0,0,.84));
  opacity:.20;
}
.vignette{
  position:absolute;inset:0;
  background:radial-gradient(ellipse at 50% 44%,transparent 40%,rgba(0,0,0,.24) 74%,rgba(0,0,0,.64) 100%),linear-gradient(180deg,rgba(0,0,0,.10),transparent 62%,rgba(0,0,0,.60));
}
.grain{
  position:absolute;inset:-50%;opacity:.02;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E");
}

.topbar{
  position:fixed;z-index:20;left:0;right:0;top:0;height:92px;
  padding:0 clamp(35px,3vw,58px);
  display:flex;align-items:center;justify-content:space-between;
  background:linear-gradient(180deg,rgba(2,3,4,.42),transparent);
}
.brand{display:flex;align-items:center;gap:15px;color:#d0b477;font-size:11px;font-weight:600;letter-spacing:.34em}
.w-mark{width:34px;height:34px;display:block;object-fit:contain}
.home-link{
  display:flex;align-items:center;gap:10px;
  color:rgba(208,180,119,.68);font-size:10px;font-weight:600;letter-spacing:.27em;
  transition:color .2s ease,transform .2s ease;
}
.home-arrow{font-size:16px;line-height:1;transform:translateY(-1px)}
.home-link:hover,.home-link:focus-visible{color:#d8bd84;transform:translateX(-2px);outline:none}

.shell{
  position:relative;z-index:5;
  width:min(1180px,calc(100% - 64px));
  min-height:calc(100vh - 92px);
  margin:0 auto;
  padding:138px 0 120px;
}
.hero{text-align:center;margin:0 auto 52px;animation:fadeUp .55s ease-out both}
.eyebrow{margin:0 0 13px;color:rgba(201,170,111,.48);font-size:9px;font-weight:600;letter-spacing:.52em;text-indent:.52em}
.hero h1{
  margin:0;color:#eee8dc;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(54px,7vw,86px);font-weight:400;line-height:.95;
  letter-spacing:.20em;text-indent:.20em;
  text-shadow:0 0 26px rgba(201,170,111,.08);
}
.divider{display:flex;align-items:center;justify-content:center;gap:11px;margin:25px auto 18px}
.divider span,.footer-diamond span{display:block;width:46px;height:1px;background:linear-gradient(90deg,transparent,rgba(194,160,96,.56))}
.divider span:last-child,.footer-diamond span:last-child{transform:scaleX(-1)}
.divider i,.footer-diamond i{width:7px;height:7px;background:#bea169;transform:rotate(45deg);display:block}
.subtitle{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:16px;letter-spacing:.095em;color:rgba(215,211,203,.62)}

.tools-section{animation:fadeUp .62s ease-out .08s both}
.tools-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,340px));
  justify-content:center;
  gap:28px;
}
.tool-card{
  text-decoration:none;
  color:inherit;
  --accent:#6dc8ad;
  position:relative;
  min-height:446px;
  overflow:hidden;
  border-radius:10px;
  isolation:isolate;
  border:1px solid rgba(226,222,211,.30);
  background:linear-gradient(180deg,rgba(9,11,14,.56),rgba(3,4,6,.94));
  box-shadow:
    inset 0 1px rgba(255,255,255,.035),
    0 18px 46px rgba(0,0,0,.38),
    0 0 28px color-mix(in srgb,var(--accent) 13%,transparent),
    0 0 72px color-mix(in srgb,var(--accent) 5%,transparent);
  transition:transform .28s cubic-bezier(.2,.8,.2,1),border-color .28s,box-shadow .28s;
}
.tool-card::before{
  content:"";position:absolute;inset:-1px;z-index:6;border-radius:inherit;padding:1px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 43%,white 8%),rgba(255,255,255,.13) 27%,transparent 52%,color-mix(in srgb,var(--accent) 28%,transparent));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.82;
}
.card-art{
  position:absolute;inset:0;z-index:0;
  background-image:var(--art);
  background-size:cover;
  background-position:center center;
  filter:saturate(.95) brightness(.84) contrast(1.08);
  transition:transform .42s ease,filter .42s ease;
}
.card-mask{
  position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(180deg,rgba(2,4,6,.93) 0%,rgba(3,5,7,.72) 23%,rgba(3,5,7,.20) 53%,rgba(2,3,4,.30) 72%,rgba(2,3,4,.91) 100%),
    radial-gradient(circle at 50% 52%,transparent 24%,rgba(0,0,0,.20) 100%);
}
.edge-glow{position:absolute;z-index:2;left:8%;right:8%;bottom:-23px;height:68px;border-radius:50%;background:var(--accent);filter:blur(38px);opacity:.43;transition:.28s}
.card-content{position:relative;z-index:3;min-height:446px;padding:24px 27px 22px;display:flex;flex-direction:column}
.card-topline{display:flex;align-items:center;justify-content:space-between;color:color-mix(in srgb,var(--accent) 72%,white 5%);font-size:9px;font-weight:700;letter-spacing:.26em}
.external-mark{font-size:16px;font-weight:400;letter-spacing:0;opacity:.72}
.card-copy{margin:auto 0;text-align:center;display:flex;flex-direction:column;align-items:center}
.card-icon{
  width:68px;height:68px;border-radius:50%;display:grid;place-items:center;margin-bottom:22px;
  color:color-mix(in srgb,var(--accent) 82%,white 8%);
  border:1px solid color-mix(in srgb,var(--accent) 52%,transparent);
  background:rgba(4,6,8,.42);
  box-shadow:inset 0 0 26px color-mix(in srgb,var(--accent) 8%,transparent),0 0 30px rgba(0,0,0,.22);
}
.card-icon svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}
.tool-card h2{margin:0;color:#f1eee7;font-size:20px;font-weight:500;letter-spacing:.15em;text-indent:.15em;line-height:1.35}
.tool-card b{display:block;width:37px;height:2px;margin:16px 0;background:var(--accent);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 55%,transparent)}
.tool-description{margin:0;color:rgba(213,209,202,.58);font-size:13px;line-height:1.68;max-width:245px}
.card-action{
  padding-top:17px;border-top:1px solid rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:center;gap:8px;
  color:rgba(227,225,218,.62);font-size:9px;font-weight:700;letter-spacing:.24em;
}

.footer{
  position:relative;z-index:5;
  margin:-72px auto 0;padding:0 20px 24px;
  display:grid;place-items:center;text-align:center;color:rgba(193,188,177,.42);
}
.footer-diamond{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:12px}
.footer-diamond span{width:30px;background:linear-gradient(90deg,transparent,rgba(193,159,96,.30))}
.footer-diamond i{width:6px;height:6px;opacity:.82}
.footer p{margin:0;font-size:10px}

@media(hover:hover) and (pointer:fine){
  .tool-card:hover{
    transform:translateY(-5px) scale(1.01);
    border-color:color-mix(in srgb,var(--accent) 72%,rgba(255,255,255,.25));
    box-shadow:inset 0 1px rgba(255,255,255,.06),0 26px 62px rgba(0,0,0,.40),0 0 42px color-mix(in srgb,var(--accent) 27%,transparent),0 0 90px color-mix(in srgb,var(--accent) 13%,transparent);
  }
  .tool-card:hover .card-art{transform:scale(1.035);filter:saturate(1.05) brightness(.93) contrast(1.08)}
  .tool-card:hover .edge-glow{opacity:.66;transform:scaleX(1.22)}
}

@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

@media(max-width:760px){
  .topbar{height:72px;padding:0 18px}
  .brand{gap:9px;font-size:9px}
  .w-mark{width:34px;height:31px}
  .home-link{font-size:8px;gap:7px}
  .home-arrow{font-size:14px}
  .shell{width:min(500px,calc(100% - 28px));padding:108px 0 116px}
  .hero{margin-bottom:38px}
  .eyebrow{font-size:8px;margin-bottom:11px}
  .hero h1{font-size:clamp(50px,16vw,67px)}
  .subtitle{font-size:14px;letter-spacing:.07em}
  .divider{margin:20px auto 15px}
  .tools-grid{grid-template-columns:minmax(0,1fr);gap:18px}
  .tool-card,.card-content{min-height:414px}
  .tool-card{width:100%;max-width:390px;margin:0 auto}
  .footer{margin:-68px auto 0}
}

@media(prefers-reduced-motion:reduce){
  .hero,.tools-section{animation:none}
  .tool-card,.card-art,.edge-glow,.home-link{transition:none}
}