:root { --navy:#071735; --navy-2:#0b3a52; --navy-3:#124b66; --text:#29485e; --orange:#ff5a00; --orange-dark:#e94f00; --line:#d9e1e7; --warm:#fbf8f3; --white:#fff; --max:1180px; --pad:clamp(1.25rem,5vw,3.5rem); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--navy); background:var(--white); font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.5; -webkit-font-smoothing:antialiased; }
img { display:block; width:100%; max-width:100%; }
a { color:inherit; }
figure { margin:0; }
.shell { width:min(100% - (2 * var(--pad)),var(--max)); margin-inline:auto; }
.section-pad { padding-block:clamp(4rem,7vw,6.4rem); }
.site-header { position:relative; z-index:10; background:rgb(255 255 255 / 96%); box-shadow:0 1px 0 rgb(7 23 53 / 7%); }
.header-inner { min-height:88px; display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.brand { width:clamp(205px,24vw,282px); display:inline-flex; }
.button { min-height:54px; display:inline-flex; align-items:center; justify-content:center; gap:1.15rem; padding:.82rem 1.7rem; border:2px solid var(--orange); border-radius:9px; color:var(--white); background:linear-gradient(135deg,var(--orange),#ff6a00); box-shadow:0 8px 20px rgb(255 90 0 / 16%); font-size:1rem; font-weight:700; line-height:1.1; text-align:center; text-decoration:none; transition:background-color .16s ease,border-color .16s ease,transform .16s ease,box-shadow .16s ease; }
.button:hover { border-color:var(--orange-dark); background:var(--orange-dark); box-shadow:0 10px 24px rgb(255 90 0 / 24%); transform:translateY(-1px); }
.button:focus-visible,.brand:focus-visible { outline:3px solid rgb(255 90 0 / 38%); outline-offset:4px; }
.button-small { min-height:48px; padding-inline:1.55rem; }
.button-secondary { color:var(--navy); background:transparent; border-color:var(--navy); box-shadow:none; }
.button-secondary:hover { color:var(--white); background:var(--navy); border-color:var(--navy); }
.eyebrow { margin:0 0 1.5rem; color:#2f678c; font-size:.76rem; font-weight:800; letter-spacing:.25em; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { color:var(--navy); line-height:1.02; letter-spacing:-.05em; }
h1 { max-width:600px; margin-bottom:1.15rem; font-size:clamp(3.45rem,5.8vw,5.2rem); font-weight:790; }
h2 { margin-bottom:1.35rem; font-size:clamp(2.35rem,4vw,3.5rem); font-weight:770; }
h3 { color:var(--navy); line-height:1.15; }
.section-heading { max-width:780px; margin-bottom:2.5rem; }
.section-heading p,.pricing-heading p { max-width:720px; margin-bottom:0; color:var(--text); font-size:clamp(1.05rem,1.8vw,1.22rem); }

.hero { position:relative; overflow:hidden; background:var(--white); }
.hero-grid { min-height:630px; display:grid; grid-template-columns:minmax(380px,.95fr) minmax(0,1.45fr); }
.hero-copy { position:relative; z-index:3; align-self:stretch; display:flex; flex-direction:column; justify-content:center; padding:4rem 0 4.25rem; }
.hero-copy::after { content:""; position:absolute; inset:0 -165px 0 auto; z-index:-1; width:260px; background:linear-gradient(90deg,var(--white),rgb(255 255 255 / 92%) 36%,transparent); pointer-events:none; }
.lead { max-width:500px; margin-bottom:1.75rem; color:var(--text); font-size:clamp(1.06rem,1.7vw,1.24rem); }
.hero-copy .button { align-self:flex-start; }
.price-note { margin:.7rem 0 0; color:var(--text); font-weight:600; }
.hero-visual,.contact-visual { position:relative; overflow:hidden; }
.hero-visual { margin-right:calc((100vw - min(100vw,var(--max))) / -2); }
.hero-visual img,.contact-visual img { height:100%; object-fit:cover; }
.pano-viewer { position:absolute; inset:0; overflow:hidden; background:#102636; cursor:grab; touch-action:none; user-select:none; }
.pano-viewer:active { cursor:grabbing; }
.pano-viewer:focus-visible { outline:4px solid rgb(255 90 0 / 70%); outline-offset:-4px; }
.pano-viewer canvas { width:100%; height:100%; display:block; }
.pano-fallback { position:absolute; inset:0; z-index:0; object-position:center; }
.pano-viewer.is-ready .pano-fallback { display:none; }
.pano-hint { position:absolute; left:50%; bottom:1.25rem; z-index:2; transform:translateX(-50%); display:flex; align-items:center; gap:.55rem; margin:0; padding:.58rem .9rem; border:1px solid rgb(255 255 255 / 38%); border-radius:999px; color:var(--white); background:rgb(7 23 53 / 68%); box-shadow:0 8px 24px rgb(0 0 0 / 18%); font-size:.75rem; font-weight:700; letter-spacing:.04em; white-space:nowrap; pointer-events:none; backdrop-filter:blur(7px); }
.pano-hint span { color:var(--orange); font-size:1.05rem; }
.pano-viewer.is-interacted .pano-hint { opacity:0; transition:opacity .35s ease; }

.examples { background:var(--white); }
.example-grid { display:grid; gap:clamp(1rem,1.8vw,1.4rem); }
.example-grid-four { grid-template-columns:repeat(4,1fr); }
.example-card img { aspect-ratio:1.18 / 1; border-radius:8px; object-fit:cover; box-shadow:0 12px 30px rgb(7 23 53 / 8%); }
.example-card figcaption { position:relative; margin-top:.8rem; padding-right:1.4rem; color:var(--navy); font-size:clamp(.96rem,1.3vw,1.08rem); font-weight:680; }
.example-card figcaption::after { content:"→"; position:absolute; right:.1rem; color:var(--orange); font-size:1.2rem; font-weight:500; }

.pricing { position:relative; color:var(--white); background:linear-gradient(118deg,var(--navy-2),#083147 56%,#061e31); overflow:hidden; }
.pricing::before { content:""; position:absolute; inset:0; opacity:.18; background-image:linear-gradient(115deg,transparent 0 36%,rgb(255 255 255 / 8%) 36.2% 36.4%,transparent 36.6%); pointer-events:none; }
.pricing .shell { position:relative; z-index:1; }
.pricing-heading { max-width:820px; margin-bottom:2.8rem; }
.pricing-heading h2 { color:var(--white); }
.pricing-heading h2::after { content:""; display:block; width:66px; height:6px; margin-top:1.6rem; border-radius:20px; background:var(--orange); }
.pricing-heading p { color:rgb(255 255 255 / 82%); }
.service-grid { display:grid; grid-template-columns:repeat(2,1fr); align-items:stretch; gap:1.6rem; }
.service-card { display:flex; flex-direction:column; padding:clamp(1.6rem,3vw,2.3rem); border:1px solid rgb(255 255 255 / 62%); border-radius:12px; color:var(--navy); background:rgb(255 255 255 / 94%); box-shadow:0 20px 46px rgb(0 0 0 / 16%); }
.service-card-primary { border:3px solid var(--orange); background:var(--white); transform:translateY(-5px); }
.service-kicker { margin-bottom:.5rem; color:#547084; font-size:.7rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
.service-card h3 { margin:0 0 .8rem; font-size:clamp(1.55rem,2.3vw,2.1rem); }
.service-price { display:flex; flex-direction:column; margin:0 0 1.25rem; font-size:clamp(3.5rem,5vw,4.8rem); font-weight:790; line-height:.95; letter-spacing:-.05em; }
.service-price span { margin-bottom:.25rem; color:var(--text); font-size:.82rem; font-weight:600; letter-spacing:0; }
.service-description { color:var(--navy); font-weight:700; }
.service-card > p:not(.service-kicker,.service-price,.service-description) { color:var(--text); }
.service-card ul { display:grid; gap:.52rem; margin:1rem 0 1.7rem; padding:1.15rem 0 0; border-top:1px solid var(--line); list-style:none; }
.service-card li { position:relative; padding-left:2.05rem; color:var(--text); }
.service-card li::before { content:"✓"; position:absolute; top:.04rem; left:0; width:1.25rem; height:1.25rem; display:grid; place-items:center; border-radius:50%; color:white; background:var(--orange); font-size:.78rem; font-weight:800; }
.service-button { align-self:flex-start; margin-top:auto; }
.pricing-disclaimer { max-width:920px; margin:1.7rem auto 0; color:rgb(255 255 255 / 68%); font-size:.8rem; text-align:center; }

.process { background:var(--warm); }
.process h2 { margin-bottom:2.6rem; }
.process-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0; }
.process-grid article { position:relative; padding:0 clamp(1.2rem,3vw,2.4rem); border-left:1px solid var(--line); }
.process-grid article:first-child { padding-left:0; border-left:0; }
.process-grid span { display:block; margin-bottom:.85rem; color:rgb(7 23 53 / 28%); font-size:3.4rem; font-weight:300; line-height:1; }
.process-grid h3 { margin:0 0 .45rem; font-size:1.22rem; }
.process-grid p { margin-bottom:0; color:var(--text); }

.benefits { background:var(--white); }
.benefits-grid { display:grid; grid-template-columns:1.08fr .92fr; gap:clamp(3rem,8vw,7rem); align-items:start; }
.benefits-intro p { max-width:590px; margin-bottom:0; color:var(--text); font-size:clamp(1.08rem,1.8vw,1.28rem); }
.benefit-list { display:grid; }
.benefit-list article { display:grid; grid-template-columns:54px 1fr; gap:1.1rem; padding:1.35rem 0; border-top:1px solid var(--line); }
.benefit-list article:first-child { padding-top:0; border-top:0; }
.benefit-list span { color:var(--orange); font-size:.78rem; font-weight:800; letter-spacing:.1em; }
.benefit-list h3 { margin:0 0 .3rem; font-size:1.2rem; }
.benefit-list p { margin:0; color:var(--text); }

.contact { background:var(--warm); }
.contact-grid { min-height:430px; display:grid; grid-template-columns:.95fr 1.05fr; }
.contact-copy { position:relative; z-index:2; align-self:stretch; display:flex; flex-direction:column; justify-content:center; padding:4rem 2.5rem 4rem 0; }
.contact-copy::after { content:""; position:absolute; inset:0 -120px 0 auto; z-index:-1; width:220px; background:linear-gradient(90deg,var(--warm),rgb(251 248 243 / 92%),transparent); pointer-events:none; }
.contact-copy h2 { margin-bottom:.8rem; }
.contact-copy > p:not(.service-area) { max-width:560px; margin-bottom:1.6rem; color:var(--text); font-size:1.12rem; }
.contact-copy .button { align-self:flex-start; }
.service-area { margin:1rem 0 0; color:#5f7080; font-size:.84rem; }
.contact-visual { margin-right:calc((100vw - min(100vw,var(--max))) / -2); }
.contact-visual img { object-position:center 58%; }

.site-footer { padding:1.6rem 0 1.9rem; background:var(--white); }
.footer-inner { display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; }
.footer-brand img { width:clamp(175px,20vw,235px); }
.footer-brand p,.footer-meta { color:#5f7080; font-size:.74rem; }
.footer-brand p { margin:.65rem 0 0; }
.footer-meta { text-align:right; }
.footer-meta p { margin:0; }
.footer-meta p + p { margin-top:.3rem; }

@media (max-width:960px) { .example-grid-four { grid-template-columns:repeat(2,1fr); } }
@media (max-width:900px) {
  .header-inner { min-height:82px; }
  .hero-grid,.benefits-grid,.contact-grid { grid-template-columns:1fr; }
  .hero-grid { min-height:auto; }
  .hero-copy { padding:4rem 0 3rem; }
  .hero-copy::after,.contact-copy::after { display:none; }
  .hero-visual,.contact-visual { min-height:430px; margin-right:0; }
  .service-grid { grid-template-columns:1fr; }
  .service-card-primary { transform:none; }
  .contact-copy { padding:4rem 0 3rem; }
}
@media (max-width:700px) { .process-grid { grid-template-columns:1fr; gap:1.8rem; } .process-grid article,.process-grid article:first-child { padding:0 0 1.8rem; border-left:0; border-bottom:1px solid var(--line); } }
@media (max-width:640px) {
  .header-inner { min-height:74px; gap:.8rem; }
  .brand { width:min(54vw,210px); }
  .button-small { min-height:44px; padding:.65rem 1rem; font-size:.9rem; }
  .hero-copy { padding-top:3.35rem; }
  .eyebrow { margin-bottom:1.3rem; font-size:.65rem; letter-spacing:.19em; }
  h1 { font-size:clamp(3rem,14vw,4rem); }
  h2 { font-size:clamp(2.25rem,10.5vw,2.9rem); }
  .hero-visual,.contact-visual { min-height:330px; }
  .example-grid-four { grid-template-columns:1fr; gap:2rem; }
  .example-card img { aspect-ratio:1.5 / 1; }
  .service-card { padding:1.45rem; }
  .footer-inner { align-items:flex-start; flex-direction:column; }
  .footer-meta { text-align:left; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .button { transition:none; } }
