:root{
  --bg:#0d1627;
  --bg-deep:#0a1220;
  --bg-mid:#121f34;
  --text:#f2eadf;
  --muted:#cbbfae;
  --line:rgba(208,188,151,.34);
  --line-soft:rgba(255,255,255,.08);
  --gold:#d4ac6e;
  --gold-soft:#c89f64;
  --gold-dark:#8c6432;
  --card-bg:rgba(56,64,83,.42);
  --card-stroke:rgba(225,214,197,.18);
  --card-stroke-2:rgba(255,255,255,.07);
  --shadow:0 10px 30px rgba(0,0,0,.32);
  --shell-width:1188px;
  --inner:1040px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  min-height:100vh;
  background:
    radial-gradient(70% 55% at 50% 12%, rgba(49,76,113,.28), transparent 55%),
    radial-gradient(50% 25% at 50% 100%, rgba(17,37,61,.8), transparent 70%),
    linear-gradient(180deg,#0a1220 0%, #0d1525 38%, #0a1120 100%);
  color:var(--text);
  font-family:"Inter",system-ui,sans-serif;
}

a{color:inherit;text-decoration:none}
button{font:inherit}

.page-wrap{
  padding:20px 0 28px;
}

.site-shell{
  width:min(calc(100vw - 88px), var(--shell-width));
  margin:0 auto;
  background:
    radial-gradient(120% 100% at 50% 0%, rgba(27,44,72,.42), transparent 50%),
    linear-gradient(180deg, #111c2f 0%, #0d1627 28%, #0d1627 100%);
  box-shadow:
    0 30px 90px rgba(0,0,0,.48),
    inset 0 0 0 1px rgba(255,255,255,.025);
  position:relative;
  overflow:hidden;
}

.site-shell::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  box-shadow:
    inset 0 0 100px rgba(0,0,0,.22),
    inset 0 0 0 1px rgba(255,255,255,.018);
  z-index:20;
}

.panel,.hero{
  position:relative;
  overflow:hidden;
}

.hero{
  min-height:772px;
  background:#0f1829;
}

.hero__bg{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(4,8,16,.54) 0%, rgba(8,13,23,.28) 18%, rgba(8,13,23,.14) 34%, rgba(8,13,23,.52) 100%),
    radial-gradient(65% 65% at 55% 8%, rgba(217,167,91,.15), transparent 45%),
    url("assets/img/hero.jpg") center top / cover no-repeat;
  filter:saturate(.96) contrast(1.02);
}

.hero__overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(9,14,25,.18) 0%, rgba(9,14,25,.05) 30%, rgba(9,14,25,.40) 100%),
    radial-gradient(65% 45% at 14% 32%, rgba(31,53,86,.26), transparent 62%),
    linear-gradient(90deg, rgba(6,10,18,.48) 0%, rgba(6,10,18,.22) 28%, rgba(6,10,18,.06) 55%, rgba(6,10,18,.16) 100%);
}

