/* Breakthrough Real Estate & Property Management: the logo door is the whole idea, it opens and you walk in.
   avoid-ai-design-ignore-file: T8 (Manrope is the typeface of the Breakthrough logo; the site font follows the logo) */
@font-face{font-family:Manrope;src:url(/fonts/manrope-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Manrope;src:url(/fonts/manrope-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Manrope;src:url(/fonts/manrope-800.woff2) format("woff2");font-weight:800;font-display:swap}

:root{
  --blue:#173a64;--blue-deep:#0d2240;--blue-ink:#0a1a31;
  --red:#d23b2e;--red-dark:#b22e23;
  --light:#fff1dc;--light-warm:#ffd9a3;
  --paper:#f3f5f8;--paper-2:#e6ebf1;--ink:#14202e;--muted:#536071;--line:#d5dce5;
  --white:#fff;
  --fs-hero:clamp(2.6rem,1.4rem + 5.2vw,5.6rem);
  --fs-h2:clamp(1.9rem,1.3rem + 2.4vw,3.2rem);
  --fs-h3:clamp(1.25rem,1.1rem + .5vw,1.5rem);
  --fs-lede:clamp(1.05rem,.98rem + .35vw,1.25rem);
  --r:14px;--ease:cubic-bezier(.22,1,.36,1);
  --wrap:min(1180px,100% - 2*clamp(20px,5vw,56px));
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:84px}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;font:500 1rem/1.6 Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-weight:800;line-height:1.05;letter-spacing:-.02em;margin:0;text-wrap:balance}
h2{font-size:var(--fs-h2)}h3{font-size:var(--fs-h3)}
p{margin:0 0 1em;text-wrap:pretty}
.wrap{width:var(--wrap);margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--white);color:var(--ink);padding:10px 14px;border-radius:8px}
.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--red);outline-offset:3px;border-radius:6px}

.eyebrow{font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin:0 0 18px;color:rgba(255,255,255,.72)}
.eyebrow--red{color:var(--red)}
.eyebrow--light{color:var(--light-warm)}

/* buttons: one action + a text link beside it, never stacked */
.actions{display:flex;align-items:center;gap:22px;flex-wrap:nowrap;white-space:nowrap}
.btn{display:inline-flex;align-items:center;gap:12px;min-height:50px;padding:0 24px;border:0;border-radius:999px 999px 10px 10px;
  font:800 1rem/1 Manrope,sans-serif;text-decoration:none;cursor:pointer;transition:transform .25s var(--ease),background-color .25s}
.btn--door{background:var(--red);color:var(--white)}
.btn--door::after{content:"";width:9px;height:9px;border-radius:50%;background:var(--light-warm);box-shadow:0 0 0 0 rgba(255,217,163,.6);transition:box-shadow .3s}
.btn--door:hover{background:var(--red-dark);transform:translateY(-2px)}
.btn--door:hover::after{box-shadow:0 0 0 6px rgba(255,217,163,.18)}
.btn:active{transform:translateY(0) scale(.98)}
.textlink{font-weight:700;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 2px no-repeat;padding-bottom:3px;transition:background-size .3s var(--ease)}
.textlink:hover{background-size:40% 2px}
.textlink--light{color:var(--white)}
@media (max-width:400px){.actions{gap:14px}.btn{padding:0 18px;font-size:.95rem}}

/* header: transparent over the blue hero, solid once you scroll */
.top{position:fixed;inset:0 0 auto;z-index:50;transition:background-color .3s,box-shadow .3s}
.top__in{width:var(--wrap);margin-inline:auto;height:76px;display:flex;align-items:center;gap:28px}
.top__logo{display:block;width:196px;flex:none}
.top__logo img{width:100%;height:auto}
.top__logo .on-light{display:none}
.top__nav{display:flex;gap:26px;margin-left:auto}
.top__nav a{color:var(--white);text-decoration:none;font-weight:700;font-size:.95rem;opacity:.86}
.top__nav a:hover{opacity:1}
.top__cta{min-height:44px;padding:0 18px;font-size:.92rem}
.top.is-solid{background-color:var(--white);box-shadow:0 1px 0 var(--line)}
.top.is-solid .top__nav a{color:var(--ink)}
.top.is-solid .on-dark{display:none}.top.is-solid .on-light{display:block}
.no-js .top{background-color:var(--blue-deep)}
@media (max-width:860px){.top__nav{display:none}.top__logo{width:164px}.top__cta{margin-left:auto}}
@media (max-width:400px){.top__logo{width:138px}.top__cta{padding:0 14px;font-size:.86rem}}

