:root{
  --navy:#14263D;
  --cream:#F6F3ED;
  --gold:#B89A5B;
  --charcoal:#30343B;
  --mx:0px;
  --my:0px;
}

*{box-sizing:border-box}

html,body{
  margin:0;
  min-height:100%;
}

body{
  font-family:"Heebo",Arial,sans-serif;
  background:var(--cream);
  color:var(--navy);
  overflow:hidden;
  position:relative;
}

.home-shell{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:36px 56px 30px;
  position:relative;
  z-index:2;
}

.hero{
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  max-width:980px;
  margin-inline:auto;
  width:100%;
  padding-block:70px;
}

.eyebrow{
  color:var(--gold);
  font-size:15px;
  font-weight:700;
  letter-spacing:.04em;
  margin-bottom:22px;
  animation:fadeUp .8s ease both;
}

h1{
  margin:0;
  font-size:clamp(54px,8vw,108px);
  line-height:.98;
  letter-spacing:-.035em;
  font-weight:800;
  max-width:900px;
  animation:fadeUp .9s .08s ease both;
}

h1 span{
  color:var(--gold);
}

.sub{
  margin:34px 0 0;
  max-width:680px;
  font-size:clamp(19px,2vw,25px);
  line-height:1.7;
  color:rgba(48,52,59,.72);
  animation:fadeUp .9s .16s ease both;
}

.gold-line{
  width:96px;
  height:2px;
  background:var(--gold);
  margin-top:42px;
  transform-origin:right center;
  animation:lineIn 1s .28s ease both;
}

footer{
  border-top:1px solid rgba(20,38,61,.10);
  padding-top:18px;
  font-size:13px;
  color:rgba(48,52,59,.45);
}

.ambient{
  position:absolute;
  border-radius:50%;
  filter:blur(100px);
  pointer-events:none;
  z-index:0;
  transition:transform .35s ease;
}

.ambient-a{
  width:48vw;
  aspect-ratio:1;
  left:-12vw;
  top:-14vw;
  background:radial-gradient(circle,rgba(184,154,91,.18),rgba(184,154,91,0) 70%);
  transform:translate(var(--mx),var(--my));
  animation:driftA 12s ease-in-out infinite alternate;
}

.ambient-b{
  width:42vw;
  aspect-ratio:1;
  right:-10vw;
  bottom:-16vw;
  background:radial-gradient(circle,rgba(31,78,140,.11),rgba(31,78,140,0) 72%);
  transform:translate(calc(var(--mx) * -.6),calc(var(--my) * -.6));
  animation:driftB 15s ease-in-out infinite alternate;
}

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

@keyframes lineIn{
  from{opacity:0;transform:scaleX(0)}
  to{opacity:1;transform:scaleX(1)}
}

@keyframes driftA{
  from{margin-left:0;margin-top:0}
  to{margin-left:40px;margin-top:26px}
}

@keyframes driftB{
  from{margin-right:0;margin-bottom:0}
  to{margin-right:32px;margin-bottom:28px}
}

@media (max-width:700px){
  .home-shell{
    padding:24px 20px 22px;
  }

  .hero{
    padding-block:40px;
  }

  h1{
    font-size:56px;
  }

  .sub{
    font-size:19px;
  }

  .ambient-a,.ambient-b{
    width:90vw;
  }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation:none!important;
    transition:none!important;
  }
}


/* ===== Mobile refinement v2 ===== */
html, body { width: 100%; min-height: 100%; }
body { overflow-x: hidden; overflow-y: auto; }

@media (max-width: 700px) {
  .home-shell { min-height: 100svh; padding: 22px 20px 20px; }
  .hero { justify-content: center; padding: 42px 0 56px; max-width: 520px; }
  .eyebrow { font-size: 13px; margin-bottom: 17px; }
  h1 { font-size: clamp(44px, 13vw, 58px); line-height: 1.02; letter-spacing: -.04em; }
  .sub { margin-top: 26px; max-width: 92%; font-size: 17px; line-height: 1.65; }
  .gold-line { width: 64px; margin-top: 30px; }
  footer { padding-top: 14px; font-size: 11px; }
  .ambient-a { width: 110vw; left: -55vw; top: -24vw; opacity: .7; }
  .ambient-b { width: 105vw; right: -58vw; bottom: -26vw; opacity: .62; }
}
@media (max-width: 390px) {
  .home-shell { padding-inline: 17px; }
  h1 { font-size: 42px; }
  .sub { font-size: 16px; max-width: 100%; }
}