.nav{
  width:min(calc(100% - 72px), 1085px);
  margin:0 auto;
  padding:26px 0 18px;
  position:relative;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.brand{
  display:flex;
  align-items:center;
  gap:10px;
  color:#f4eadb;
}

.brand__mark{
  width:32px;
  height:17px;
  display:block;
  filter:drop-shadow(0 0 10px rgba(255,230,194,.12));
}

.brand__mark svg{
  width:100%;
  height:100%;
  display:block;
  fill:none;
  stroke:#f4eadb;
  stroke-width:3.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.brand__text{
  font-family:"Cormorant Garamond", Georgia, serif;
  font-size:34px;
  font-weight:600;
  line-height:1;
  letter-spacing:-.2px;
}

.menu-btn{
  width:36px;
  height:28px;
  background:transparent;
  border:none;
  padding:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  cursor:pointer;
  opacity:.92;
}

.menu-btn span{
  display:block;
  height:2px;
  background:#d6bf96;
  border-radius:999px;
  box-shadow:0 0 10px rgba(212,172,110,.08);
}
.menu-btn span:nth-child(1){width:14px;margin-left:auto}
.menu-btn span:nth-child(2){width:32px}
.menu-btn span:nth-child(3){width:32px}
.step-number{color:#c89f64;font-size: 30px;}

.hero__separator.top{
  position:relative;
  z-index:3;
  width:100%;
  height:1px;
  background:linear-gradient(90deg, rgba(199,175,136,.26) 0%, rgba(214,197,171,.44) 48%, rgba(199,175,136,.26) 100%);
  margin-top:6px;
}

.hero__content{
  position:relative;
  z-index:3;
  width:min(calc(100% - 72px), 1085px);
  margin:0 auto;
  padding:86px 0 116px;
}

.hero__content h1{
  margin:0 0 22px;
  max-width:405px;
  font-family:"Cormorant Garamond", Georgia, serif;
  font-size:64px;
  font-weight:600;
  line-height:.94;
  letter-spacing:-1.1px;
  text-wrap:balance;
  text-shadow:0 2px 22px rgba(0,0,0,.26);
}

.hero__content p{
  margin:0 0 30px;
  max-width:560px;
  font-size:19px;
  line-height:1.56;
  color:#ddd0bf;
  text-shadow:0 1px 16px rgba(0,0,0,.35);
}

.hero__actions{
  display:flex;
  align-items:center;
  gap:18px;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 24px;
  border-radius:6px;
  font-size:15px;
  font-weight:500;
  letter-spacing:-.1px;
  transition:transform .25s ease, box-shadow .25s ease, background-color .25s ease, border-color .25s ease, color .25s ease;
  position:relative;
}

.btn:hover{
  transform:translateY(-1px);
}

.btn--gold{
  background:linear-gradient(180deg, #deb46f 0%, #c89f64 100%);
  color:#302112;
  box-shadow:
    inset 0 1px 0 rgba(255,241,215,.58),
    inset 0 -1px 0 rgba(92,59,21,.25),
    0 10px 18px rgba(0,0,0,.18);
}

.btn--gold:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,241,215,.62),
    inset 0 -1px 0 rgba(92,59,21,.28),
    0 14px 22px rgba(0,0,0,.22);
}

.btn--ghost{
  color:#ede3d6;
  background:rgba(32,34,41,.18);
  border:1px solid rgba(242,234,223,.34);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.04),
    0 8px 18px rgba(0,0,0,.10);
  backdrop-filter:blur(2px);
}

.panel{
  width:100%;
  position:relative;
}

.panel::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
}

.panel--intro{
  min-height:188px;
  background:
    radial-gradient(120% 130% at 50% 20%, rgba(45,67,100,.26), rgba(14,22,39,0) 55%),
    linear-gradient(180deg, #101c2f 0%, #0d1627 100%);
}

.panel--wood{
  min-height:378px;
  background:
    linear-gradient(180deg, rgba(10,15,24,.14) 0%, rgba(10,15,24,.06) 100%),
    url("assets/img/wood.jpg") center center / cover no-repeat;
}

.panel--wood::before{
  background:
    linear-gradient(180deg, rgba(10,15,24,.48) 0%, rgba(10,15,24,.08) 22%, rgba(10,15,24,.16) 100%),
    radial-gradient(85% 70% at 50% 115%, rgba(255,164,62,.18), transparent 46%);
}

.panel--security{
  min-height:278px;
  background:
    linear-gradient(180deg, rgba(9,13,22,.18), rgba(9,13,22,.08)),
    url("assets/img/cube.jpg") center center / cover no-repeat;
}

.panel--security::before{
  background:
    linear-gradient(90deg, rgba(10,15,24,.18) 0%, rgba(10,15,24,.08) 100%),
    radial-gradient(45% 55% at 22% 62%, rgba(232,173,92,.12), transparent 45%);
}

.panel--texture{
  min-height:250px;
  background:
    linear-gradient(180deg, rgba(9,13,22,.16), rgba(9,13,22,.16)),
    url("assets/img/texture.jpg") center center / cover no-repeat;
}

.panel--texture-bottom{
  min-height:250px;
 /* background:
    linear-gradient(180deg, rgba(9,13,22,.12), rgba(9,13,22,.28)),
    url("assets/img/texture.jpg") center bottom / cover no-repeat;*/
}

.section-line{
  position:relative;/*position:absolute;*/
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg, rgba(195,173,136,.18) 0%, rgba(215,198,170,.55) 48%, rgba(195,173,136,.18) 100%);
  z-index:3;
}