/* HERO */
.hero{position:relative;min-height:100svh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;gap:clamp(20px,4vw,64px);
  padding:110px max((100% - 1180px)/2,clamp(20px,5vw,56px)) 70px;color:var(--white);overflow:hidden;isolation:isolate;background-color:var(--blue-deep)}
.hero__sky{position:absolute;inset:0;z-index:-1;background:
  radial-gradient(60% 55% at 72% 62%,rgba(255,217,163,.16),transparent 70%),
  linear-gradient(180deg,var(--blue-ink) 0%,var(--blue) 62%,#1d4777 100%)}
.hero__sky::after{content:"";position:absolute;inset:0;opacity:.18;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.hero__title{font-size:var(--fs-hero);margin:0 0 24px;letter-spacing:-.035em}
.hero__title .line{display:block}
@media (min-width:861px){.hero__title .line{white-space:nowrap}}
.hero__lede{font-size:var(--fs-lede);max-width:34ch;color:rgba(255,255,255,.84);margin-bottom:34px}
.hero__scroll{position:absolute;left:50%;bottom:22px;width:26px;height:42px;margin-left:-13px;border:2px solid rgba(255,255,255,.4);border-radius:14px}
.hero__scroll span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--white);animation:nudge 1.8s var(--ease) infinite}
@keyframes nudge{0%{transform:translateY(0);opacity:1}70%{transform:translateY(12px);opacity:0}100%{opacity:0}}

/* the facade: SVG body of the B with real holes, a warm interior behind, an HTML door hinged in 3D */
.facade{position:relative;justify-self:center;width:min(520px,100%)}
.facade__stage{position:relative;aspect-ratio:1;perspective:900px;transform-origin:49.6% 61.7%}
.facade__inside{position:absolute;left:39.4%;top:23.8%;width:20.4%;height:50.6%;background:var(--blue-ink);overflow:hidden}
.facade__inside::before{content:"";position:absolute;inset:0;background:radial-gradient(70% 30% at 50% 22%,#fffaf0 0%,var(--light-warm) 70%,transparent 100%),radial-gradient(120% 70% at 50% 85%,var(--light) 0%,var(--light-warm) 50%,#f0b26a 100%);opacity:var(--lit,0);transition:opacity .2s}
.facade__lamp{position:absolute;left:50%;top:6%;width:30%;aspect-ratio:1;margin-left:-15%;border-radius:50%;background:var(--white);filter:blur(6px);opacity:calc(var(--lit,0)*.9)}
.facade__b{position:relative;width:100%;height:100%;fill:var(--paper);filter:drop-shadow(0 30px 40px rgba(5,14,30,.45))}
.facade__door{position:absolute;left:39.84%;top:49.22%;width:19.53%;height:25%;border-radius:50% 50% 0 0/39% 39% 0 0;background:linear-gradient(90deg,#c23427,var(--red) 30%,#dc4a3d);
  transform-origin:0 50%;transform:rotateY(calc(var(--open,0)*-1deg));backface-visibility:visible;box-shadow:inset -3px 0 0 rgba(0,0,0,.12)}
.facade__door::before{content:"";position:absolute;inset:16% 18% 10%;border-radius:50% 50% 3px 3px/30% 30% 3px 3px;border:2px solid rgba(0,0,0,.14)}
.facade__knob{position:absolute;right:14%;top:58%;width:9%;aspect-ratio:1;border-radius:50%;background:var(--light-warm)}
.facade__ground{position:absolute;left:8%;right:8%;bottom:-2%;height:9%;border-radius:50%;background:radial-gradient(closest-side,rgba(3,10,22,.55),transparent)}
.no-js .facade, .rm .facade{--lit:1;--open:38}

/* inside: services as doors */
.inside{position:relative;padding:clamp(80px,11vw,150px) 0;background:var(--paper)}
.sechead{max-width:720px;margin-bottom:clamp(36px,5vw,64px)}
.sechead h2{margin-bottom:18px}
.sechead__lede{font-size:var(--fs-lede);color:var(--muted)}
.doors{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2.4vw,32px)}
.door-card{display:flex;flex-direction:column}
.door-card__frame{position:relative;display:block;width:100%;aspect-ratio:3/4.4;padding:0;border:0;background:var(--blue);cursor:pointer;
  border-radius:50% 50% 6px 6px/34% 34% 6px 6px;perspective:1600px;box-shadow:inset 0 0 0 10px var(--blue)}
.door-card__inside{position:absolute;inset:10px;border-radius:inherit;background:radial-gradient(110% 70% at 50% 85%,var(--light) 0%,var(--light-warm) 55%,#e9a35a 100%);overflow:hidden}
.door-card__panel{position:absolute;inset:10px;border-radius:50% 50% 3px 3px/35% 35% 3px 3px;background:linear-gradient(90deg,#c23427,var(--red) 35%,#dc4a3d);
  transform-origin:0 50%;transition:transform .9s var(--ease);box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.door-card__panel::before{content:"";position:absolute;inset:14% 16% 8%;border-radius:50% 50% 3px 3px/34% 34% 3px 3px;border:2px solid rgba(0,0,0,.14)}
.door-card__knob{position:absolute;right:13%;top:56%;width:9%;aspect-ratio:1;border-radius:50%;background:var(--light-warm)}
.door-card:nth-child(2) .door-card__panel{background:linear-gradient(90deg,#122f52,var(--blue) 35%,#1f4a7d)}
.door-card:nth-child(3) .door-card__panel{background:linear-gradient(90deg,#2a3038,#3b434d 35%,#4a535e)}
.door-card:nth-child(4) .door-card__panel{background:linear-gradient(90deg,#c23427,var(--red) 35%,#dc4a3d)}
.door-card.is-open .door-card__panel,.door-card__frame:hover .door-card__panel{transform:rotateY(-62deg)}
.door-card__body{position:relative;z-index:1;padding:30px 4px 0}
.door-card__body h3{margin-bottom:10px}
.door-card__body p{color:var(--muted);margin-bottom:14px}
.door-card__body .textlink{color:var(--red)}
@media (max-width:980px){
  /* phone + tablet portrait: one rail you swipe, never stacked cards */
  .doors{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:16px;padding:0 0 18px;margin:0 calc((100vw - 100%)/-2);padding-inline:calc((100vw - 100%)/2);scrollbar-width:none}
  .doors::-webkit-scrollbar{display:none}
  .door-card{flex:0 0 min(72vw,300px);scroll-snap-align:center}
}

/* owners: dark band, a single lit doorway */
.owners{background:var(--blue-deep);color:var(--white);padding:clamp(80px,10vw,140px) 0;overflow:hidden}
.owners__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,90px);align-items:center}
.owners__lamp{justify-self:center;width:min(280px,60vw)}
.owners__arch{fill:none;stroke:rgba(255,255,255,.22);stroke-width:2}
.owners__glow{fill:var(--light-warm);opacity:var(--glow,1);filter:drop-shadow(0 0 40px rgba(255,217,163,.45))}
.owners h2{margin-bottom:22px}
.owners p{color:rgba(255,255,255,.82);font-size:var(--fs-lede);max-width:52ch}
.owners .btn{margin-top:10px}
@media (max-width:760px){.owners__grid{grid-template-columns:1fr}.owners__lamp{width:150px;justify-self:start}}

/* how it starts: three steps that rise like porch stairs */
.path{padding:clamp(80px,10vw,140px) 0;background:var(--paper-2)}
.path__track{position:relative}
.path__line{position:absolute;left:0;right:0;top:-10px;width:100%;height:120px;overflow:visible}
.path__line path{fill:none;stroke:var(--red);stroke-width:3;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:var(--draw,0)}
.steps{list-style:none;margin:0;padding:140px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,44px)}
.step{position:relative}
.step:nth-child(2){transform:translateY(-36px)}.step:nth-child(3){transform:translateY(-72px)}
.step__n{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--blue);color:var(--white);font-weight:800;margin-bottom:16px}
.step h3{margin-bottom:8px}.step p{color:var(--muted)}
@media (max-width:760px){.path__line{display:none}.steps{grid-template-columns:1fr;padding-top:0;gap:28px}.step:nth-child(n){transform:none}
  .step{padding-left:64px}.step__n{position:absolute;left:0;top:0}}

/* contact */
.contact{padding:clamp(80px,10vw,140px) 0;background:var(--paper)}
.contact__grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,6vw,90px);align-items:start}
.contact__intro h2{margin-bottom:18px}
.contact__intro p{color:var(--muted);font-size:var(--fs-lede)}
.contact__owner{font-size:1rem!important;color:var(--ink)!important;font-weight:700}
.form{background:var(--white);border-radius:var(--r);padding:clamp(22px,3.5vw,40px);box-shadow:0 1px 0 var(--line),0 30px 60px -40px rgba(13,34,64,.35)}
.form__group{border:0;margin:0 0 22px;padding:0}
.form__group legend,.field>span{display:block;font-weight:700;font-size:.92rem;margin-bottom:8px}
.field em{font-style:normal;font-weight:500;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip input{position:absolute;opacity:0;pointer-events:none}
.chip span{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1.5px solid var(--line);border-radius:999px 999px 8px 8px;font-weight:700;cursor:pointer;transition:background-color .2s,border-color .2s,color .2s}
.chip input:checked+span{background:var(--blue);border-color:var(--blue);color:var(--white)}
.chip input:focus-visible+span{outline:3px solid var(--red);outline-offset:2px}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:block;margin-bottom:18px}
.field input,.field textarea{width:100%;min-height:50px;padding:12px 14px;border:1.5px solid var(--line);border-radius:10px;background:var(--paper);font:500 1rem/1.4 Manrope,sans-serif;color:var(--ink);transition:border-color .2s,background-color .2s}
.field textarea{resize:vertical;min-height:120px}
.field input:focus,.field textarea:focus{outline:0;border-color:var(--blue);background:var(--white)}
.field.is-bad input,.field.is-bad textarea,.form__group.is-bad .chip span{border-color:var(--red)}
.hp{position:absolute;left:-9999px}
.cf-turnstile{margin:4px 0 18px;min-height:65px}
.form__foot{display:flex;align-items:center;gap:20px}
.form__note{margin:0;font-size:.85rem;color:var(--muted)}
.form__status{margin:14px 0 0;font-weight:700;min-height:1.6em}
.form__status.is-ok{color:#1d6b3c}.form__status.is-err{color:var(--red)}
.form.is-sent>*:not(.form__status){display:none}
.form.is-sent .form__status{font-size:var(--fs-h3);color:var(--ink);margin:0}
@media (max-width:860px){.contact__grid{grid-template-columns:1fr}}
@media (max-width:560px){.form__row{grid-template-columns:1fr;gap:0}.form__foot{flex-direction:row;flex-wrap:wrap}}

/* footer */
.foot{background:var(--blue-ink);color:rgba(255,255,255,.78);padding:56px 0 34px;font-size:.92rem}
.foot__in{width:var(--wrap);margin-inline:auto;display:grid;grid-template-columns:1fr auto;gap:28px;align-items:end}
.foot__logo{width:220px;margin-bottom:16px}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 22px}
.foot a{color:var(--white);text-decoration:none}
.foot a:hover{text-decoration:underline}
.foot__legal{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;border-top:1px solid rgba(255,255,255,.12);padding-top:22px;font-size:.84rem}
@media (max-width:700px){.foot__in{grid-template-columns:1fr}}

/* hero on narrow screens: door on top, words under it */
@media (max-width:860px){
  .hero{grid-template-columns:1fr;align-content:center;padding-top:96px;gap:8px;text-align:left}
  .facade{order:-1;width:min(300px,62vw)}
  .hero__lede{max-width:none}
  .hero__scroll{display:none}
}
@media (max-width:860px) and (max-height:700px){.facade{width:min(220px,46vw)}}

/* plain pages */
.page{padding:130px 0 90px}
.page .wrap{max-width:760px}
.page h1{font-size:var(--fs-h2);margin-bottom:24px}
.page h2{font-size:var(--fs-h3);margin:34px 0 10px}
.page p,.page li{color:#2b3644}
.page--blue{background:var(--blue-deep);color:var(--white);min-height:100svh;display:grid;place-items:center;text-align:center}
.page--blue p{color:rgba(255,255,255,.82)}
.page--blue .actions{justify-content:center}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}