/* The reference hero: one photograph, editorial headline, two quiet actions. */
#home.hero--reference{height:clamp(530px,40vw,680px);min-height:530px;max-height:680px;padding:36px 8% 30px;display:flex;align-items:center;background:#4a3b2f}
#home.hero--reference .hero-copy{width:47%;max-width:610px}
#home.hero--reference .eyebrow{font-size:clamp(.65rem,.91vw,.82rem);letter-spacing:.24em;margin:0 0 17px;font-weight:500}
#home.hero--reference .eyebrow .line{display:none}
#home.hero--reference h1{font-family:var(--serif);font-size:clamp(2.9rem,4.5vw,4.8rem);font-weight:400;line-height:1.025;letter-spacing:-.015em;margin:0 0 18px;max-width:610px;text-shadow:0 2px 16px #24180d28}
#home.hero--reference h1 span{display:block}
#home.hero--reference .intro{font-size:clamp(.9rem,1.22vw,1.12rem);line-height:1.32;max-width:500px;margin:0;color:#fffaf5}
#home.hero--reference .actions{display:flex;gap:27px;flex-wrap:nowrap;margin:23px 0 0;align-items:center}
#home.hero--reference .actions .button{min-height:48px;padding:12px 26px;font-size:.74rem;letter-spacing:.04em;text-transform:uppercase;font-weight:500;border-radius:4px;gap:17px;background:#a57656;border:1px solid #a57656;color:#fffaf6;white-space:nowrap;box-shadow:none}
#home.hero--reference .actions .button:hover{background:#875b40;border-color:#875b40}
#home.hero--reference .actions .hero-outline{background:#ffffff06;border:1px solid #fff5eac9;padding:12px 28px}
#home.hero--reference .actions .hero-outline:hover{background:#fff5ea24;border-color:#fff5ea}
#home.hero--reference .hero-portrait-panel{inset:0;margin:0;position:absolute;width:100%;height:100%;z-index:-2}
#home.hero--reference .hero-portrait-panel img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;aspect-ratio:auto}
#home.hero--reference:after{background:linear-gradient(90deg,#21170f55 0%,#21170f40 30%,#21170f10 53%,transparent 75%)}
#home.hero--reference .hero-signature{font-size:clamp(2rem,3.9vw,4rem);right:3%;top:14%;color:#fffaf2;line-height:1;transform:rotate(-9deg);text-shadow:0 1px 12px #3d2a1840}
#home.hero--reference .hero-signature span{font:9px/2 var(--sans);letter-spacing:.34em;margin-top:12px;transform:rotate(9deg)}
#home.hero--reference .hero-message{position:absolute;right:4%;bottom:9%;margin:0;color:#fff8ef;font:500 clamp(.58rem,.8vw,.76rem)/1.5 var(--sans);letter-spacing:.2em;text-transform:uppercase;text-shadow:0 1px 6px #24180dcc}
/* Keep the real photo while the matching sweater/pose photograph is prepared. */
@media(min-width:781px){#home.hero--reference .hero-portrait-panel{left:30%;width:70%}#home.hero--reference .hero-portrait-panel img{object-position:50% 30%}#home.hero--reference:after{background:linear-gradient(90deg,#34281e 0%,#34281e 30%,#34281ec4 39%,#34281e24 54%,transparent 68%)}}
@media(min-width:1600px){#home.hero--reference{padding-left:max(8%,calc((100vw - 1340px)/2))}}
@media(min-width:781px) and (max-width:1050px){#home.hero--reference{padding-left:7%;padding-top:30px;padding-bottom:30px;min-height:490px;height:490px}#home.hero--reference .hero-copy{width:48%}#home.hero--reference h1{font-size:clamp(2.5rem,4.4vw,3rem)}#home.hero--reference .actions{gap:14px}#home.hero--reference .actions .button{padding:11px 17px;font-size:.65rem}#home.hero--reference .intro{font-size:.87rem}#home.hero--reference .hero-signature{right:3%;font-size:2.8rem}}
@media(max-width:780px){
#home.hero--reference{height:auto;min-height:0;max-height:none;display:flex;flex-direction:column;padding:0;align-items:stretch;background:var(--ivory)}
#home.hero--reference .hero-portrait-panel{position:relative;inset:auto;order:0;width:100%;height:auto;z-index:0}
#home.hero--reference .hero-portrait-panel img{aspect-ratio:1.35;height:auto;object-fit:cover;object-position:68% 40%}
#home.hero--reference:after{display:none}
#home.hero--reference .hero-copy{order:1;width:auto;max-width:none;padding:30px 6% 34px}
#home.hero--reference .eyebrow{font-size:.62rem;margin-bottom:17px}
#home.hero--reference h1{font-size:clamp(2.3rem,9.4vw,3.9rem);line-height:1.04;letter-spacing:-.025em;margin-bottom:20px;max-width:none;color:var(--ink);text-shadow:none}
#home.hero--reference .intro{color:var(--muted);font-size:.93rem;line-height:1.55;max-width:450px}.hero-desktop-break{display:none}
#home.hero--reference .actions{gap:12px;flex-wrap:wrap;margin-top:23px}
#home.hero--reference .actions .button{font-size:.68rem;padding:12px 18px;min-height:46px}
#home.hero--reference .actions .hero-outline{border-color:var(--bronze);color:var(--bronze);background:none}
#home.hero--reference .actions .hero-outline:hover{background:var(--taupe)}
#home.hero--reference .hero-signature,#home.hero--reference .hero-message{display:none}
}

/* Let the hero photograph continue behind the floating navigation. */
body:has(#home.hero--reference){--hero-header-height:81px}
body:has(#home.hero--reference)>header{height:var(--hero-header-height);min-height:var(--hero-header-height);background:rgba(250,246,240,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
body:has(#home.hero--reference)>main{margin-top:calc(-1 * var(--hero-header-height))}
@media(min-width:781px){
 #home.hero--reference{height:calc(clamp(530px,40vw,680px) + var(--hero-header-height));min-height:calc(530px + var(--hero-header-height));max-height:calc(680px + var(--hero-header-height));padding-top:calc(36px + var(--hero-header-height))}
 #home.hero--reference .hero-signature.signature-art{top:calc(var(--hero-header-height) + 9%)}
}
@media(min-width:781px) and (max-width:1050px){
 #home.hero--reference{height:calc(490px + var(--hero-header-height));min-height:calc(490px + var(--hero-header-height));padding-top:calc(30px + var(--hero-header-height))}
}
@media(max-width:780px){
 body:has(#home.hero--reference){--hero-header-height:66px}
 #home.hero--reference .hero-portrait-panel img{height:calc(100vw / 1.35 + var(--hero-header-height));aspect-ratio:auto;object-position:68% 20%}
}
@media(prefers-reduced-transparency:reduce){body:has(#home.hero--reference)>header{background:#faf6f0}}

/* The prepared sweater portrait has open room space for the headline. */
@media(min-width:781px){
 #home.hero--reference .hero-portrait-panel{left:0;width:100%}
 #home.hero--reference .hero-portrait-panel img{object-position:65% 25%}
 #home.hero--reference:after{background:linear-gradient(90deg,#24180ed9 0%,#24180e9c 30%,#24180e26 53%,transparent 72%)}
}
@media(max-width:780px){#home.hero--reference .hero-portrait-panel img{object-position:72% center}}

/* Leave room for the translucent header above the portrait. The matching
   room backdrop fills that space while the main photograph sits below it. */
#home.hero--reference .hero-portrait-panel{background:url('jahnna-hero-sweater.webp') 65% top / cover no-repeat;padding-top:75px}
@media(min-width:781px){
 #home.hero--reference{height:calc(clamp(530px,40vw,680px) + var(--hero-header-height) + 45px);min-height:calc(575px + var(--hero-header-height));max-height:calc(725px + var(--hero-header-height))}
 #home.hero--reference .hero-portrait-panel img{object-position:65% top}
}

/* Solid, sharply rendered signature artwork with a readable descriptor. */
#home.hero--reference .hero-signature.signature-art,#about .brand-signature.signature-art{background:url('jahnna-signature-vector.svg') center 4px / 100% 70px no-repeat;filter:none;mix-blend-mode:normal;width:230px;height:104px;flex-basis:230px;position:relative;overflow:visible}
#home.hero--reference .hero-signature.signature-art{position:absolute;right:3%;top:calc(var(--hero-header-height) + 24px);filter:brightness(0) invert(1);text-shadow:none}
#home.hero--reference .hero-signature.signature-art:after,#about .brand-signature.signature-art:after{content:'REAL ESTATE';display:block;position:absolute;top:80px;left:0;width:100%;font:500 10px/1.3 var(--sans);letter-spacing:.3em;text-align:center;color:#342d29}
#home.hero--reference .hero-signature.signature-art{filter:none;background-color:#34281e80;border-radius:4px;background-image:none;padding:10px}
#home.hero--reference .hero-signature.signature-art:before{content:'';position:absolute;inset:8px 10px 28px;background:url('jahnna-signature-vector.svg') center/contain no-repeat;filter:brightness(0) invert(1)}
#home.hero--reference .hero-signature.signature-art:after{color:#fffaf5}
@media(max-width:780px){#home.hero--reference .hero-signature.signature-art{display:none}}
#about .brand-signature.signature-art{background-image:url('jahnna-signature-vector.svg?v=3')}
#home.hero--reference .hero-signature.signature-art:before{background-image:url('jahnna-signature-vector.svg?v=3')}

/* A light signature, with no panel or rough traced edges. */
#home.hero--reference .hero-signature.signature-art,#about .brand-signature.signature-art{background:none;border:0;border-radius:0;filter:none;padding:0;height:92px;width:230px;flex-basis:230px}
#home.hero--reference .hero-signature.signature-art:before,#about .brand-signature.signature-art:before{content:'Jahnna Gloria';position:absolute;inset:0;background:none;filter:none;font:400 49px/1.3 'Mrs Saint Delafield',cursive;letter-spacing:0;white-space:nowrap;text-align:center;color:#654a37;transform:rotate(-6deg)}
#home.hero--reference .hero-signature.signature-art:before{color:#fffaf4;text-shadow:0 1px 3px #392e2799,0 2px 14px #392e2777}
#home.hero--reference .hero-signature.signature-art:after,#about .brand-signature.signature-art:after{top:65px;font:500 9px/1.4 var(--sans);letter-spacing:.32em}
#home.hero--reference .hero-signature.signature-art:after{text-shadow:0 1px 4px #392e27;color:#fffaf4}

/* Match the reference signature lettering, with the agent descriptor. */
#home.hero--reference .hero-signature.signature-art:before,#about .brand-signature.signature-art:before{content:'';inset:0 6px 24px;background:url('jahnna-signature-vector.svg?v=3') center/contain no-repeat;transform:rotate(-5deg);filter:none;text-shadow:none}
#home.hero--reference .hero-signature.signature-art:before{filter:brightness(0) invert(1) drop-shadow(0 1px 2px #392e2780)}
#home.hero--reference .hero-signature.signature-art:after,#about .brand-signature.signature-art:after{content:'REAL ESTATE AGENT';top:68px;font-size:9px;letter-spacing:.23em}

/* Keep the finer reference strokes and generous room for the long J flourish. */
#home.hero--reference .hero-signature.signature-art,#about .brand-signature.signature-art{width:248px;height:112px;flex-basis:248px;overflow:visible}
#home.hero--reference .hero-signature.signature-art:before,#about .brand-signature.signature-art:before{inset:8px 18px 30px;background-image:url('jahnna-signature-vector.svg?v=full5');transform:none}
#home.hero--reference .hero-signature.signature-art{right:2%;top:calc(var(--hero-header-height) + 28px)}
#home.hero--reference .hero-signature.signature-art:before{filter:brightness(0) invert(1);opacity:.95}
#home.hero--reference .hero-signature.signature-art:after,#about .brand-signature.signature-art:after{top:85px;font-size:8px;letter-spacing:.25em}
@media(min-width:1101px) and (max-width:1400px){.meet-actions{flex-wrap:wrap}}

/* Supplied hero signature: complete thin lettering and agent descriptor. */
#home.hero--reference .hero-signature.signature-art{width:260px;height:108px;background:url('jahnna-hero-signature.svg') center/contain no-repeat;right:2%;filter:none;opacity:1}
#home.hero--reference .hero-signature.signature-art:before,#home.hero--reference .hero-signature.signature-art:after{content:none;display:none}
@media(max-width:780px){
 #home.hero--reference .hero-portrait-panel{padding-top:65px;background-position:72% top}
 #home.hero--reference .hero-portrait-panel img{height:calc(100vw / 1.35 + 20px);object-position:72% top}
}

/* Live lettering keeps the hero signature clean at every screen size. */
#home.hero--reference .hero-agent-name{position:absolute;right:4%;top:calc(var(--hero-header-height) + 32px);display:flex;flex-direction:column;align-items:center;color:#fffaf4;text-shadow:0 1px 5px #392e2780;z-index:1}
#home.hero--reference .hero-agent-script{font-family:'Segoe Script','Snell Roundhand','Apple Chancery','Brush Script MT',cursive;font-size:clamp(30px,3.3vw,52px);font-weight:400;line-height:1.5;letter-spacing:-.045em;white-space:nowrap}
#home.hero--reference .hero-agent-title{font:500 9px/1.5 var(--sans);letter-spacing:.25em;text-transform:uppercase;margin-top:2px}
@media(max-width:780px){#home.hero--reference .hero-agent-name{position:relative;inset:auto;order:2;color:var(--ink);text-shadow:none;align-self:flex-start;margin:0 6% 30px}#home.hero--reference .hero-agent-script{font-size:36px}}

/* Fine, flowing calligraphy inspired by the supplied reference. */
#home.hero--reference .hero-agent-script{font-family:'Mrs Saint Delafield','Segoe Script',cursive;font-size:clamp(52px,5.3vw,82px);font-weight:400;letter-spacing:0;line-height:1.05;-webkit-font-smoothing:antialiased}
#home.hero--reference .hero-agent-name{text-shadow:none}
#home.hero--reference .hero-agent-title{font-weight:400;font-size:9px;letter-spacing:.34em;margin-top:9px}
@media(max-width:780px){#home.hero--reference .hero-agent-script{font-size:62px}}

/* User-selected signature artwork. */
#home.hero--reference .hero-agent-name{width:clamp(230px,25vw,380px)}
#home.hero--reference .hero-agent-artwork{display:block;width:100%;height:auto;object-fit:contain}
@media(max-width:780px){#home.hero--reference .hero-agent-name{width:min(290px,80%)}#home.hero--reference .hero-agent-artwork{filter:brightness(0)}}

/* Place the white signature over the darker lower-right photo area. */
@media(min-width:781px){
 #home.hero--reference .hero-agent-name{top:auto;bottom:22%;right:4%;width:clamp(240px,26vw,390px)}
 #home.hero--reference .hero-agent-artwork{filter:drop-shadow(0 1px 2px rgba(35,24,16,.8)) drop-shadow(0 3px 10px rgba(35,24,16,.45))}
}

/* Signature replaces the former lower-right hero message. */
@media(min-width:781px){#home.hero--reference .hero-agent-name{top:auto;bottom:9%;right:4%}}

/* One complete first screen, with services over the photograph. */
#home.hero--reference{height:100vh;height:100svh;min-height:640px;max-height:none;padding-bottom:140px}
#home.hero--reference .service-shortcuts{position:absolute;inset:auto 0 0;z-index:3;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:18px 6%;background:rgba(30,23,18,.43);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-top:1px solid #ffffff40;border-bottom:0;color:#fffaf4}
#home.hero--reference .service-shortcuts a{min-height:66px;border:0;padding:8px 22px!important;gap:17px}
#home.hero--reference .service-shortcuts a+a{border-left:1px solid #ffffff40}
#home.hero--reference .service-shortcuts a>svg,#home.hero--reference .service-shortcuts small{color:#fffaf4}
#home.hero--reference .service-shortcuts a:hover{background:#ffffff12}
#home.hero--reference .service-shortcuts a:hover strong{color:#fff}
#home.hero--reference .hero-agent-name{bottom:145px}
@media(max-width:780px){
 #home.hero--reference{display:flex;justify-content:center;height:100svh;min-height:700px;padding:calc(var(--hero-header-height) + 22px) 6% 115px;background:#34281e}
 #home.hero--reference .hero-portrait-panel{position:absolute;inset:0;width:100%;height:100%;padding-top:0;z-index:0}
 #home.hero--reference .hero-portrait-panel img{width:100%;height:100%;object-fit:cover;object-position:65% center}
 #home.hero--reference:after{display:block;position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,#24180ed9,#24180e70 65%,#24180e35);pointer-events:none}
 #home.hero--reference .hero-copy{position:relative;z-index:1;order:0;padding:0;width:100%;color:#fffaf4}
 #home.hero--reference h1{font-size:clamp(2.25rem,8.2vw,3.5rem);color:#fffaf4;margin-bottom:18px}
 #home.hero--reference .intro{color:#fffaf4;font-size:.9rem}
 #home.hero--reference .eyebrow{color:#fffaf4}
 #home.hero--reference .actions{margin-top:20px}
 #home.hero--reference .actions .hero-outline{color:#fffaf4;border-color:#fffaf4}
 #home.hero--reference .hero-agent-name{position:relative;inset:auto;order:1;z-index:1;align-self:flex-end;margin:20px 0 0;width:190px}
 #home.hero--reference .hero-agent-artwork{filter:drop-shadow(0 1px 3px #24180e)}
 #home.hero--reference .service-shortcuts{padding:10px 3%}
 #home.hero--reference .service-shortcuts a{min-height:62px;padding:5px 8px!important;gap:5px}
 #home.hero--reference .service-shortcuts strong{font-size:1.25rem}
 #home.hero--reference .service-shortcuts a>svg{width:25px;height:25px}
}
@media(min-width:781px) and (max-height:700px){#home.hero--reference{min-height:600px}#home.hero--reference h1{font-size:clamp(2.6rem,4vw,3.8rem)}}

/* Full-screen hero without the lower service bar. */
@media(min-width:781px){#home.hero--reference{padding-bottom:60px}#home.hero--reference .hero-agent-name{bottom:9%}}
@media(max-width:780px){#home.hero--reference{padding-bottom:36px}}

/* Mobile copy sits directly over the photograph, with readable contrast. */
@media(max-width:780px){
 #home.hero--reference .hero-copy{background:transparent;box-shadow:none;color:#fffaf4}
 #home.hero--reference .hero-copy .eyebrow{color:#fffaf4}
 #home.hero--reference .hero-copy .line{background:#dcc2a6}
 #home.hero--reference h1,#home.hero--reference .intro{text-shadow:0 2px 12px rgba(0,0,0,.35)}
 #home.hero--reference:after{background:linear-gradient(90deg,rgba(24,17,12,.83) 0%,rgba(24,17,12,.60) 55%,rgba(24,17,12,.22) 100%)}
 #home.hero--reference .actions .hero-outline{background:rgba(24,17,12,.16);color:#fffaf4;border-color:#fffaf4}
}

/* Shorter desktop hero reveals the beginning of the following section. */
@media(min-width:1100px) and (min-height:800px){
 #home.hero--reference{height:80vh;height:80svh;min-height:640px;max-height:none}
 #home.hero--reference .hero-portrait-panel img{width:100%;height:100%;object-fit:cover;object-position:65% top}
}

/* Wider desktop photograph; preserve the existing hero geometry and overlays. */
#home.hero--reference .hero-photo-source{display:block;width:100%;height:100%}
@media(min-width:781px){#home.hero--reference .hero-portrait-panel{background-image:url('jahnna-hero-spacious.webp')}}

/* Use the wider composition on phones to soften the close-up crop. */
@media(max-width:780px){
 #home.hero--reference .hero-portrait-panel{background-image:url('jahnna-hero-spacious.webp')}
 #home.hero--reference .hero-portrait-panel img{object-fit:cover;object-position:70% center}
}

/* Restore the original hero photograph and its previous framing. */
#home.hero--reference .hero-portrait-panel{background-image:url('jahnna-hero-sweater.webp')}
@media(min-width:781px){#home.hero--reference .hero-portrait-panel img{object-position:65% top}}
@media(max-width:780px){#home.hero--reference .hero-portrait-panel img{object-position:65% center}}

/* A shorter phone hero reduces cover zoom while retaining the original photo. */
@media(max-width:780px){
 #home.hero--reference{height:82vh;height:82svh;min-height:640px;padding-top:calc(var(--hero-header-height) + 20px);padding-bottom:26px}
 #home.hero--reference .hero-portrait-panel img{width:100%;height:100%;object-fit:cover;object-position:65% center}
}



/* October portrait: retain the existing layout with the new original-photo edit. */
#home.hero--reference .hero-portrait-panel{background-image:url('jahnna-hero-natural-v2.webp')}

#home.hero--reference .hero-portrait-panel{background-image:url('jahnna-hero-sweater.webp')}