.diamond{
  position:absolute;
  left:50%;
  top:50%;
  width:9px;
  height:9px;
  background:linear-gradient(180deg, #e6cfaa, #c89f64);
  border-radius:1px;
  transform:translate(-50%,-50%) rotate(45deg);
  box-shadow:
    0 0 0 1px rgba(53,35,18,.18),
    0 0 18px rgba(212,172,110,.18);
}

.intro__inner,
.steps,
.benefits,
.security__content,
.projection__content,
.cta__content{
  position:relative;
  z-index:2;
}

.intro__inner{
  width:min(calc(100% - 72px), var(--inner));
  margin:0 auto;
  padding:60px 0 52px;
  text-align:center;
}

.intro__inner p{
  margin:0;
  font-size:20px;
  line-height:1.55;
  color:#efe4d4;
  letter-spacing:-.15px;
  text-shadow:0 1px 16px rgba(0,0,0,.18);
}
.intro__inner em{
  font-style:italic;
  color:#f3e7d7;
}
.intro__sub{
  margin-top:10px!important;
  font-size:16px!important;
  color:#ded3c4!important;
}

.section-heading{
  width:min(calc(100% - 72px), 1028px);
  margin:0 auto;
  padding-top:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:22px;
  position:relative;
  z-index:2;
}

.section-heading h2,
.security__content h2,
.cta__content h2{
  margin:0;
  font-family:"Cormorant Garamond", Georgia, serif;
  font-weight:600;
  letter-spacing:-.35px;
}

.section-heading h2{
  font-size:33px;
  color:#e9dbc5;
  line-height:1;
  text-shadow:0 1px 10px rgba(0,0,0,.20);
}

.section-heading__rule{
  width:132px;
  height:1px;
  background:linear-gradient(90deg, rgba(227,214,191,.00), rgba(227,214,191,.52), rgba(227,214,191,.00));
  transform:translateY(2px);
}

.steps__cards{
  width:min(calc(100% - 72px), 1032px);
  margin:34px auto 0;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
  padding-bottom:38px;
  position:relative;
  z-index:2;
}

.glass-card{
  position:relative;
  background:
    linear-gradient(180deg, rgba(71,79,99,.44) 0%, rgba(50,57,75,.32) 100%);
  border:1px solid rgba(218,206,189,.16);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.04),
    0 10px 30px rgba(0,0,0,.14);
  backdrop-filter:blur(1px);
}

.glass-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0) 28%),
    radial-gradient(75% 85% at 50% 100%, rgba(255,214,156,.04), transparent 48%);
}

.glass-card--step{
  min-height:183px;
  padding:22px 24px 20px;
}

.benefits__grid{
  width:min(calc(100% - 72px), 1032px);
  margin:34px auto 0;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
  padding-bottom:38px;
  position:relative;
  z-index:2;
}

.glass-card--step h3,
.glass-card--benefit h3{
  margin:0;
  font-family:"Cormorant Garamond", Georgia, serif;
  font-size:27px;
  font-weight:600;
  line-height:1.08;
  color:#f2e8d9;
  letter-spacing:-.25px;
}

