/* Business-content adaptations only. Source layout, font families, palette and motion stay intact. */
.jeff-ambient-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.22;pointer-events:none}
#reel>.jeff-ambient-image{opacity:.25;filter:saturate(.65)}
.page-hero{overflow:hidden}
.page-hero>.breadcrumb,.page-hero>h1,.page-hero>.page-desc,.page-hero>.kicker{position:relative;z-index:2}
.jeff-detail-link{display:inline-block;color:var(--accent);font-weight:600;text-decoration:none;margin-top:1.3rem}
.value-card p{line-height:1.65}
.pricing-card.popular::before{content:'Step 02'}
.nav-logo,.logo,.footer-brand-name{overflow-wrap:normal}
.footer-brand-name{font-size:clamp(.95rem,1.5vw,1.3rem)}
.jeff-merchant-nav{display:inline-flex;align-items:center;min-height:44px;color:var(--accent);font-family:var(--font-body);font-size:.85rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.jeff-merchant-nav:hover,.jeff-merchant-login:focus-visible{color:#fff;text-decoration:underline;text-underline-offset:5px}
#navbar .jeff-merchant-nav{margin-right:1.5rem}
.mobile-menu .jeff-merchant-login{color:var(--accent)}
body:has(.mobile-menu.open) :is(#wa-float,#wt-calc-float,#sound-toggle){visibility:hidden;pointer-events:none}
@media(max-width:1024px){.jeff-merchant-nav{display:none}}
.testimonial-quote::before{content:none}
.contact-points li>span:last-child{display:block;max-width:28rem}
#wa-float{color:var(--accent)!important;border-color:rgba(216,180,254,.35)!important;background:#12101b!important}
#wa-float::before,#wa-float::after{border-color:rgba(216,180,254,.3)!important}
/* Fixed source-like title/description proportions: long business terms must not shrink the copy column. */
@media(min-width:1025px){
 #hero .hero-bottom{grid-template-columns:minmax(0,3fr) minmax(0,2fr)}
 #hero .hero-left,#hero .hero-right{min-width:0}
 #hero h1,#hero #typed-heading{font-size:clamp(2.8rem,6vw,8rem)}
}
@media(max-width:600px){
 .nav-logo,.logo{font-size:.83rem!important;letter-spacing:.12em!important}
 #navbar>.nav-logo,#navbar>.logo{max-width:calc(100% - 55px)}
 .footer-brand-name{font-size:1rem;letter-spacing:.12em}
 #hero h1{font-size:clamp(2.35rem,11.5vw,4.5rem)}
 #capabilities h2,#process h2{font-size:clamp(1.55rem,6.5vw,2.1rem)}
 .page-hero h1{overflow-wrap:normal;word-break:normal;font-size:clamp(2rem,9vw,3.5rem)}
 .contact-intro h1{font-size:clamp(2.1rem,10vw,4rem)}
}
/* Shared service discovery; same source palette, type and motion, no new theme. */
.bento-grid.jeff-service-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto}
.jeff-service-grid .bento-item:nth-child(n){grid-column:auto;grid-row:auto;min-height:300px;text-align:left;color:var(--text);font:inherit}
.jeff-service-grid .bento-item:last-child{grid-column:1/-1;min-height:230px}
.jeff-service-grid .bento-item h3{margin-top:0;font-size:clamp(1.25rem,1.7vw,1.75rem)}
.jeff-service-grid .bento-item p{max-width:46rem}
.jeff-service-card-action{position:relative;z-index:2;display:flex;align-items:center;min-height:44px;color:var(--accent);font-size:1rem;font-weight:600;margin-top:1rem}
.jeff-service-grid .bento-item:focus-visible,.h-project:focus-visible{outline:2px solid #f1deff;outline-offset:5px}
button.h-project{border:0;text-align:left;color:var(--text);font:inherit;flex-shrink:0}
.h-project .jeff-example-service{margin-bottom:1.5rem;font-size:.95rem;font-weight:600;color:#ead7ff}
.jeff-example-notice{color:#b6b0c4;font-size:.95rem;line-height:1.6;margin-top:1rem;max-width:64rem}
.jeff-service-list{padding-left:1.25rem;margin:1.5rem 0;line-height:1.65;color:var(--text-muted)}
.jeff-service-list li+li{margin-top:.65rem}
/* Shared overview layout. The overview variants load different page CSS, so
   keep this contract here and cap intrinsic image widths on mobile. */
.story-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,5rem);align-items:center;margin-top:3rem;min-width:0}
.story-text{min-width:0;font-size:1.08rem;line-height:1.8;color:#ddd;font-weight:500}
.story-text p{margin:0 0 1.5rem}
.story-text p:last-child{margin-bottom:0}
.story-image{width:100%;max-width:100%;aspect-ratio:4/3;background:linear-gradient(135deg,rgba(139,92,246,.15),rgba(99,102,241,.1));border-radius:20px;border:1px solid rgba(255,255,255,.05);display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;min-width:0}
.story-image img{display:block;width:100%;height:100%;max-width:100%;object-fit:cover;transition:transform .8s ease}
.story-image:hover img{transform:scale(1.04)}
.values-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;margin-top:3rem;min-width:0}
.value-card{min-width:0;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:2rem;transition:background .35s,border-color .35s,transform .35s}
.value-card:hover{background:rgba(255,255,255,.04);border-color:var(--accent-dim);transform:translateY(-3px)}
.value-card h3{font-family:var(--font-head);font-size:clamp(1rem,1.5vw,1.35rem);font-weight:700;text-transform:uppercase;letter-spacing:.04em;line-height:1.25;margin:0 0 1rem}
.value-card p{color:var(--text-muted);line-height:1.65;font-size:1rem;font-weight:500}
@media(max-width:900px){.story-grid{grid-template-columns:1fr}.values-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.jeff-detail-link{min-height:44px;display:inline-flex;align-items:center;gap:.5rem}
.jeff-detail-link:focus-visible{outline:2px solid #f1deff;outline-offset:4px;border-radius:4px}
.jeff-modal-service-action{align-self:flex-start;padding:.35rem 0;font-size:1rem}
dialog#detail-modal{margin:0;padding:0;border:0;max-width:none;max-height:none;color:var(--text)}
dialog#detail-modal:not([open]){display:none}
dialog#detail-modal::backdrop{background:transparent}
dialog#detail-modal .close-btn{min-height:48px;min-width:48px}
dialog#detail-modal .close-btn:focus-visible{outline:2px solid #f1deff;outline-offset:4px}
/* The inherited transition watermark is a visible brand, not a business capability. */
#wt-page-wipe::after{content:'JEFF’S ENTERPRISE'}
.jeff-service-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}
.jeff-service-detail-grid h2{font-size:clamp(1.4rem,2.2vw,2rem);line-height:1.25}
.jeff-service-detail-grid .value-card{min-width:0}
.drawer-project-num[hidden]{display:none}
@media(max-width:1000px){.bento-grid.jeff-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){
 .story-grid{gap:2rem;margin-top:2rem}
 .story-text{font-size:1rem;line-height:1.7}
 .story-image{aspect-ratio:16/10}
 .values-grid{grid-template-columns:minmax(0,1fr);gap:1rem;margin-top:2rem}
 .value-card{padding:1.5rem}
 .bento-grid.jeff-service-grid,.jeff-service-detail-grid{grid-template-columns:minmax(0,1fr)}
 .jeff-service-grid .bento-item:nth-child(n){grid-column:auto;min-height:260px;padding:1.5rem}
 .jeff-service-detail-grid{gap:1rem}
 .jeff-service-detail-grid .value-card{padding:1.5rem}
 .jeff-detail-link{min-height:48px}
 .jeff-example-notice{font-size:.9rem}
}

/* Footer section headings keep the original h4 visual treatment, with logical h2 semantics. */
.footer-col h2 { font-family: var(--font-head); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.25em; text-transform: uppercase; color: var(--accent); margin: 0 0 1.5rem; }
/* Keep an 8px visible scenario dot inside a 24px keyboard/touch target.
   The previous border-box 8px width plus 16px padding left no painted content. */
.testimonial-dots { gap: 0.25rem; }
.t-dot { width: 24px; height: 24px; padding: 8px; background-color: rgba(255,255,255,0.4); }
.testimonial-nav { gap: 1rem; }