/* =========================================================
   PANORAMIKA FINAL HYBRID — production visual polish
   Visual-only overrides over stable v46 functionality.
   ========================================================= */
:root{
  --fp-text:#182D38;
  --fp-muted:#667C89;
  --fp-line:#D9E5EB;
  --fp-blue:#6F96AD;
  --fp-blue-deep:#42677D;
  --fp-shadow:0 18px 48px rgba(34,60,74,.075);
  --fp-shadow-hover:0 26px 58px rgba(34,60,74,.11);
}
html{scrollbar-gutter:stable;background:#EEF4F7}
body{overflow-x:hidden;font-family:"Segoe UI Variable","Segoe UI",Inter,Arial,sans-serif;color:var(--fp-text)}
h1,h2,h3,h4,.price,.calc-price,.btn,.nav a,.label,.kicker{font-family:"Segoe UI Variable","Segoe UI",Inter,Arial,sans-serif}
p,.lead,.specs,.price-note,.faq-a,.notice{font-family:"Segoe UI Variable","Segoe UI",Inter,Arial,sans-serif}

/* Focus/keyboard states: visible without changing mouse styling. */
:is(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid rgba(93,137,163,.25)!important;
  outline-offset:3px!important;
}

/* Header: cleaner glass edge and predictable stacking. */
.site-header{isolation:isolate}
.site-header .header-inner{box-shadow:0 14px 38px rgba(36,64,79,.085),inset 0 1px 0 rgba(255,255,255,.98)!important}
.site-header.scrolled .header-inner{box-shadow:0 18px 48px rgba(36,64,79,.115),inset 0 1px 0 rgba(255,255,255,.98)!important}
.site-header .brand-logo{min-width:0}
.site-header .brand-logo img{max-width:100%}

/* Hero: compact premium composition, fewer dead zones. */
.hero{padding-top:24px!important;padding-bottom:38px!important}
.hero-copy,.hero-photo-card{min-height:560px!important}
.hero-photo-card>img{min-height:560px!important}
.hero-copy{padding:38px!important}
.hero-copy h1{max-width:590px;margin-top:18px!important;margin-bottom:18px!important;line-height:.99!important}
.hero-copy .lead{max-width:600px;line-height:1.58!important}
.hero-actions{margin-top:22px!important;margin-bottom:18px!important}
.hero-kpi span{border-radius:10px!important}
.hero-floating-card{border-radius:18px!important}

/* Product imagery must always stay crisp. */
.product-top::after{display:none!important;content:none!important}
.product-photo,.catalog-shot img,.product-media-main img,.window-photo-fill,.hero-photo-card>img,.scenario-image-wrap img,.thumb-card img,.detail-visual img{
  filter:none!important;-webkit-filter:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
@media(hover:hover) and (pointer:fine){
  .reference-card:hover .product-photo,.catalog-card:hover .product-photo,.catalog-shot:hover img,.product-media-card:hover .product-media-main img,.hero-photo-card:hover>img,.scenario-image-wrap:hover img,.thumb-card:hover img{
    transform:none!important;filter:none!important;-webkit-filter:none!important;
  }
}
.shot-note{max-width:calc(100% - 24px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Cards: quieter borders, consistent depth and radii. */
.reference-card,.catalog-card,.variant-thumb,.thumb-card,.product-media-card,.product-buy-card,.simple-step,.detail-card,.info-card,.faq-item{
  border-color:var(--fp-line)!important;
  box-shadow:var(--fp-shadow)!important;
}
.reference-card,.catalog-card{border-radius:22px!important}
@media(hover:hover) and (pointer:fine){
  .reference-card:hover,.catalog-card:hover{transform:translateY(-3px)!important;box-shadow:var(--fp-shadow-hover)!important}
}

/* Price strip: prevent price + secondary text from visually running together. */
.price-bar-item b{display:block;margin-top:2px;line-height:1.2}
.price-bar-item small{display:block;margin-top:4px;color:var(--fp-muted);font-size:10px;line-height:1.3}
.price-bar-intro span{display:block;margin-top:4px;line-height:1.4}

/* Calculator: controls and native checkboxes remain clear and predictable. */
.calc-check input[type="checkbox"],.legal input[type="checkbox"]{
  appearance:auto!important;-webkit-appearance:auto!important;
  width:17px!important;height:17px!important;min-height:17px!important;flex:0 0 17px!important;
  margin:2px 0 0!important;padding:0!important;border:0!important;box-shadow:none!important;accent-color:#587C92;
}
.calc-check{align-items:flex-start!important}
.calc-field label,.calc-builder-head p,.calc-preview-interaction{line-height:1.45}
.calc-window-preview{backface-visibility:hidden;-webkit-backface-visibility:hidden}
.calc-preview{contain:paint}

/* Technical demos: less empty space between related sections. */
.live-window-section{padding-top:56px!important;padding-bottom:50px!important}
.construction-explorer{padding-top:46px!important;padding-bottom:44px!important}
.construction-explorer + section{padding-top:42px!important}
.v43-construction-stage,.v43-live-stage{overflow:hidden}

/* General rhythm: consistent, but not oversized. */
main>section:not(.hero):not(.arch-ticker):not(.price-bar-section):not(.page-hero):not(.pro-teaser):not(.live-window-section):not(.construction-explorer){padding-top:66px;padding-bottom:66px}
.section-head{margin-bottom:26px!important}
.section-head p{line-height:1.55}

/* Catalog: content-first, not design-demo copy. */
.catalog-premium-item,.catalog-guide{min-height:100%}
.catalog-hero-copy p{max-width:670px;line-height:1.55}
.catalog-tools input,.catalog-tools select{min-height:48px}
.catalog-count{min-height:48px;display:flex;flex-direction:column;justify-content:center}

/* Product page: stronger hierarchy and consistent sticky panel. */
.product-buy-card{top:96px}
.product-buy-card .price{line-height:1.05}
.product-spec-row{align-items:flex-start}
.product-spec-row span{max-width:62%;line-height:1.4}
.product-buy-actions .btn{min-height:50px}
.product-media-main{box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}

/* FAQ/card click affordance without noisy hover. */
.faq-item{cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
@media(hover:hover) and (pointer:fine){.faq-item:hover{border-color:#C9DBE4!important;transform:translateY(-1px);box-shadow:0 18px 42px rgba(34,60,74,.085)!important}}

/* Fixed controls never collide on mobile. */
.scroll-top{border-radius:14px!important}

/* Footer: slightly clearer hierarchy. */
.footer{padding-top:52px!important}
.footer h4{color:#F2F7F9}
.footer a{transition:color .18s ease}
@media(hover:hover) and (pointer:fine){.footer a:hover{color:#fff}}

@media(max-width:1050px){
  .hero-copy,.hero-photo-card,.hero-photo-card>img{min-height:510px!important}
}
@media(max-width:840px){
  html{scrollbar-gutter:auto}
  .site-header .header-inner{min-height:62px!important}
  .hero{padding-top:18px!important;padding-bottom:30px!important}
  .hero-copy,.hero-photo-card,.hero-photo-card>img{min-height:auto!important}
  .hero-copy{padding:26px 22px!important}
  .hero-copy h1{font-size:clamp(38px,10.8vw,48px)!important;line-height:1.01!important}
  .hero-copy .lead{font-size:16px!important;line-height:1.56!important}
  main>section:not(.hero):not(.arch-ticker):not(.price-bar-section):not(.page-hero):not(.pro-teaser):not(.live-window-section):not(.construction-explorer){padding-top:48px;padding-bottom:48px}
  .live-window-section{padding-top:44px!important;padding-bottom:38px!important}
  .construction-explorer{padding-top:38px!important;padding-bottom:34px!important}
  .construction-explorer + section{padding-top:34px!important}
  .page-hero{padding-top:34px!important;padding-bottom:10px!important}
  .page-hero .card{padding:24px!important;border-radius:22px!important}
  .page-hero h1,.product-detail-page .page-hero h1{font-size:clamp(34px,10vw,44px)!important;line-height:1.03!important;letter-spacing:-.045em!important}
  .catalog-premium-rail,.catalog-guidance{gap:8px}
  .catalog-premium-item,.catalog-guide{padding:14px!important}
  .scroll-top{right:12px!important;bottom:86px!important;width:40px!important;height:40px!important;z-index:92!important}
  .sticky-mobile .bar,.product-mobile-buy{border-radius:16px!important;box-shadow:0 14px 38px rgba(31,55,68,.16)!important}
  .footer{padding-bottom:96px!important}
}
@media(max-width:520px){
  .container{width:min(var(--container),calc(100% - 24px))!important}
  .site-header .header-inner{border-radius:17px!important}
  .hero-copy,.hero-photo-card{border-radius:22px!important}
  .hero-kpi{gap:7px!important}
  .hero-kpi span{padding:9px 10px!important}
  .price-bar{padding:8px!important;gap:8px!important;border-radius:18px!important}
  .price-bar-intro,.price-bar-item{padding:13px 14px!important}
  .product-top{border-radius:16px!important}
  .reference-card,.catalog-card{border-radius:20px!important}
  .calc-panel,.calc-result-card{padding:18px!important;border-radius:22px!important}
  .calc-choice label{min-height:66px}
  .product-buy-actions{grid-template-columns:1fr!important}
  .product-spec-row{gap:12px}
  .product-spec-row span{max-width:58%}
  .pro-teaser-inner{padding:23px!important}
  .pro-teaser h2{font-size:clamp(30px,9vw,40px)!important}
  .faq-q{gap:10px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
/* Caption follows the same content grid as the hero instead of touching viewport edge. */
.hero-caption{width:min(var(--container),calc(100% - 40px));margin-inline:auto!important}
@media(max-width:520px){.hero-caption{width:calc(100% - 24px)}}
