/* The Careful Optimist — review release corrections — 24 Aug 2026
   Source: Website Review + Website Review 1 + Closer/Proof calibration discussion.
   Purpose: visual continuity, clarity, hierarchy and bounded premium-service presentation.
*/

/* ---------- START HERE: make the balancing statements register without shouting ---------- */
.oe-home-prototype .hp-balance-line{gap:16px!important;margin:30px 0 24px!important}
.oe-home-prototype .hp-balance-line span{
  position:relative;padding:17px 20px!important;border:1px solid rgba(128,99,31,.28)!important;
  border-top:2px solid #cba85a!important;background:linear-gradient(180deg,#fffdf8,#fbf6eb)!important;
  box-shadow:0 10px 26px rgba(11,29,52,.06);font-weight:700!important;letter-spacing:.005em
}

/* Poster / Pocket = a governing pair, not two incidental captions. */
.oe-home-prototype .hp-video-maxim{
  margin-top:34px!important;border:1px solid rgba(128,99,31,.24)!important;border-radius:12px;
  overflow:hidden;background:#fffdf8;box-shadow:0 12px 30px rgba(11,29,52,.07)
}
.oe-home-prototype .hp-video-maxim strong{padding:25px 28px!important;font-size:clamp(24px,2.35vw,32px)!important;line-height:1.2!important}
.oe-home-prototype .hp-video-maxim strong:first-child{background:linear-gradient(180deg,#fffdf8,#f8f1e5)}
.oe-home-prototype .hp-video-maxim strong:last-child{background:linear-gradient(180deg,#fbf4e7,#f3e6ce)}
.oe-home-prototype .hp-video-maxim strong+strong{border-left:1px solid rgba(128,99,31,.25)!important}

/* Six outputs: stronger numbers and separators, still editorial rather than card-heavy. */
.oe-home-prototype .hp-output-manifest{border-top:2px solid rgba(128,99,31,.28)!important}
.oe-home-prototype .hp-output-item{padding:30px 12px 30px 0!important;border-top:1px solid rgba(11,29,52,.20)!important}
.oe-home-prototype .hp-output-item span{font-size:36px!important;font-weight:700!important;color:#9a742d!important;letter-spacing:.02em}
.oe-home-prototype .hp-output-item h3{font-size:25px!important;color:#10243b!important}
.oe-home-prototype .hp-output-item p{font-size:15px!important;color:#53606d!important;line-height:1.55!important}

/* ---------- MASTER PHOTOGRAPHIC HERO FADE ----------
   Start Here remains the visual standard: image and copy occupy one composition. */
.oe-method-prototype .mp-hero-photo,.oe-proof-prototype .pp-hero-photo{width:76%!important;right:-5%!important}
.oe-method-prototype .mp-hero-photo img,.oe-proof-prototype .pp-hero-photo img{
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.08) 5%,rgba(0,0,0,.56) 20%,#000 39%,#000 100%)!important;
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.08) 5%,rgba(0,0,0,.56) 20%,#000 39%,#000 100%)!important
}
.oe-method-prototype .mp-hero:before,.oe-proof-prototype .pp-hero:before{
  background:linear-gradient(90deg,rgba(6,20,38,.99) 0%,rgba(6,20,38,.96) 34%,rgba(6,20,38,.80) 52%,rgba(6,20,38,.40) 68%,rgba(6,20,38,.09) 86%,rgba(6,20,38,.01) 100%)!important
}
.oe-bigger .oe-page-hero:before,.oe-faq-page .oe-page-hero:before{
  background:linear-gradient(90deg,rgba(6,20,38,.99) 0%,rgba(6,20,38,.96) 34%,rgba(6,20,38,.80) 52%,rgba(6,20,38,.40) 69%,rgba(6,20,38,.09) 87%,rgba(6,20,38,.01) 100%)!important
}
.oe-bigger .oe-page-hero>.oe-page-hero-image{object-position:66% 50%!important}
.oe-faq-page .oe-page-hero>.oe-page-hero-image{object-position:64% 48%!important}

/* Inner photographic heroes use the same long dissolve. */
.is-photo-hero__image{inset:0 0 0 34%!important;opacity:.94!important}
.is-photo-hero__image:after{
  background:linear-gradient(90deg,#0b1a2a 0%,rgba(11,26,42,.99) 16%,rgba(11,26,42,.84) 39%,rgba(11,26,42,.46) 60%,rgba(11,26,42,.10) 82%,rgba(11,26,42,.02) 100%)!important
}

/* Circle hero follows the same integrated composition. */
.circle-premium-hero::before{
  background:linear-gradient(90deg,rgba(12,21,33,.99) 0%,rgba(12,21,33,.96) 34%,rgba(12,21,33,.80) 52%,rgba(12,21,33,.40) 69%,rgba(12,21,33,.10) 87%,rgba(12,21,33,.02) 100%)!important
}
.circle-premium-hero{background-position:68% center!important}

/* ---------- THE CAREFUL CIRCLE: review-video finesse ---------- */
.circle-explanation-video .video-summary{
  margin:22px auto 0!important;padding:16px 20px!important;max-width:930px;border-left:3px solid #cba85a;
  background:#fffaf0;color:#394551!important;font-size:15px!important;line-height:1.6!important;
  box-shadow:0 8px 22px rgba(12,21,33,.055)
}
.circle-explanation-video .video-summary strong{color:#16273b!important}
.circle-bridge-visual figcaption{
  margin:0!important;padding:22px 26px 6px!important;color:#d5e0ea!important;font-size:16px!important;line-height:1.62!important;
  border-top:1px solid rgba(203,168,90,.22)
}
.circle-pattern-strip{align-items:stretch!important}
.circle-pattern-strip article{display:flex!important;flex-direction:column!important;min-height:150px!important}
.circle-pattern-strip article span{margin-top:auto!important;padding-top:8px}
.priority-cta-row{
  display:grid!important;grid-template-columns:minmax(220px,300px) 1fr!important;gap:18px!important;align-items:center!important;
  margin-top:26px!important;padding-top:23px!important;border-top:1px solid rgba(128,99,31,.20)!important
}
.priority-cta-row .btn{width:100%!important;justify-content:center!important}
.priority-cta-row>span{display:block!important;color:#58636d!important;font-size:14px!important;line-height:1.55!important}
.closer-editorial .priority-cta-row>span{color:#53606d!important}

/* ---------- HOW THE CIRCLE WORKS: same bridge family + cleaner ending ---------- */
.hcw-hero{
  background:
    linear-gradient(90deg,rgba(7,22,36,.99) 0%,rgba(7,22,36,.96) 34%,rgba(7,22,36,.82) 53%,rgba(7,22,36,.45) 70%,rgba(7,22,36,.12) 88%,rgba(7,22,36,.02) 100%),
    url('/assets/bridge-walkway-21-aug-2026.webp') 66% center/cover no-repeat!important;
  min-height:650px;display:flex;align-items:center
}
.hcw-hero::after{opacity:.12!important}
.hcw-hero-inner{width:min(calc(100% - 56px),1160px)!important;max-width:1160px!important;padding:86px 0 78px!important}
.hcw-hero-copy{max-width:650px!important}
.hcw-hero-route{max-width:960px}
.tco-page-how-circle .section.final.dark{border-bottom:16px solid #f7ead7!important;padding-bottom:78px!important}

/* ---------- COMPLETE GUIDE: hierarchy and contrast where the review showed fade-out ---------- */
.complete-guide-page .cg-position-section{background:#fffdf8!important}
.complete-guide-page .cg-position-section h2{color:#10243b!important}
.complete-guide-page .cg-position-section .lead{color:#465360!important}
.complete-guide-page .cg-position-grid{gap:16px!important}
.complete-guide-page .cg-position{
  background:#f7ead7!important;border:1px solid rgba(128,99,31,.29)!important;border-top:3px solid #cba85a!important;
  box-shadow:0 8px 24px rgba(12,21,33,.055)!important
}
.complete-guide-page .cg-position strong{color:#17314b!important;font-size:24px!important}
.complete-guide-page .cg-position p{color:#4f5b67!important}
.complete-guide-page .cg-position-section>.wrap>.small{color:#53606d!important;font-size:14.5px!important;line-height:1.6!important}
.complete-guide-page .section.dark .card{
  background:#fffaf0!important;border:1px solid rgba(203,168,90,.42)!important;color:#26313b!important;box-shadow:0 14px 34px rgba(0,0,0,.16)!important
}
.complete-guide-page .section.dark .card h3{color:#16273b!important}
.complete-guide-page .section.dark .card p{color:#46525e!important}

/* ---------- PROOF: dated-public-record cards and "what this means for you" ---------- */
.pp-public-sequence{display:grid;gap:14px;margin-top:34px}
.pp-public-post{display:grid;grid-template-columns:90px minmax(0,1fr) auto;gap:22px;align-items:center;padding:22px 24px;border:1px solid rgba(128,99,31,.24);background:#fffdf8}
.pp-public-post .pp-post-num{font-family:'Cormorant Garamond',Georgia,serif;font-size:31px;font-weight:700;color:#9a742d}
.pp-public-post h3{margin:0 0 5px!important;font-size:24px!important;color:#16273b!important}
.pp-public-post p{margin:0!important;color:#58636d!important;font-size:14.5px!important}
.pp-public-post a{white-space:nowrap}
.pp-meaning-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:34px}
.pp-meaning-grid article{padding:24px;border:1px solid rgba(128,99,31,.22);background:#fffdf8}
.pp-meaning-grid h3{font-size:25px!important;margin:0 0 8px!important}
.pp-meaning-grid p{font-size:15px!important;color:#53606d!important;margin:0!important}
.pp-deep-links{display:grid;grid-template-columns:1fr;gap:16px;margin-top:30px}
.pp-deep-card{padding:28px;border:1px solid rgba(128,99,31,.26);background:#fffaf0;text-align:left}
.pp-deep-card h3{font-size:30px!important;margin:0 0 10px!important}
.pp-deep-card p{margin-bottom:18px!important}
.pp-legacy-line{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(26px,3vw,36px);line-height:1.25;color:#16273b;border-left:3px solid #cba85a;padding-left:22px;margin:28px 0}

/* Deep-evidence page: deliberately quieter than normal inner navigation. */
.deep-evidence-bar{background:#0c1521;border-bottom:1px solid rgba(203,168,90,.24)}
.deep-evidence-bar__inner{width:min(calc(100% - 52px),1120px);margin:0 auto;padding:15px 0;display:flex;align-items:center;justify-content:space-between;gap:22px}
.deep-evidence-bar img{display:block;width:230px;max-width:48vw;height:auto}
.deep-evidence-bar a:last-child{color:#e6c97e;text-decoration:none;text-transform:uppercase;letter-spacing:1.2px;font-size:11px;font-weight:700}
.deep-evidence-note{max-width:780px;margin:0 auto 24px;padding:16px 20px;border-left:3px solid #cba85a;background:rgba(203,168,90,.07);color:#cbd6e0;font-size:14.5px}

@media(max-width:900px){
  .priority-cta-row{grid-template-columns:1fr!important}
  .pp-public-post{grid-template-columns:70px 1fr!important}.pp-public-post a{grid-column:2;justify-self:start}
  .pp-meaning-grid{grid-template-columns:1fr!important}
}
@media(max-width:760px){
  .oe-home-prototype .hp-video-maxim strong+strong{border-left:0!important;border-top:1px solid rgba(128,99,31,.25)!important}
  .is-photo-hero__image{inset:0!important;opacity:.42!important}.is-photo-hero__image:after{background:linear-gradient(90deg,rgba(11,26,42,.99),rgba(11,26,42,.90) 62%,rgba(11,26,42,.66))!important}
  .hcw-hero{min-height:0;background-position:70% center!important}.hcw-hero-inner{width:min(calc(100% - 34px),1160px)!important;padding:68px 0 62px!important}
  .pp-public-post{grid-template-columns:1fr!important;gap:8px}.pp-public-post a{grid-column:auto}.pp-public-post .pp-post-num{font-size:24px}
  .deep-evidence-bar__inner{width:min(calc(100% - 34px),1120px);flex-direction:column;align-items:flex-start}
}

/* Complete Guide dark credibility chapter: the surface itself owns its foreground colours. */
.complete-guide-page .section.dark{background:#0b1a2a!important;color:#dce5ed!important}
.complete-guide-page .section.dark h2,.complete-guide-page .section.dark> .wrap>h2{color:#fff7e9!important}
.complete-guide-page .section.dark> .wrap>p,.complete-guide-page .section.dark .lead{color:#d5e0e9!important}
