@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&family=Cormorant+Garamond:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --bg:#080507;
  --bg-soft:#120b10;
  --rose:#b8747c;
  --rose-soft:#d9a7ab;
  --gold:#b78a54;
  --gold-soft:#f0d9b2;
  --turq:#5dc6c4;
  --cream:#f6efe5;
  --line:rgba(240,217,178,.35);
  --shadow:0 18px 45px rgba(0,0,0,.45);
  --radius:24px;
  --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--cream);
  background:
    radial-gradient(circle at top left, rgba(184,116,124,.14), transparent 24%),
    radial-gradient(circle at top right, rgba(93,198,196,.10), transparent 22%),
    radial-gradient(circle at 50% 20%, rgba(183,138,84,.12), transparent 28%),
    linear-gradient(180deg,#090608 0%,#11090d 35%,#090608 100%);
  font-family:Inter,system-ui,sans-serif;
  overflow-x:hidden;
}
body::before, body::after{
  content:"";
  position:fixed;
  inset:auto;
  left:-10vw;
  width:120vw;
  height:260px;
  pointer-events:none;
  z-index:0;
  background:
     radial-gradient(circle at center, rgba(255,222,173,.2), transparent 36%),
     linear-gradient(90deg, transparent 0%, rgba(183,138,84,.2) 18%, rgba(240,217,178,.36) 52%, rgba(183,138,84,.2) 82%, transparent 100%);
  filter: blur(18px);
  opacity:.28;
  transform: rotate(-8deg);
}
body::before{top:180px}
body::after{top:820px; transform:rotate(7deg); opacity:.18}
img{max-width:100%; display:block}
a{text-decoration:none; color:inherit}
.site-shell{position:relative; z-index:1}
.container{width:min(var(--max),92%); margin:0 auto}
.topbar{
  position:sticky; top:0; z-index:50;
  backdrop-filter: blur(14px);
  background:rgba(10,7,9,.78);
  border-bottom:1px solid rgba(240,217,178,.18);
}
.nav{
  display:flex; align-items:center; justify-content:space-between; gap:18px; padding:14px 0;
}
.brand{display:flex; align-items:center; gap:14px; min-width:220px}
.brand img{width:56px; height:56px; object-fit:contain; border-radius:14px; box-shadow:0 0 24px rgba(93,198,196,.18)}
.brand-mark{font-family:Cinzel,serif; letter-spacing:.08em; color:var(--gold-soft); font-size:1.35rem}
.brand-sub{font-size:.8rem; color:#dcccb6; opacity:.88}
.nav-links{display:flex; gap:18px; flex-wrap:wrap; justify-content:center}
.nav-links a{font-size:.96rem; color:#eadfcf; position:relative}
.nav-links a::after{content:""; position:absolute; left:0; bottom:-5px; width:0; height:1px; background:linear-gradient(90deg,var(--rose-soft),var(--gold-soft),var(--turq)); transition:.3s}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.nav-actions{display:flex; gap:10px; align-items:center}
.btn, .btn-ghost{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:14px 24px; border-radius:999px; font-weight:600; line-height:1; transition:.28s ease;
  border:1px solid rgba(240,217,178,.45); box-shadow:0 10px 30px rgba(0,0,0,.22);
}
.btn{
  color:#140d0e;
  background:
    linear-gradient(135deg, #f6e2c3 0%, #d4b07b 18%, #8c6239 45%, #f6e2c3 60%, #b98a56 82%, #f6e2c3 100%);
  background-size:200% 200%;
  animation:metal 7s ease infinite;
}
.btn:hover{transform:translateY(-1px) scale(1.01); box-shadow:0 0 22px rgba(240,217,178,.22)}
.btn-ghost{
  color:var(--gold-soft);
  background:rgba(13,9,12,.45);
}
.btn-ghost:hover{border-color:rgba(93,198,196,.55); color:#fff}
.icon-link{width:42px;height:42px;border-radius:999px;border:1px solid rgba(240,217,178,.35);display:grid;place-items:center;background:rgba(14,10,12,.5)}
.icon-link:hover{box-shadow:0 0 16px rgba(184,116,124,.25)}

.hero{padding:70px 0 26px}
.hero-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:34px; align-items:center}
.kicker{font-size:.88rem; letter-spacing:.22em; text-transform:uppercase; color:#d9c7b0; margin-bottom:10px}
.display{
  font-family:Cormorant Garamond, serif; font-weight:600; line-height:.95;
  font-size:clamp(3.2rem,7vw,5.5rem);
  margin:0 0 14px; color:var(--gold-soft);
}
.roles{font-family:Cormorant Garamond, serif; font-size:clamp(1.4rem,2vw,2rem); color:#e8ddcf; margin-bottom:18px}
.hr-line{height:1px; margin:18px 0 24px; background:linear-gradient(90deg, transparent, rgba(240,217,178,.45), transparent)}
.lead-copy{
  font-family:Cormorant Garamond, serif;
  font-size:clamp(1.8rem,3vw,3rem);
  line-height:1.18;
  margin:0 0 18px;
}
.lead-copy em{font-style:italic; color:var(--rose-soft)}
.sub-copy{
  font-family:Cormorant Garamond, serif; font-size:clamp(1.4rem,2.1vw,2rem); line-height:1.35; color:#f3e8db; max-width:650px;
}
.hero-actions{display:flex; flex-wrap:wrap; gap:14px; margin-top:26px}
.hero-panel{
  position:relative; min-height:720px; border-radius:32px; overflow:hidden;
  border:1px solid rgba(240,217,178,.22);
  background:
    radial-gradient(circle at 10% 10%, rgba(184,116,124,.16), transparent 20%),
    radial-gradient(circle at 90% 15%, rgba(93,198,196,.12), transparent 20%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  box-shadow:var(--shadow);
}
.hero-panel::before{
  content:""; position:absolute; inset:0; z-index:1;
  background:
    radial-gradient(circle at 20% 65%, rgba(240,217,178,.14), transparent 25%),
    linear-gradient(135deg, rgba(5,4,5,.08), rgba(5,4,5,.4));
}
.hero-panel .swirl, .swirl-band{
  position:absolute; inset:auto; left:-12%; width:130%; height:180px; z-index:2;
  background:
     radial-gradient(circle at center, rgba(255,255,255,.08), transparent 26%),
     linear-gradient(90deg, transparent 0%, rgba(184,116,124,.25) 20%, rgba(240,217,178,.45) 45%, rgba(93,198,196,.18) 64%, rgba(184,116,124,.20) 80%, transparent 100%);
  filter:blur(10px); transform:rotate(-7deg);
  opacity:.55;
}
.hero-panel .swirl.one{top:56%}
.hero-panel .swirl.two{top:73%; opacity:.35}
.hero-photo{
  position:absolute; inset:0; z-index:0;
  width:100%; height:100%; object-fit:contain; object-position:center bottom; padding:20px;
}
.section{padding:36px 0 18px}
.section-title-wrap{display:flex; align-items:center; gap:20px; justify-content:center; margin-bottom:10px}
.section-title-wrap::before,.section-title-wrap::after{content:""; height:1px; flex:1; max-width:220px; background:linear-gradient(90deg, transparent, var(--line))}
.section-title-wrap::after{background:linear-gradient(90deg, var(--line), transparent)}
.section-title{
  font-family:Cormorant Garamond, serif; font-size:clamp(2.2rem,4.4vw,4rem); font-weight:600; margin:0; text-align:center; color:var(--gold-soft)
}
.section-sub{font-family:Cormorant Garamond, serif; font-size:clamp(1.35rem,2vw,2rem); text-align:center; color:#f1e7da; margin:8px auto 26px; max-width:920px}
.panel{
  background:linear-gradient(180deg, rgba(19,13,17,.78), rgba(10,7,9,.82));
  border:1px solid rgba(240,217,178,.2); border-radius:var(--radius); box-shadow:var(--shadow);
}
.known-card{padding:34px 32px; max-width:1050px; margin:0 auto; position:relative; overflow:hidden}
.known-card::before{
  content:""; position:absolute; inset:0; background:
   radial-gradient(circle at 92% 10%, rgba(93,198,196,.08), transparent 20%),
   radial-gradient(circle at 10% 90%, rgba(184,116,124,.10), transparent 20%);
}
.known-grid{display:grid; grid-template-columns:1fr auto; gap:24px; align-items:center; position:relative; z-index:1}
.known-copy{font-family:Cormorant Garamond, serif; font-size:clamp(1.55rem,2.25vw,2.3rem); line-height:1.5}
.known-copy ul{list-style:none; padding:0; margin:12px 0 0}
.known-copy li{margin:.22em 0}
.known-copy li::before{content:"•"; margin-right:.55em; color:var(--rose-soft)}
.known-media img{width:220px; aspect-ratio:1/1; object-fit:cover; border-radius:22px; border:1px solid rgba(240,217,178,.25)}
.story-grid{display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:center}
.story-copy{padding:14px 8px}
.story-copy h3{font-family:Cormorant Garamond, serif; font-size:clamp(2rem,4vw,3.2rem); color:var(--gold-soft); margin:0 0 10px}
.story-copy .tagline{font-family:Cormorant Garamond, serif; font-size:clamp(1.2rem,1.8vw,1.7rem); color:#eedcc8; margin-bottom:14px}
.story-copy p{font-family:Cormorant Garamond, serif; font-size:clamp(1.35rem,1.9vw,1.8rem); line-height:1.45; margin:0 0 10px}
.story-copy .scripture{font-size:1.05rem; letter-spacing:.05em; color:#d7c7b6}
.story-media{position:relative; min-height:600px; border-radius:30px; overflow:hidden; box-shadow:var(--shadow); border:1px solid rgba(240,217,178,.18)}
.story-media img{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; background:linear-gradient(180deg, rgba(14,10,12,.96), rgba(14,10,12,.86)); padding:10px}
.story-media::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(7,6,7,.05), rgba(7,6,7,.36))}
.cta-row{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:20px 0 26px}
.cta-tile{padding:20px 18px; text-align:center; border-radius:20px; border:1px solid rgba(240,217,178,.24); background:rgba(9,6,8,.55)}
.cta-tile h4{font-family:Cormorant Garamond, serif; font-size:clamp(1.4rem,1.7vw,1.8rem); margin:0 0 10px; color:var(--gold-soft)}
.cta-tile p{margin:0 0 14px; color:#ecdfce}
.feature-center{text-align:center; max-width:980px; margin:0 auto}
.feature-center h3{font-family:Cormorant Garamond, serif; font-size:clamp(2.6rem,5vw,4rem); margin:0 0 8px; color:var(--gold-soft)}
.feature-center p{font-family:Cormorant Garamond, serif; font-size:clamp(1.45rem,2vw,2rem); line-height:1.4; margin:0 auto 18px; max-width:820px}
.services-layout{display:grid; grid-template-columns:1.05fr .95fr; gap:28px; align-items:center}
.services-card{padding:30px}
.services-card h3{font-family:Cormorant Garamond, serif; font-size:clamp(2.2rem,4vw,3.3rem); margin:0 0 10px; color:var(--gold-soft)}
.services-card p, .services-card li{font-family:Cormorant Garamond, serif; font-size:clamp(1.28rem,1.75vw,1.65rem); line-height:1.42}
.services-card ul{padding-left:1.2em; margin:10px 0 20px}
.card-actions{display:flex; flex-wrap:wrap; gap:12px}
.product-strip{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:18px}
.product-card{overflow:hidden; border-radius:22px; border:1px solid rgba(240,217,178,.2); background:rgba(11,8,10,.56)}
.product-card img{width:100%; aspect-ratio:1/1; object-fit:cover}
.product-card .cap{padding:16px 14px 18px; text-align:center}
.product-card .cap h4{font-family:Cormorant Garamond, serif; font-size:1.55rem; margin:0 0 6px; color:var(--gold-soft)}
.product-card .cap p{margin:0 0 12px; color:#ebddcf}
.contact-grid{display:grid; grid-template-columns:1fr .9fr; gap:26px}
.form-card{padding:28px}
label{display:block; font-size:.92rem; color:#dbc9b5; margin-bottom:8px}
input, textarea{
  width:100%; padding:14px 16px; border-radius:16px; border:1px solid rgba(240,217,178,.16);
  background:rgba(255,255,255,.035); color:#fff; margin-bottom:16px; font:inherit
}
textarea{min-height:150px; resize:vertical}
.split-hero{display:grid; grid-template-columns:.9fr 1.1fr; gap:30px; align-items:center}
.split-hero .portrait{border-radius:30px; overflow:hidden; min-height:560px; box-shadow:var(--shadow); border:1px solid rgba(240,217,178,.18)}
.split-hero .portrait img{width:100%; height:100%; object-fit:cover}
.page-hero-copy h1{font-family:Cormorant Garamond, serif; font-size:clamp(3rem,6vw,4.8rem); color:var(--gold-soft); margin:0 0 8px}
.page-hero-copy p{font-family:Cormorant Garamond, serif; font-size:clamp(1.35rem,1.9vw,1.9rem); line-height:1.5}
.author-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:28px; align-items:start}
.author-intro{padding:26px}
.author-intro h2{font-family:Cormorant Garamond, serif; font-size:clamp(2.4rem,4vw,3.6rem); margin:0 0 10px; color:var(--gold-soft)}
.author-intro p{font-family:Cormorant Garamond, serif; font-size:clamp(1.3rem,1.8vw,1.7rem); line-height:1.47}
.book-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin-top:24px}
.book-card{padding:20px}
.book-card h3{font-family:Cormorant Garamond, serif; font-size:2rem; margin:0 0 8px; color:var(--gold-soft)}
.blog-hero{display:grid; grid-template-columns:1fr 1fr; gap:28px; align-items:center}
.blog-hero .image{border-radius:30px; overflow:hidden; min-height:620px; box-shadow:var(--shadow); border:1px solid rgba(240,217,178,.18)}
.blog-hero .image img{width:100%; height:100%; object-fit:cover}
.blog-toolbar{display:flex; flex-wrap:wrap; gap:12px; margin:20px 0}
.blog-list{display:grid; grid-template-columns:repeat(2,1fr); gap:22px; margin-top:18px}
.post-card{overflow:hidden; border-radius:24px; border:1px solid rgba(240,217,178,.18); background:rgba(11,8,10,.6)}
.post-card img{width:100%; aspect-ratio:16/10; object-fit:contain; background:linear-gradient(180deg, rgba(15,10,12,.96), rgba(15,10,12,.88)); padding:10px}
.post-card .content{padding:20px}
.post-card .meta{font-size:.82rem; letter-spacing:.12em; text-transform:uppercase; color:#cfbfae}
.post-card h3{font-family:Cormorant Garamond, serif; font-size:2rem; margin:8px 0 10px; color:var(--gold-soft)}
.post-card p{color:#eee0cf; line-height:1.5}
.post-view{max-width:980px; margin:0 auto}
.post-view .cover{border-radius:28px; overflow:hidden; margin-bottom:22px; border:1px solid rgba(240,217,178,.18)}
.post-view .cover img{width:100%; aspect-ratio:16/10; object-fit:contain; background:linear-gradient(180deg, rgba(15,10,12,.96), rgba(15,10,12,.88)); padding:14px}
.post-view article{padding:24px 28px}
.post-view article h1{font-family:Cormorant Garamond, serif; font-size:clamp(2.6rem,5vw,4rem); color:var(--gold-soft); margin:0 0 12px}
.post-view article .byline{color:#cfbfae; text-transform:uppercase; letter-spacing:.12em; font-size:.82rem; margin-bottom:20px}
.post-view article p, .post-view article li{font-family:Cormorant Garamond, serif; font-size:clamp(1.3rem,1.8vw,1.65rem); line-height:1.6}
.post-view article ul{padding-left:1.2em}
.writer-link{display:inline-flex; margin-top:18px; font-size:.9rem; color:#ceb99f}
.admin-shell{min-height:100vh; display:grid; place-items:center}
.admin-card{width:min(920px,94%); padding:26px}
.admin-toolbar{display:flex; flex-wrap:wrap; gap:10px; margin:16px 0 20px}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.small{font-size:.9rem;color:#ccbca8}
.footer{padding:36px 0 56px; text-align:center; color:#cdbca7}
.footer .footer-links{display:flex; flex-wrap:wrap; gap:14px; justify-content:center; margin:14px 0}
.hide{display:none !important}
@keyframes metal{
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
@media (max-width: 1020px){
  .hero-grid,.story-grid,.services-layout,.split-hero,.author-grid,.blog-hero,.contact-grid,.known-grid{grid-template-columns:1fr}
  .hero-panel{min-height:520px}
  .cta-row,.product-strip,.blog-list,.book-grid{grid-template-columns:1fr}
  .nav{flex-wrap:wrap}
  .nav-links{order:3; width:100%}
}
@media (max-width: 680px){
  .container{width:min(94%, var(--max))}
  .nav{padding:12px 0}
  .brand img{width:46px;height:46px}
  .hero{padding-top:40px}
  .hero-panel{min-height:420px}
  .btn,.btn-ghost{width:100%}
}

.floating-stack{position:fixed;right:18px;bottom:18px;display:flex;flex-direction:column;gap:10px;z-index:50}
.float-pill{display:inline-flex;align-items:center;justify-content:center;padding:12px 16px;border-radius:999px;text-decoration:none;font-weight:700;font-size:.95rem;box-shadow:var(--shadow);backdrop-filter:blur(8px);border:1px solid rgba(240,217,178,.22)}
.float-book{background:linear-gradient(135deg, rgba(183,138,84,.95), rgba(240,217,178,.8));color:#1a0d04}
.float-shop{background:rgba(11,8,10,.92);color:var(--gold-soft)}
.portal-link{font-size:.65rem;opacity:.16;letter-spacing:.24em;text-transform:uppercase;text-decoration:none;color:var(--rose-soft)}
.portal-link:hover{opacity:.55}
@media (max-width:680px){.floating-stack{right:12px;bottom:12px}.float-pill{padding:10px 14px;font-size:.88rem}}

.login-bottom{display:flex;justify-content:center;margin-top:28px}