@import url("https://fonts.googleapis.com/css2?family=Great+Vibes&family=Inter:wght@400;500;600;700;800;900&display=swap");

:root{
  --font-body:"Inter",system-ui,-apple-system,sans-serif;
  --font-heading:"Inter",system-ui,-apple-system,sans-serif;
  --bg:#f6f1e8;
  --paper:#ffffff;
  --ink:#0f1724;
  --muted:#637084;
  --line:#ded8cf;
  --brand:#15395f;
  --brand-2:#0f2442;
  --accent:#4f8cc7;
  --gold:#caa86e;
  --hero:#081425;
  --hero-soft:#0b1d35;
  --radius-xl:32px;
  --radius-lg:22px;
  --shadow:0 24px 60px rgba(10,18,30,.12);
  --shadow-soft:0 16px 30px rgba(15,23,36,.08);
  --max:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:linear-gradient(180deg,#f7f3ec 0%,#f3eee5 100%);
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
button,input,textarea{font:inherit}

body, .top-nav__link, .drawer-link, .btn, .ghost-btn, input, textarea, button{
  font-family:var(--font-body);
}
.page-hero h1,
.section-head h2,
.split__copy h2,
.card h3,
.timeline-item h3,
.drawer__title,
.info-card__value{
  font-family:"Cormorant Garamond", Georgia, serif;
  font-weight:700;
}
.page-hero h1{letter-spacing:-.04em; line-height:.9; font-weight:700}
.section-head h2,.split__copy h2{letter-spacing:-.02em; font-weight:700}
.eyebrow,.info-card__label,.drawer-group__title{font-family:var(--font-body);letter-spacing:.16em}
.brand__tag,.page-hero p,.section-head p,.card p,.split__copy p,.timeline-item p,.info-card__meta{font-family:var(--font-body)}

.container{width:min(calc(100% - 32px), var(--max)); margin:0 auto}
.site-header{
  position:sticky; top:0; z-index:60;
  backdrop-filter:saturate(180%) blur(20px);
  background:rgba(248,244,238,.84);
  border-bottom:1px solid rgba(16,24,40,.08);
}
.site-header__inner{
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  min-height:84px;
}
.site-header__actions{display:flex;align-items:center;gap:12px;flex-shrink:0}
.top-nav{display:flex;align-items:center;justify-content:center;gap:8px;flex:1;flex-wrap:wrap}
.top-nav__link{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 18px;border-radius:999px;color:var(--ink-soft, #334155);font-weight:700;transition:background .2s ease,color .2s ease,transform .2s ease}
.top-nav__link:hover{background:#eef4fa;color:var(--brand);transform:translateY(-1px)}
.top-nav__link.is-active{background:rgba(21,57,95,.08);color:var(--brand)}
.brand{display:flex; align-items:center; gap:14px}
.brand__mark{
  width:52px; height:52px; border-radius:16px; box-shadow:var(--shadow-soft);
}
.brand__title{font-family:"Cormorant Garamond", Georgia, serif; font-size:2.35rem; font-weight:700; letter-spacing:-.015em; line-height:.92}
.brand__tag{font-size:.97rem; color:var(--muted); margin-top:2px}
.menu-btn{
  width:54px; height:54px; border-radius:50%;
  border:1px solid rgba(21,57,95,.16); background:white; color:var(--brand);
  display:grid; place-items:center; cursor:pointer; box-shadow:var(--shadow-soft); transition:transform .2s ease, background .2s ease;
}
.menu-btn:hover{transform:translateY(-1px); background:#fbfdff}
.menu-btn__bars,.menu-btn__bars::before,.menu-btn__bars::after{
  content:""; display:block; width:22px; height:2px; background:currentColor; border-radius:999px; position:relative;
}
.menu-btn__bars::before{position:absolute; top:-7px; left:0}
.menu-btn__bars::after{position:absolute; top:7px; left:0}
.drawer-backdrop{
  position:fixed; inset:0; background:rgba(10,18,30,.48); opacity:0; pointer-events:none;
  transition:opacity .25s ease; z-index:90;
}
.drawer{
  position:fixed; right:0; top:0; width:min(420px,92vw); height:100vh; background:#fff;
  box-shadow:-20px 0 60px rgba(10,18,30,.18); transform:translateX(100%); transition:transform .3s ease; z-index:95;
  display:flex; flex-direction:column;
}
.drawer.open{transform:translateX(0)}
.drawer-backdrop.open{opacity:1; pointer-events:auto}
.drawer__top{
  padding:22px 24px; border-bottom:1px solid var(--line);
  display:flex; justify-content:space-between; align-items:flex-start; gap:14px;
}
.drawer__title{font-size:1.35rem; font-weight:800}
.drawer__sub{color:var(--muted); margin-top:4px; line-height:1.5}
.drawer__close{
  width:42px;height:42px;border-radius:50%;border:none;background:#eef3f8;cursor:pointer;color:var(--brand);font-size:22px;
}
.drawer__body{padding:12px 20px 24px; overflow:auto}
.drawer-group{padding:16px 0; border-bottom:1px solid var(--line)}
.drawer-group:last-child{border-bottom:none}
.drawer-group__title{font-size:.82rem; font-weight:700; color:#7e8a9a; letter-spacing:.12em; text-transform:uppercase; margin-bottom:12px}
.drawer-list{display:grid; gap:8px}
.drawer-link{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 16px; border-radius:18px; background:#f8fafc; border:1px solid rgba(15,23,36,.06);
  transition:background .2s ease, transform .2s ease, border-color .2s ease;
}
.drawer-link:hover{background:#eef4fa; transform:translateX(-2px); border-color:rgba(21,57,95,.14)}
.drawer-link.is-active{background:linear-gradient(135deg,#173d65,#0d1e36); color:#fff}
.drawer-cta{
  margin-top:18px; background:linear-gradient(135deg,#163a60,#0d1e36); color:#fff; padding:20px; border-radius:26px;
}
.drawer-cta h4{margin:0 0 8px; font-size:1.15rem}
.drawer-cta p{margin:0 0 16px; color:rgba(255,255,255,.78); line-height:1.6}
.btn-row{display:flex; flex-wrap:wrap; gap:14px}
.btn, .ghost-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:52px; padding:0 24px; border-radius:999px; font-weight:700; transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.btn{background:linear-gradient(135deg,#20486f,#0d1e36); color:#fff; box-shadow:0 18px 34px rgba(14,31,54,.24)}
.btn:hover{transform:translateY(-2px)}
.ghost-btn{background:transparent; border:1px solid rgba(255,255,255,.24); color:#fff}
.page-hero{
  position:relative; overflow:hidden;
  background:radial-gradient(circle at 18% 18%, rgba(59,136,187,.18), transparent 28%),
             radial-gradient(circle at 82% 22%, rgba(118,100,209,.18), transparent 26%),
             linear-gradient(135deg,var(--hero) 0%, var(--brand-2) 58%, #111d33 100%);
  color:#fff;
}
.page-hero::after{
  content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(6,13,25,.18),rgba(6,13,25,.44));
}
.page-hero__inner{
  position:relative; z-index:2; display:grid; grid-template-columns:minmax(0,1fr) minmax(420px,540px); gap:64px;
  align-items:center; padding:86px 0 96px;
}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px; min-height:36px; padding:0 14px;
  border-radius:999px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12);
  font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:#b9dafb; font-weight:800;
}
.page-hero h1{
  margin:18px 0 18px; font-size:clamp(3rem,6vw,5.8rem); line-height:.96; letter-spacing:-.065em;
  max-width:10ch;
}
.page-hero p{
  max-width:58ch; color:rgba(234,240,248,.82); line-height:1.75; font-size:1.08rem; margin:0 0 30px;
}
.hero-media{
  position:relative; min-height:640px; border-radius:38px 128px 38px 96px; overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.12);
  box-shadow:0 34px 90px rgba(0,0,0,.32); isolation:isolate;
  animation:heroFloat 8s ease-in-out infinite;
}
.hero-media__frame{
  position:absolute; inset:0;
}
.hero-media img{
  width:100%; height:100%; object-fit:cover; object-position:center;
  border-radius:inherit; padding:0; background:#0d1830; transform:scale(1.03);
  transition:transform .9s ease, filter .45s ease;
}
.hero-media:hover img{transform:scale(1.08)}
.hero-media::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(6,14,25,.04) 0%, rgba(6,14,25,.12) 35%, rgba(6,14,25,.3) 100%);
  z-index:1; pointer-events:none;
}
.info-card{
  position:absolute; left:26px; right:26px; bottom:24px; padding:26px 28px; border-radius:28px 28px 24px 24px;
  background:linear-gradient(180deg,rgba(9,22,40,.72),rgba(9,22,40,.88)); border:1px solid rgba(255,255,255,.08); backdrop-filter:blur(18px);
  z-index:2;
}
.info-card__label{font-size:.8rem; letter-spacing:.12em; text-transform:uppercase; color:#8dc6ff; font-weight:800}
.info-card__value{font-size:2rem; font-weight:800; margin-top:6px}
.info-card__meta{margin-top:12px; display:grid; gap:8px; color:rgba(255,255,255,.78)}
.section{padding:88px 0}
.section--paper{background:var(--paper)}
.section-head{display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:28px}
.section-head h2{margin:0; font-size:clamp(2rem,3vw,3rem); letter-spacing:-.04em}
.section-head p{margin:0; max-width:56ch; color:var(--muted); line-height:1.7}
.card-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.card{
  background:#fff; border:1px solid rgba(15,23,36,.08); border-radius:26px; padding:26px; box-shadow:var(--shadow-soft);
}
.card h3{margin:0 0 12px; font-size:1.3rem; letter-spacing:-.03em}
.card p{margin:0; color:var(--muted); line-height:1.75}
.split{
  display:grid; grid-template-columns:1fr 1.02fr; gap:42px; align-items:center;
}
.split__media{
  background:transparent; border-radius:42px 120px 42px 100px; padding:0; box-shadow:var(--shadow); overflow:hidden; min-height:480px;
  position:relative;
}
.split__media img{width:100%; height:100%; min-height:480px; object-fit:cover; border-radius:inherit; background:#091427; transform:scale(1.02); transition:transform .9s ease}
.split__media:hover img{transform:scale(1.07)}
.split__copy .eyebrow{background:#edf5ff; border-color:#d6e6fb; color:#1f5f98}
.split__copy h2{margin:18px 0 12px; font-size:clamp(2.1rem,3vw,3.5rem); line-height:1.02; letter-spacing:-.05em}
.split__copy p{color:var(--muted); line-height:1.8; margin:0 0 22px}
.stats{
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:24px
}
.stat{
  background:#fff; border-radius:22px; padding:22px; border:1px solid rgba(15,23,36,.07); box-shadow:var(--shadow-soft)
}
.stat strong{display:block; font-size:1.2rem; margin-bottom:6px}
.stat span{color:var(--muted)}
.next-steps{
  display:grid; grid-template-columns:repeat(2,1fr); gap:18px
}
.next-step{
  padding:20px 22px; border-radius:20px; border:1px solid rgba(21,57,95,.09); background:#fff; box-shadow:var(--shadow-soft);
  display:flex; align-items:center; justify-content:space-between; gap:12px
}
.next-step:hover{transform:translateY(-2px)}
.next-step span{font-weight:700}
.timeline{display:grid; gap:16px}
.timeline-item{
  display:grid; grid-template-columns:auto 1fr; gap:18px; align-items:start;
  padding:22px; border-radius:22px; background:#fff; box-shadow:var(--shadow-soft); border:1px solid rgba(15,23,36,.06);
}
.timeline-item__dot{width:14px;height:14px;border-radius:50%;background:#3772a8; margin-top:7px}
.timeline-item h3{margin:0 0 6px}
.timeline-item p{margin:0;color:var(--muted)}
.gallery-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:22px; grid-auto-rows:290px}
.gallery-grid img{
  width:100%; height:100%; object-fit:cover; border-radius:34px; box-shadow:var(--shadow-soft); background:#101a2d; padding:0;
  transition:transform .8s ease, box-shadow .3s ease;
}
.gallery-grid img:hover{transform:scale(1.03); box-shadow:0 26px 46px rgba(15,23,36,.16)}
.gallery-grid img:nth-child(1){grid-row:span 2; border-radius:34px 110px 34px 34px}
.gallery-grid img:nth-child(2){border-radius:34px 34px 34px 104px}
.gallery-grid img:nth-child(3){border-radius:104px 34px 34px 34px}
.gallery-grid img:nth-child(4){border-radius:34px 34px 104px 34px}
.faq-list{display:grid; gap:16px}
.faq-item{
  background:#fff; border-radius:22px; border:1px solid rgba(15,23,36,.07); box-shadow:var(--shadow-soft); overflow:hidden;
}
.faq-item summary{
  list-style:none; cursor:pointer; padding:22px 24px; font-weight:700; display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item p{padding:0 24px 22px; margin:0; color:var(--muted); line-height:1.75}
.forms-wrap{display:grid; grid-template-columns:1fr 1fr; gap:22px}
.form-card{
  background:#fff; border-radius:28px; padding:28px; box-shadow:var(--shadow-soft); border:1px solid rgba(15,23,36,.07)
}
.form-card h3{margin:0 0 8px; font-size:1.5rem}
.form-card p{margin:0 0 18px; color:var(--muted); line-height:1.65}
.field{display:grid; gap:8px; margin-bottom:14px}
.field label{font-size:.95rem; font-weight:700}
.input, .textarea{
  width:100%; min-height:54px; border-radius:16px; border:1px solid #d8e0ea; background:#fbfdff;
  padding:14px 16px; color:var(--ink)
}
.textarea{min-height:140px; resize:vertical}
.form-message{margin-top:12px; font-weight:600}
.footer{
  background:#081425; color:#fff; padding:80px 0 36px; margin-top:20px
}
.footer__top{display:grid; grid-template-columns:1.1fr .9fr; gap:36px; align-items:start; margin-bottom:34px}
.footer__brand{max-width:52ch}
.footer__brand p{color:rgba(234,240,248,.76); line-height:1.75}
.footer__grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px}
.footer__col h4{margin:0 0 14px; font-size:.92rem; letter-spacing:.1em; text-transform:uppercase; color:#a5cff6}
.footer__col a{display:block; color:rgba(255,255,255,.78); margin:10px 0}
.footer__bottom{padding-top:26px; border-top:1px solid rgba(255,255,255,.1); color:rgba(255,255,255,.6); line-height:1.7}
.reveal{opacity:0; transform:translateY(28px); transition:opacity .65s ease, transform .65s ease}
.reveal.in-view{opacity:1; transform:none}
.settings-hero{
  padding:40px 0 16px;
}
.settings-hero .container{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:18px;
}
.badge{
  display:inline-flex; min-height:34px; align-items:center; padding:0 14px; border-radius:999px; background:#eef4fa; color:#1a4d7b; font-weight:800; letter-spacing:.08em; font-size:.78rem; text-transform:uppercase;
}
.settings-note{color:var(--muted); line-height:1.7; max-width:72ch}
.settings-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:22px}
.settings-card{
  background:#fff; border-radius:28px; border:1px solid rgba(15,23,36,.08); box-shadow:var(--shadow-soft); padding:18px;
}
.settings-preview{width:100%; height:260px; object-fit:cover; border-radius:24px 70px 24px 24px; margin-bottom:18px; background:#0b1a32}
.settings-title{font-size:1.45rem; font-weight:800; margin:16px 0 14px; letter-spacing:-.03em}
.upload-row{display:grid; gap:14px}
.file-input{
  width:100%; padding:14px 16px; border:1px solid #d8e0ea; border-radius:16px; background:#fbfdff;
}
.help-text{font-size:.94rem; color:var(--muted); line-height:1.65}
@media (max-width:1100px){
  .page-hero__inner,.split,.footer__top{grid-template-columns:1fr}
  .card-grid{grid-template-columns:repeat(2,1fr)}
  .top-nav{display:none}
}
@media (max-width:860px){
  .site-header__inner{min-height:78px}
  .brand{min-width:0}
  .brand__title{font-size:1.5rem}
  .brand__tag{font-size:.9rem}
  .card-grid,.stats,.forms-wrap,.footer__grid,.settings-grid,.gallery-grid,.next-steps{grid-template-columns:1fr}
  .page-hero__inner{padding:52px 0 60px}
  .page-hero h1{max-width:13ch}
  .site-header__inner{min-height:78px}
}
@media (max-width:560px){
  .container{width:min(calc(100% - 22px), var(--max))}
  .brand__tag{display:none}
  .btn-row{flex-direction:column; align-items:stretch}
  .btn,.ghost-btn{width:100%}
  .page-hero h1{font-size:clamp(2.4rem,13vw,3.7rem)}
  .section{padding:68px 0}
  .card,.form-card,.settings-card,.stat,.next-step,.timeline-item{padding:20px}
  .hero-media__frame,.split__media{padding:14px}
}

.ghost-btn--dark{border:1px solid rgba(15,23,36,.14); color:var(--ink); background:#fff}
.admin-login-backdrop{
  position:fixed; inset:0; background:rgba(10,18,30,.62); opacity:0; pointer-events:none; transition:opacity .25s ease; z-index:110;
}
.admin-login-modal{
  position:fixed; left:50%; top:50%; transform:translate(-50%,-48%) scale(.98); width:min(460px,calc(100vw - 26px));
  background:#fff; border-radius:30px; padding:28px; box-shadow:0 28px 90px rgba(10,18,30,.28); opacity:0; pointer-events:none; z-index:115;
  transition:opacity .25s ease, transform .25s ease;
}
.admin-login-backdrop.open{opacity:1; pointer-events:auto}
.admin-login-modal.open{opacity:1; pointer-events:auto; transform:translate(-50%,-50%) scale(1)}
.admin-login-close{
  position:absolute; right:16px; top:16px; width:40px; height:40px; border-radius:50%; border:none; background:#eef3f8; color:var(--brand); cursor:pointer; font-size:22px;
}
.admin-login-badge{
  display:inline-flex; min-height:34px; align-items:center; padding:0 14px; border-radius:999px; background:#eef4fa; color:#1a4d7b; font-weight:800; letter-spacing:.08em; font-size:.78rem; text-transform:uppercase; margin-bottom:10px;
}
.admin-login-modal h3{margin:8px 0 8px; font-size:2rem; letter-spacing:-.04em}
.admin-login-modal p{margin:0 0 18px; color:var(--muted); line-height:1.7}
.admin-login-form{display:grid; gap:2px}
.locked-card{
  background:#fff; border:1px solid rgba(15,23,36,.08); border-radius:30px; box-shadow:var(--shadow-soft); padding:34px; max-width:760px;
}
.locked-card h1{margin:14px 0 10px; font-size:clamp(2rem,4vw,3.4rem); letter-spacing:-.05em}
.locked-card p{margin:0 0 22px; color:var(--muted); line-height:1.8; max-width:58ch}


/* Link-style visual motion refinements */
.page-hero .reveal:nth-child(1){transition-delay:.05s}
.page-hero .reveal:nth-child(2){transition-delay:.14s}
.card-grid .card:nth-child(1){transition-delay:.02s}
.card-grid .card:nth-child(2){transition-delay:.09s}
.card-grid .card:nth-child(3){transition-delay:.16s}
.reveal{
  opacity:0; transform:translateY(38px) scale(.985);
  transition:opacity .8s ease, transform .8s cubic-bezier(.2,.65,.2,1), filter .8s ease;
  filter:blur(8px);
}
.reveal.in-view{opacity:1; transform:translateY(0) scale(1); filter:blur(0)}
.page-hero__inner > .reveal.in-view:first-child{animation:headlineLift .9s cubic-bezier(.2,.7,.2,1)}
@keyframes headlineLift{
  from{transform:translateY(20px); opacity:0}
  to{transform:translateY(0); opacity:1}
}
@keyframes heroFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}
.top-nav{gap:10px}
.top-nav__link{padding:0 16px; min-height:44px}
.next-step, .card, .timeline-item, .faq-item, .form-card{transition:transform .3s ease, box-shadow .3s ease}
.next-step:hover, .card:hover, .timeline-item:hover, .faq-item:hover, .form-card:hover{transform:translateY(-4px); box-shadow:0 24px 44px rgba(15,23,36,.12)}
@media (min-width: 1024px){
  .hero-media{margin-right:-18px}
}
@media (max-width: 1120px){
  .page-hero__inner{grid-template-columns:1fr; gap:36px; padding:70px 0 84px}
  .hero-media{min-height:520px; max-width:720px; width:100%; margin:0 auto; border-radius:32px 84px 32px 84px}
  .split{grid-template-columns:1fr; gap:28px}
  .split__media{min-height:420px; border-radius:30px 72px 30px 72px}
  .split__media img{min-height:420px}
}
@media (max-width: 820px){
  .top-nav{display:none}
  .page-hero h1{max-width:12ch}
  .hero-media{min-height:430px; border-radius:28px 52px 28px 52px}
  .info-card{left:18px; right:18px; bottom:18px; padding:22px}
  .gallery-grid{grid-template-columns:1fr; grid-auto-rows:240px}
  .gallery-grid img:nth-child(1){grid-row:span 1}
}
@media (max-width: 540px){
  .site-header__inner{min-height:78px}
  .brand__title{font-size:1.55rem}
  .brand__tag{font-size:.9rem}
  .hero-media{min-height:360px; border-radius:24px 36px 24px 36px}
  .split__media{min-height:320px; border-radius:24px 36px 24px 36px}
  .split__media img{min-height:320px}
  .settings-preview{height:220px}
}


.top-nav__link,.drawer-link,.btn,.ghost-btn{font-weight:700}



/* requested font change only */
.brand__title{
  font-family: var(--font-heading);
  font-size: clamp(2.05rem, 2.5vw, 2.7rem);
  font-weight: 900;
  letter-spacing: -0.045em;
  line-height: 1;
}

.page-hero h1{
  font-family: var(--font-heading);
  font-weight: 900;
  letter-spacing: -0.065em;
  line-height: 0.95;
}

.top-nav__link,.drawer-link,.btn,.ghost-btn,.eyebrow,.info-card__label,.brand__tag,body,p,span,a,button,input,textarea,label,.form-message{
  font-family: var(--font-body);
}


h1,h2,h3,h4,h5,h6,
.page-hero h1,
.section-head h2,
.split__copy h2,
.card h3,
.form-card h3,
.settings-title,
.admin-login-modal h3{
  font-family: var(--font-heading);
}

.brand__title{
  font-family: "Great Vibes", cursive;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
  font-size: clamp(2.15rem, 2.7vw, 3.05rem);
}

.top-nav__link,
.drawer-link,
.btn,
.ghost-btn,
.eyebrow,
.info-card__label,
.brand__tag,
body,
p,
span,
a,
button,
input,
textarea,
label,
.form-message{
  font-family: var(--font-body);
}

.page-hero h1{
  font-family: var(--font-heading);
  font-weight: 900;
  letter-spacing: -0.06em;
  line-height: 0.98;
}