.glass-card--step p,
.glass-card--benefit p{
  margin:0;
  font-size:15px;
  line-height:1.55;
  color:#f0e6d8;
  opacity:.95;
}

.card-divider{
  display:block;
  width:100%;
  height:1px;
  margin:14px 0 16px;
  background:linear-gradient(90deg, rgba(255,255,255,.08), rgba(230,220,206,.26) 45%, rgba(255,255,255,.08));
}

/*.benefits{
  width:min(calc(100% - 72px), 1032px);
  margin:0 auto;
  padding:40px 0 40px;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
}*/

.glass-card--benefit{
  min-height:146px;
  padding:20px 24px 18px;
}

.glass-card--benefit h3{
  font-size:25px;
}
.glass-card--benefit p{
  font-size:15px;
}

.security__content{
  width:min(calc(100% - 72px), 1032px);
  margin:0 auto;
  padding:58px 0 48px;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
}

.security__content h2{
  width:430px;
  font-size:36px;
  line-height:1.02;
  color:#ead9c2;
  font-style:italic;
  text-shadow:0 1px 18px rgba(0,0,0,.22);
}

.security__content p{
  width:430px;
  margin:10px 0 0;
  font-size:16px;
  line-height:1.45;
  color:#f2e8d9;
}

.projection__content{
  width:min(calc(100% - 72px), 1032px);
  margin:0 auto;
  padding:55px 0 50px;
  text-align:center;
}

.projection__content p{
  margin:0;
  font-family:"Cormorant Garamond", Georgia, serif;
  font-size:28px;
  font-weight:600;
  line-height:1.72;
  letter-spacing:-.2px;
  color:#f2e7d6;
  text-shadow:0 1px 14px rgba(0,0,0,.18);
}

.cta__content{
  width:min(calc(100% - 72px), 1032px);
  margin:0 auto;
  padding:42px 0 48px;
  text-align:center;
}

.cta__content h2{
  font-size:38px;
  line-height:1.05;
  color:#f2e8d8;
  text-shadow:0 1px 18px rgba(0,0,0,.18);
}

.cta__content p{
  margin:10px 0 28px;
  font-size:16px;
  line-height:1.4;
  color:#eadfce;
}

.btn--cta{
  min-width:158px;
}

@media (max-width: 1200px){
  .hero{min-height:56.5vw}
  .hero__content h1{font-size:6vw}
  .hero__content p{font-size:1.38vw}
  .section-heading h2{font-size:2.35vw}
  .glass-card--step h3,.glass-card--benefit h3{font-size:2vw}
}

@media (max-width: 980px){
  .page-wrap{padding:0}
  .site-shell{
    width:100%;
  }
  .hero{
    min-height:auto;
  }
  .nav,
  .hero__content,
  .intro__inner,
  .section-heading,
  .steps__cards,
  .benefits,
  .security__content,
  .projection__content,
  .cta__content{
    width:min(calc(100% - 40px), 100%);
  }
  .hero__content{padding:56px 0 72px}
  .hero__content h1{font-size:52px;max-width:340px}
  .hero__content p{font-size:16px;max-width:460px}
  .hero__actions{flex-wrap:wrap;gap:12px}
  .steps__cards,
  .benefits{
    grid-template-columns:1fr;
  }
  .security__content{
    align-items:flex-start;
  }
  .security__content h2,
  .security__content p{
    width:min(100%,460px);
  }
  .projection__content p{font-size:24px}
}

@media (max-width: 640px){
  .hero__content h1{font-size:42px}
  .brand__text{font-size:28px}
  .btn{width:100%}
  .section-heading{gap:10px}
  .section-heading__rule{width:54px}
  .section-heading h2{font-size:28px;text-align:center}
  .projection__content p{font-size:22px;line-height:1.65}
}

.will-reveal{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .8s ease, transform .8s ease;
}
.will-reveal.is-visible{
  opacity:1;
  transform:translateY(0);
}