/*
Theme Name: JB Designs Frameworx
Theme URI: https://sandiegodesignbuild.com/
Author: JB Designs
Author URI: https://sandiegodesignbuild.com/
Description: A custom one-page WordPress theme for JB Designs.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: jb-designs-frameworx
*/

:root{--black:#121719;--white:#fff;--mist:#f1f1f3;--line:#d9d9dd}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;color:#111;font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}p,h1,h2,h3{margin-top:0}.screen-reader-text{position:absolute;left:-9999px}.masthead{min-height:138px;padding:24px 6vw;display:flex;justify-content:space-between;align-items:center;background:#fff}.signature{width:min(680px,56vw);display:block}.masthead nav{display:flex;gap:26px;align-items:center;font-size:11px;letter-spacing:.14em;text-transform:uppercase}.outline{border:1px solid #111;padding:14px 18px}.instagram-bar{height:34px;background:#eeeef2;border-radius:20px;margin:0 1.5vw 20px;display:flex;align-items:center;justify-content:center;font-size:10px;letter-spacing:.11em}.instagram-bar span{margin-left:12px}.dark-grid{background-color:var(--black);background-image:radial-gradient(rgba(255,255,255,.08) 1px,transparent 1px);background-size:20px 20px;color:#fff}.hero{min-height:760px;margin:0 1.5vw;display:grid;grid-template-columns:55% 45%;align-items:center;overflow:hidden}.hero-copy{padding:90px 3vw 90px 6vw;position:relative;z-index:2}.kicker,.overline{font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}.hero h1{font-size:clamp(46px,5vw,78px);line-height:1.02;letter-spacing:-.045em;font-weight:400;margin:38px 0 32px}.hero h1 strong{font-size:.82em;font-weight:600}.hero-copy>p:last-of-type{max-width:710px;color:#ced0d0;font-size:16px;line-height:1.7}.actions{display:flex;align-items:center;gap:28px;margin-top:42px}.solid{display:inline-flex;min-height:52px;align-items:center;background:#fff;color:#111;padding:0 22px;text-transform:uppercase;font-size:10px;font-weight:700;letter-spacing:.13em}.line-link{font-size:10px;letter-spacing:.13em;text-transform:uppercase;border-bottom:1px solid #777;padding-bottom:7px}.hero-render{height:100%;min-height:760px;position:relative;background:#333;overflow:hidden}.hero-render:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(18,23,25,.6),transparent 35%)}.hero-render img{width:100%;height:100%;object-fit:cover}.hero-render span{position:absolute;z-index:2;right:22px;bottom:24px;font-size:9px;letter-spacing:.18em;writing-mode:vertical-rl}.intro,.portfolio,.process,.founder{padding:120px 7vw}.intro .overline{color:#777}.intro h2,.section-title h2,.founder h2,.contact h2{font-size:clamp(45px,6vw,90px);line-height:.98;letter-spacing:-.055em;font-weight:500}.intro h2{max-width:1050px;margin:48px 0 70px}.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:10vw;margin-left:20%}.intro-grid p,.founder>div:last-child>p:last-child{font-size:16px;line-height:1.8;color:#5e6061}.portfolio{background:#f0f0f2}.section-title{display:flex;justify-content:space-between;align-items:flex-start;gap:40px}.section-title h2{max-width:850px}.render-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:70px}.render-grid article{background:#fff}.render-grid img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}.render-grid article div{padding:18px;display:flex;justify-content:space-between;gap:20px;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.render-grid article p{margin:0}.why{padding:120px 7vw}.inverse{color:#fff}.benefits{display:grid;grid-template-columns:repeat(4,1fr);margin-top:70px;border-top:1px solid #555}.benefits article{padding:30px 26px 60px;border-right:1px solid #555}.benefits span{color:#888;font-size:10px}.benefits h3{font-size:22px;margin:55px 0 18px}.benefits p{color:#aaa;line-height:1.65;font-size:13px}.steps{margin-top:70px;border-top:1px solid #aaa}.steps article{display:grid;grid-template-columns:12% 1fr;padding:34px 0;border-bottom:1px solid #aaa}.steps span{font-size:11px;color:#777}.steps h3{font-size:27px;font-weight:500;margin-bottom:12px}.steps p{color:#606263;max-width:710px;line-height:1.7}.founder{display:grid;grid-template-columns:38% 62%;gap:8vw;background:#f0f0f2}.founder-mark{height:520px;background:#111;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}.founder-mark span{font-size:150px;font-weight:900;letter-spacing:-.15em;margin-left:-20px}.founder-mark small{letter-spacing:.2em}.founder>div:last-child{align-self:center}.founder h2{font-size:clamp(38px,4.4vw,68px);margin:38px 0}.contact{padding:130px 7vw;text-align:center;display:flex;flex-direction:column;align-items:center}.contact h2{margin:42px 0 32px}.contact>p:nth-of-type(2){color:#bbb;max-width:720px;line-height:1.75}.contact .solid{margin-top:35px}.light{background:#fff;color:#111}.site-footer{padding:46px 6vw;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;align-items:center;gap:25px;font-size:10px;letter-spacing:.11em;text-transform:uppercase}.site-footer img{width:min(330px,100%)}
@media(max-width:950px){.masthead{min-height:100px}.masthead nav a:not(.outline){display:none}.hero{grid-template-columns:1fr}.hero-render{min-height:620px}.intro-grid{margin-left:0}.render-grid{grid-template-columns:1fr 1fr}.benefits{grid-template-columns:1fr 1fr}.founder{grid-template-columns:1fr}.founder-mark{height:380px}.site-footer{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.masthead{padding:18px 5vw}.signature{width:55vw}.outline{padding:11px 12px}.hero{margin:0;min-height:auto}.hero-copy{padding:75px 7vw}.hero h1{font-size:47px}.actions{flex-direction:column;align-items:flex-start}.hero-render{min-height:490px}.intro,.portfolio,.process,.founder,.why,.contact{padding:85px 7vw}.intro-grid,.render-grid,.benefits{grid-template-columns:1fr}.section-title{display:block}.render-grid{margin-top:45px}.steps article{grid-template-columns:50px 1fr}.founder-mark span{font-size:100px}.site-footer{grid-template-columns:1fr}.instagram-bar{margin-bottom:10px}}
.brand-logo{display:block;object-fit:contain}.founder-logo-panel{height:520px;background:#fff;display:flex;align-items:center;justify-content:center;padding:8%}.founder-logo-panel .brand-logo{width:100%;height:auto}.site-footer .brand-logo{width:108px;max-width:100%}
@media(max-width:950px){.founder-logo-panel{height:380px}}
.case-study{padding:130px 7vw;background:#f4f2ec;color:#303b40}.case-study-heading{display:grid;grid-template-columns:1fr 2fr;column-gap:6vw;align-items:start;margin-bottom:75px}.case-study-heading .overline{grid-column:1}.case-study-heading h2{grid-column:2;font-size:clamp(48px,6vw,92px);line-height:.96;letter-spacing:-.055em;font-weight:500;margin-bottom:32px}.case-study-heading>p:last-child{grid-column:2;max-width:760px;color:#697276;line-height:1.75}.case-study-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:64px 28px}.case-step{margin:0}.case-step img{display:block;width:100%;aspect-ratio:1.28/1;object-fit:cover;background:#e3e0d8}.case-step-3,.case-step-4{grid-column:1/-1}.case-step-3 img,.case-step-4 img{aspect-ratio:2.25/1}.case-step-copy{display:grid;grid-template-columns:54px 1fr;gap:12px;padding-top:20px}.case-step-copy>span{width:38px;height:38px;border-radius:50%;background:#7895a2;color:#fff;display:flex;align-items:center;justify-content:center;font-size:10px;letter-spacing:.08em}.case-step h3{font-size:15px;text-transform:uppercase;letter-spacing:.14em;margin:10px 0 15px}.case-step p{color:#6c7476;line-height:1.65;font-size:13px}.case-delivery{margin-top:72px;padding:34px;background:#e4e9e9;display:grid;grid-template-columns:180px 1fr;gap:30px}.case-delivery p{margin:0;line-height:1.7}.case-delivery>p:last-child{max-width:900px}@media(max-width:750px){.case-study{padding:85px 7vw}.case-study-heading{display:block;margin-bottom:50px}.case-study-heading h2{margin:35px 0 25px}.case-study-grid{grid-template-columns:1fr;gap:48px}.case-step-3,.case-step-4{grid-column:auto}.case-step-3 img,.case-step-4 img,.case-step img{aspect-ratio:1.3/1}.case-delivery{grid-template-columns:1fr}}

/* Unified JB visual system */
:root{--pink:#ff3c86;--muted:#606263}h1,h2,h3,p,a,span{font-family:Arial,Helvetica,sans-serif}.founder{display:block;background:var(--mist)}.founder>div{max-width:1050px;margin:0 auto}.founder>div>p:last-child{max-width:780px;color:var(--muted)}.case-study{background:#fff;color:#111;border-top:1px solid var(--line)}.case-study-heading>p:last-child,.case-step p{color:var(--muted)}.case-step img{background:var(--mist);filter:saturate(.9) contrast(1.02)}.case-step-copy{border-top:3px solid var(--black)}.case-step-copy>span{background:var(--pink);font-weight:700}.case-step h3{color:#111}.case-delivery{background:var(--black);color:#fff}.case-delivery>p:last-child{color:#ced0d0}

/* Hero film */
.masthead{min-height:0;flex-direction:column;justify-content:center;gap:24px;padding:34px 6vw 24px}.masthead .signature{width:min(620px,68vw);height:auto}.masthead nav{justify-content:center}.video-hero{position:relative;margin:0 1.5vw 20px;min-height:680px;max-height:calc(100vh - 205px);overflow:hidden;background:#111}.video-hero video{display:block;width:100%;height:100%;min-height:680px;max-height:calc(100vh - 205px);object-fit:cover;background:#111}.video-hero-copy{position:absolute;left:0;bottom:0;width:min(760px,58%);padding:46px 4.5vw 48px;color:#fff;box-shadow:24px -18px 50px rgba(0,0,0,.18)}.video-hero-copy h1{font-size:clamp(38px,4.2vw,66px);line-height:1.02;letter-spacing:-.045em;font-weight:400;margin:25px 0 22px}.video-hero-copy h1 strong{font-size:.78em;font-weight:600}.video-hero-copy>p:last-of-type{max-width:640px;color:#ced0d0;font-size:14px;line-height:1.65}.video-hero-copy .actions{margin-top:28px}.video-hero+.instagram-bar{margin-top:0}@media(max-width:850px){.masthead .signature{width:min(560px,82vw)}.video-hero{min-height:680px;max-height:none;margin:0}.video-hero video{min-height:680px;max-height:none}.video-hero-copy{width:100%;padding:40px 7vw 44px;background-color:rgba(18,23,25,.92)}.video-hero-copy h1{font-size:clamp(38px,8vw,58px)}}@media(max-width:600px){.masthead{gap:18px;padding:24px 5vw 18px}.video-hero,.video-hero video{min-height:650px}.video-hero video{object-position:center top}.video-hero-copy{padding:34px 7vw 38px}.video-hero-copy .actions{gap:18px}.video-hero-copy .solid{min-height:46px}.video-hero+.instagram-bar{margin-top:10px}}

/* Unobstructed hero film */
.video-hero{min-height:0;max-height:none;background:#fff}.video-hero video{position:relative;width:100%;height:auto;min-height:0;max-height:none;aspect-ratio:1080/676;object-fit:cover}.video-hero-copy{position:relative;left:auto;bottom:auto;width:100%;padding:56px 6vw 60px;background:#fff;color:#111;box-shadow:none}.video-hero-copy h1{max-width:1050px;font-size:clamp(42px,5vw,76px)}.video-hero-copy>p:last-of-type{max-width:760px;color:var(--muted);font-size:16px}.video-hero-copy .solid{background:var(--black);color:#fff}.video-hero-copy .line-link{border-color:#777}@media(max-width:850px){.video-hero,.video-hero video{min-height:0}.video-hero-copy{width:100%;padding:46px 7vw 50px;background:#fff;color:#111}}@media(max-width:600px){.video-hero,.video-hero video{min-height:0}.video-hero-copy{padding:40px 7vw 44px}}