/*
Theme Name: Oaken Oath Mission Button Fixed Theme
Theme URI: https://oakenoath.com
Author: Oaken Oath
Description: Full WordPress upload-ready launch theme with updated Oaken Oath logo, clickable donation pages, and mooring ceremony image on About page.
Version: 29.0
Requires at least: 5.9
Text Domain: oaken-oath-launch-theme-mooring-image
*/

:root{
  --navy:#09243a;
  --navy2:#123955;
  --cream:#f7f0e4;
  --paper:#fffaf1;
  --gold:#b58a44;
  --softgold:#d8bd7a;
  --ink:#14263a;
  --muted:#5d6266;
  --line:rgba(181,138,68,.35);
}
*{box-sizing:border-box}
body{margin:0;background:var(--cream);color:var(--ink);font-family:"Segoe UI",Arial,sans-serif}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.site-header{
  background:rgba(255,250,241,.98);
  border-bottom:1px solid var(--line);
  padding:14px 6vw;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  position:relative;
  z-index:10;
}
.logo-wrap{display:flex;align-items:center;gap:14px;text-decoration:none}
.logo-wrap img.hh-logo{width:92px;border-radius:50%}
.logo-wrap img.oo-logo{width:190px;max-height:110px;object-fit:contain}
.logo-text{font-family:Georgia,"Times New Roman",serif;color:var(--navy);font-size:clamp(24px,3vw,42px);line-height:1}
.logo-sub{color:var(--gold);letter-spacing:.28em;text-transform:uppercase;font-size:12px}
.main-nav{display:flex;gap:22px;align-items:center}
.main-nav a{text-decoration:none;text-transform:uppercase;letter-spacing:.12em;font-weight:700;font-size:13px;color:var(--navy)}
.main-nav .button-link{background:var(--navy);color:white;padding:13px 20px;border-radius:4px}
.hero{
  min-height:620px;
  display:grid;
  grid-template-columns:1fr .9fr;
  align-items:center;
  gap:48px;
  padding:72px 6vw;
  background:
    radial-gradient(circle at 82% 30%, rgba(216,189,122,.28), transparent 18rem),
    radial-gradient(circle at 15% 20%, rgba(255,255,255,.9), transparent 20rem),
    linear-gradient(135deg,var(--paper),var(--cream));
  overflow:hidden;
}
.hero-art{
  min-height:430px;
  border:1px solid var(--line);
  box-shadow:0 24px 70px rgba(9,36,58,.16);
  background:
    radial-gradient(circle at 50% 35%, rgba(255,250,241,.92), rgba(247,240,228,.72) 42%, rgba(9,36,58,.08) 100%),
    url("assets/oaken-oath-logo.png") center/72% no-repeat;
}
.hero-art.hh{
  background:
    radial-gradient(circle at 50% 35%, rgba(255,250,241,.92), rgba(247,240,228,.76) 42%, rgba(9,36,58,.08) 100%),
    url("assets/hearth-harbor-logo.jpeg") center/68% no-repeat;
}
.eyebrow{color:var(--gold);text-transform:uppercase;letter-spacing:.22em;font-weight:700;font-size:13px}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;color:var(--navy);font-weight:500;line-height:1.05}
h1{font-size:clamp(48px,7vw,92px);margin:14px 0 20px}
h2{font-size:clamp(34px,5vw,58px);margin:0 0 18px}
h3{font-size:24px;margin:0 0 10px}
.lead{font-size:clamp(18px,2vw,23px);line-height:1.58;max-width:800px}
.section{padding:78px 6vw}
.paper{background:var(--paper)}
.center{text-align:center;max-width:1040px;margin:auto}
.two{display:grid;grid-template-columns:1.2fr 0.8fr;gap:56px;align-items:center}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.five{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.card{background:rgba(255,250,241,.82);border:1px solid var(--line);padding:30px;box-shadow:0 18px 55px rgba(9,36,58,.08)}
.card p{line-height:1.65;color:var(--muted)}
.divider{display:flex;justify-content:center;align-items:center;gap:14px;color:var(--gold);margin:18px auto 32px}
.divider:before,.divider:after{content:"";width:150px;height:1px;background:var(--gold)}
.values{background:radial-gradient(circle at 10% 10%,rgba(216,189,122,.25),transparent 25rem),linear-gradient(135deg,var(--navy),var(--navy2));color:white}
.values h2,.values h3{color:white}
.values p{color:rgba(255,255,255,.82);line-height:1.55}
.value{text-align:center;padding:20px 14px;border-left:1px solid rgba(216,189,122,.35)}
.value:first-child{border-left:0}
.icon{width:66px;height:66px;border:1px solid rgba(216,189,122,.55);border-radius:50%;display:grid;place-items:center;margin:0 auto 18px;color:var(--softgold);font-size:30px}
.mission-art-wrap{background:#0a1f33;padding:0}
.mission-click-wrap{position:relative;width:100%;max-width:1180px;margin:0 auto;border-left:1px solid rgba(216,189,122,.35);border-right:1px solid rgba(216,189,122,.35)}
.mission-art{width:100%;display:block}
.mission-hotspot{position:absolute;display:block;z-index:5;border-radius:6px}
.mission-hotspot:focus{outline:3px solid #d8bd7a;outline-offset:2px}
.hotspot-paypal{left:38%;bottom:3.7%;width:10.5%;height:2.8%}
.hotspot-cashapp{left:58.2%;bottom:3.7%;width:10.5%;height:2.8%}
.hotspot-getinvolved{left:76%;bottom:11.1%;width:13%;height:4.4%}
.donation-link-strip{display:grid;grid-template-columns:repeat(2, minmax(220px, 1fr));gap:18px;max-width:760px;margin:26px auto 0}
.focus-img,.mooring-img{border:1px solid var(--line);box-shadow:0 24px 70px rgba(9,36,58,.22)}
.mooring-img{border-radius:6px}
.work-item{border-bottom:1px solid var(--line);padding:0 0 18px;margin-bottom:18px}
.work-item p{margin:0;line-height:1.6;color:var(--muted)}
.donation-card{text-align:center;border:1px solid var(--line);background:var(--paper);padding:36px 24px;box-shadow:0 18px 55px rgba(9,36,58,.08)}
.price{font-family:Georgia,"Times New Roman",serif;font-size:56px;color:var(--navy);margin:8px 0}
.btn{display:inline-block;background:var(--navy);color:white;text-decoration:none;padding:14px 24px;text-transform:uppercase;letter-spacing:.1em;font-weight:700;font-size:13px;border-radius:4px}
.btn.gold{background:var(--gold)}
.btn.green{background:#16a34a}
.cta{background:linear-gradient(rgba(9,36,58,.78),rgba(9,36,58,.78)),url("assets/mooring-ceremony-ropes.png") center/cover no-repeat;color:white;text-align:center;padding:72px 6vw}
.cta h2,.cta p{color:white}
.cta p{font-family:Georgia,"Times New Roman",serif;font-size:clamp(24px,3vw,38px);max-width:980px;margin:0 auto 28px;line-height:1.35}
.site-footer{background:#061827;color:rgba(255,255,255,.78);padding:42px 6vw;text-align:center}
.footer-logo{width:120px;margin:0 auto 16px;border-radius:50%;display:block}
.note{font-size:14px;color:var(--muted);line-height:1.6}
.landing-box{max-width:760px;margin:0 auto;background:var(--paper);border:1px solid var(--line);box-shadow:0 24px 70px rgba(9,36,58,.12);padding:48px;text-align:center}
@media(max-width:900px){
  .site-header{display:block;text-align:center}
  .logo-wrap{justify-content:center}
  .main-nav{justify-content:center;flex-wrap:wrap;margin-top:16px}
  .hero,.two,.three,.five{grid-template-columns:1fr}
  .hero-art{min-height:320px}
  .value{border-left:0;border-top:1px solid rgba(216,189,122,.35)}
  .value:first-child{border-top:0}
  .logo-wrap img.oo-logo{margin:auto;width:210px}
  .donation-link-strip{grid-template-columns:1fr}
}

.mooring-img{
  width:100%;
  max-height:520px;
  object-fit:cover;
}


/* Dreamy homepage upgrade */
.home-hero-dream{
  min-height:720px;
  display:grid;
  grid-template-columns:.86fr 1.14fr;
  align-items:center;
  gap:40px;
  padding:82px 6vw;
  background:
    linear-gradient(90deg, rgba(255,250,241,.96) 0%, rgba(255,250,241,.86) 34%, rgba(255,250,241,.20) 62%),
    url("assets/homepage-dream-hero.png") center right/cover no-repeat;
  border-bottom:1px solid var(--line);
  position:relative;
  overflow:hidden;
}
.home-hero-dream:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 55% 32%, rgba(255,255,255,.28), transparent 18rem),
    radial-gradient(circle at 84% 72%, rgba(216,189,122,.18), transparent 22rem);
}
.home-hero-copy{
  position:relative;
  z-index:2;
  max-width:610px;
}
.home-hero-copy h1{
  color:#4f3147;
  font-size:clamp(52px,7.5vw,104px);
}
.home-script{
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
  font-size:clamp(23px,2.7vw,36px);
  color:#9b7744;
  line-height:1.35;
  margin:26px 0 34px;
}
.home-actions{
  display:flex;
  align-items:center;
  gap:22px;
  flex-wrap:wrap;
}
.btn.outline{
  background:transparent;
  color:#4f3147;
  border-bottom:1px solid #4f3147;
  border-radius:0;
  padding-left:0;
  padding-right:0;
}
.home-feature-strip{
  background:rgba(255,250,241,.96);
  border-bottom:1px solid var(--line);
  padding:36px 6vw;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:32px;
}
.home-feature{
  display:grid;
  grid-template-columns:52px 1fr;
  gap:18px;
  align-items:start;
}
.home-feature-icon{
  width:52px;height:52px;border:1px solid var(--line);border-radius:50%;
  display:grid;place-items:center;color:var(--gold);font-size:25px;
}
.home-feature h3{
  font-size:18px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.home-feature p{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}
@media(max-width:900px){
  .home-hero-dream{
    grid-template-columns:1fr;
    background:
      linear-gradient(rgba(255,250,241,.86),rgba(255,250,241,.86)),
      url("assets/homepage-dream-hero.png") center/cover no-repeat;
  }
  .home-feature-strip{grid-template-columns:1fr}
}


/* --- TEXT WRAP FIX (GLOBAL CLEANUP) --- */

.section,
.paper,
.values,
.center {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  text-align: center;
}

h1, h2, h3 {
  line-height: 1.2;
  letter-spacing: -0.02em;
  margin-bottom: 18px;
}

p,
.lead {
  line-height: 1.65;
  font-size: 17px;
  max-width: 680px;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 1200px) {
  .section,
  .paper,
  .values {
    max-width: 720px;
  }
}

.lead {
  font-weight: 300;
  color: #2e3a42;
}

.section h2 {
  font-size: clamp(28px, 3vw, 42px);
}


/* Cash App QR contribution section */
.qr-card{
  max-width:760px;
  margin:36px auto 0;
  background:var(--paper);
  border:1px solid var(--line);
  box-shadow:0 24px 70px rgba(9,36,58,.12);
  padding:42px;
  text-align:center;
}
.qr-card img{
  width:min(320px, 82vw);
  margin:18px auto 22px;
  border:12px solid white;
  box-shadow:0 18px 44px rgba(9,36,58,.16);
}
.qr-card .price{
  margin-top:0;
}


/* Mooring Ceremony gallery update */
.mooring-gallery{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
  margin-top:46px;
}
.mooring-gallery img{
  width:100%;
  border:1px solid var(--line);
  box-shadow:0 24px 70px rgba(9,36,58,.16);
  border-radius:6px;
}
.gallery-caption{
  max-width:860px;
  margin:28px auto 0;
  text-align:center;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(20px,2.2vw,30px);
  color:var(--navy);
  line-height:1.35;
}
@media(max-width:900px){
  .mooring-gallery{grid-template-columns:1fr}
}

/* Continuation Ceremony gallery */
.continuation-gallery{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
  margin-top:42px;
}
.continuation-gallery img{
  width:100%;
  border:1px solid var(--line);
  border-radius:6px;
  box-shadow:0 24px 70px rgba(9,36,58,.16);
}
.continuation-feature{
  margin-top:48px;
}
@media(max-width:900px){
  .continuation-gallery{grid-template-columns:1fr}
}


/* Warm Oaken Oath Header Upgrade */
.site-header{
  background:
    radial-gradient(circle at 18% 18%, rgba(181,138,68,.18), transparent 14rem),
    radial-gradient(circle at 82% 12%, rgba(79,49,71,.10), transparent 16rem),
    linear-gradient(180deg, #fffaf1 0%, #f4eadb 100%) !important;
  border-bottom:1px solid rgba(181,138,68,.34) !important;
  box-shadow:0 16px 45px rgba(9,36,58,.10);
  padding:22px 6vw 20px !important;
  flex-direction:column;
  justify-content:center;
  gap:18px !important;
  overflow:hidden;
}

.site-header:before,
.site-header:after{
  content:"";
  position:absolute;
  top:10px;
  width:260px;
  height:150px;
  opacity:.26;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 20% 60%, rgba(181,138,68,.42) 0 9px, transparent 10px),
    radial-gradient(ellipse at 38% 42%, rgba(79,49,71,.28) 0 8px, transparent 9px),
    radial-gradient(ellipse at 58% 64%, rgba(181,138,68,.34) 0 10px, transparent 11px),
    radial-gradient(ellipse at 75% 40%, rgba(83,101,70,.28) 0 9px, transparent 10px);
  filter:blur(.2px);
}

.site-header:before{
  left:4vw;
  transform:rotate(-18deg);
}

.site-header:after{
  right:4vw;
  transform:scaleX(-1) rotate(-18deg);
}

.logo-wrap{
  position:relative;
  z-index:2;
  flex-direction:column;
  gap:6px !important;
}

.logo-wrap:after{
  content:"";
  width:min(360px, 64vw);
  height:1px;
  margin-top:6px;
  background:linear-gradient(90deg, transparent, rgba(181,138,68,.70), transparent);
}

.logo-wrap img.oo-logo{
  width:clamp(135px, 17vw, 230px) !important;
  max-height:140px !important;
  filter:drop-shadow(0 10px 18px rgba(9,36,58,.20));
  transform:translateY(2px);
}

.logo-wrap img.hh-logo{
  width:clamp(82px, 10vw, 112px) !important;
  filter:drop-shadow(0 10px 18px rgba(9,36,58,.18));
}

.logo-text{
  text-shadow:0 5px 18px rgba(9,36,58,.10);
}

.main-nav{
  position:relative;
  z-index:2;
  justify-content:center;
  background:rgba(255,250,241,.54);
  border:1px solid rgba(181,138,68,.22);
  border-radius:999px;
  padding:10px 16px;
  box-shadow:0 10px 28px rgba(9,36,58,.06);
}

.main-nav a{
  letter-spacing:.16em !important;
}

.main-nav .button-link{
  box-shadow:0 10px 24px rgba(9,36,58,.18);
}

@media(max-width:900px){
  .site-header{
    padding:18px 4vw 18px !important;
  }
  .site-header:before,
  .site-header:after{
    width:150px;
    opacity:.18;
  }
  .main-nav{
    border-radius:18px;
    padding:10px 12px;
  }
}

/* Sanded Laminate Shimmer Overlay */
.site-header::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    repeating-linear-gradient(
      120deg,
      rgba(255,255,255,.06) 0px,
      rgba(255,255,255,.06) 1px,
      transparent 2px,
      transparent 4px
    ),
    repeating-linear-gradient(
      60deg,
      rgba(181,138,68,.04) 0px,
      rgba(181,138,68,.04) 1px,
      transparent 2px,
      transparent 5px
    );
  opacity:.35;
  mix-blend-mode:overlay;
  animation: shimmerDrift 18s linear infinite;
}

@keyframes shimmerDrift{
  0%{transform:translateX(0) translateY(0);}
  50%{transform:translateX(-20px) translateY(10px);}
  100%{transform:translateX(0) translateY(0);}
}


/* Grand Opening Header Ribbon */
.grand-opening-ribbon{
  position:relative;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  width:min(720px, 92vw);
  margin:2px auto 0;
  padding:10px 22px;
  border:1px solid rgba(181,138,68,.38);
  border-radius:999px;
  background:
    linear-gradient(90deg, rgba(255,250,241,.62), rgba(216,189,122,.20), rgba(255,250,241,.62));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.62),
    0 10px 26px rgba(9,36,58,.07);
  color:#6f4f28;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(14px, 1.5vw, 19px);
  letter-spacing:.14em;
  text-transform:uppercase;
  text-align:center;
}

.grand-opening-ribbon:before,
.grand-opening-ribbon:after{
  content:"";
  height:1px;
  flex:1;
  max-width:120px;
  background:linear-gradient(90deg, transparent, rgba(181,138,68,.62), transparent);
}

.ribbon-flourish{
  color:#b58a44;
  font-size:.9em;
  opacity:.9;
}

@media(max-width:900px){
  .grand-opening-ribbon{
    border-radius:18px;
    letter-spacing:.08em;
    line-height:1.35;
    padding:10px 16px;
  }
  .grand-opening-ribbon:before,
  .grand-opening-ribbon:after{
    display:none;
  }
}


/* Hearth & Harbor Pack CTA Upgrade */
.pack-impact{
  background:
    radial-gradient(circle at 12% 18%, rgba(216,189,122,.24), transparent 24rem),
    radial-gradient(circle at 88% 20%, rgba(255,255,255,.28), transparent 20rem),
    linear-gradient(135deg, #fffaf1, #f7f0e4);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.pack-impact .impact-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:22px;
  margin-top:34px;
}

.impact-stat{
  background:rgba(255,250,241,.88);
  border:1px solid var(--line);
  box-shadow:0 18px 55px rgba(9,36,58,.08);
  padding:28px 20px;
  text-align:center;
}

.impact-stat strong{
  display:block;
  font-family:Georgia,"Times New Roman",serif;
  color:var(--navy);
  font-size:clamp(28px, 3vw, 46px);
  line-height:1;
  margin-bottom:10px;
}

.experiment-bucket{
  background:linear-gradient(135deg, var(--navy), var(--navy2));
  color:white;
}

.experiment-bucket h2,
.experiment-bucket h3,
.experiment-bucket p{
  color:white;
}

@media(max-width:900px){
  .pack-impact .impact-grid{
    grid-template-columns:1fr;
  }
}

.btn + .btn{margin-left:12px;margin-top:10px;}@media(max-width:700px){.btn + .btn{margin-left:0}.donation-card .btn{display:block;margin:10px auto 0;max-width:220px}}

.gofundme-qr-card{
  max-width:820px;
  margin:36px auto 0;
  background:var(--paper);
  border:1px solid var(--line);
  box-shadow:0 24px 70px rgba(9,36,58,.12);
  padding:42px;
  text-align:center;
}
.gofundme-qr-card img{
  width:min(520px, 90vw);
  margin:18px auto 24px;
  border-radius:18px;
  box-shadow:0 18px 44px rgba(9,36,58,.16);
}

/* Final full rebuild: direct QR landing pages */
.gofundme-direct-landing,
.cashapp-direct-landing{
  min-height:620px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.qr-card,
.gofundme-landing-card{
  max-width:820px;
  margin:36px auto;
  background:var(--paper);
  border:1px solid var(--line);
  box-shadow:0 24px 70px rgba(9,36,58,.12);
  padding:42px;
  text-align:center;
}

.qr-card img{
  width:min(320px, 82vw);
  margin:18px auto 22px;
  border:12px solid white;
  box-shadow:0 18px 44px rgba(9,36,58,.16);
}

.gofundme-landing-card img{
  width:min(560px, 90vw);
  margin:18px auto 24px;
  border-radius:18px;
  box-shadow:0 18px 44px rgba(9,36,58,.16);
}

.btn + .btn{
  margin-left:12px;
  margin-top:10px;
}

@media(max-width:900px){
  .btn + .btn{margin-left:0;}
  .donation-card .btn{display:block;margin:10px auto 0;max-width:220px;}
  .gofundme-landing-card,
  .qr-card{padding:28px 18px;}
}