/* Portrait phones only: shared grid overlays the copy without moving DOM nodes. */
@media (max-width:767px) and (orientation:portrait) {
 #ha-site#ha-site .ha-hero:not(.ha-inline-room){display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto auto!important;position:relative}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-header{grid-area:2/1!important;order:initial!important;align-self:start!important;background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;z-index:8!important;text-shadow:0 1px 5px #102017}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-header .ha-brand{min-width:0!important;max-width:calc(100% - 76px)!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-header .ha-menu{margin-left:auto;flex-shrink:0}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-mobile-house{grid-area:2/1!important;order:initial!important;height:clamp(430px,56svh,520px)!important;aspect-ratio:auto!important;background-size:cover!important;background-position:72% center!important;overflow:hidden;isolation:isolate}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy{grid-area:2/1!important;order:initial!important;align-self:end!important;position:relative!important;inset:auto!important;width:100%!important;max-width:none!important;padding:30px 5% 18px!important;margin:0!important;z-index:6!important;background:linear-gradient(transparent,rgba(20,28,25,.22) 35%,rgba(20,28,25,.48))!important;pointer-events:none}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy a,#ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy button{pointer-events:auto}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-eyebrow{font-size:8px!important;letter-spacing:1.4px!important;margin:0 0 7px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy h1{font-size:clamp(19px,5.2vw,25px)!important;line-height:1.12!important;letter-spacing:-.5px!important;margin:0!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-partner{width:112px!important;max-width:112px!important;margin:9px 0!important;gap:4px!important;padding:0!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-partner-logo{display:flex!important;flex-direction:column!important;gap:0!important;width:112px!important;min-width:0!important;height:auto!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-partner img{max-width:100%!important;max-height:none!important;width:112px!important;height:auto!important;object-fit:contain!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-partner img:first-child{left:-15px!important;top:0!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-partner img:last-child{left:0!important;top:-6px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-intro{font-size:11px!important;line-height:1.5!important;margin:8px 0 0!important;max-width:310px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-actions{display:flex!important;gap:8px!important;margin:12px 0 0!important;flex-wrap:nowrap!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-actions a{min-height:44px!important;padding:10px 11px!important;font-size:9px!important;white-space:nowrap!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-live{font-size:9px!important;margin:8px 0 0!important;gap:8px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-portrait-picker{grid-area:3/1!important;order:initial!important;margin:16px auto 20px!important}
 #ha-site#ha-site .ha-hero .ha-mobile-house .ha-arrival video{object-fit:cover!important;object-position:72% center!important}
 #ha-site#ha-site .ha-hero .ha-mobile-house>.ha-arrival{z-index:2!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room) .ha-mobile-house>.ha-arc{z-index:3!important;top:90px!important}
 #ha-site#ha-site .ha-hero .ha-mobile-house .ha-arrival-skip{top:90px!important;bottom:auto!important}

 /* Scalable diagonal canvas follows each section's own height. */
 #ha-site#ha-site #megoldasok.ha-section,#ha-site#ha-site #kivitelezes.ha-section,#ha-site#ha-site #rolunk.ha-section,#ha-site#ha-site #loxone.ha-section,#ha-site#ha-site #brosurak.ha-brochure-section{
  background-color:#292b2d!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath fill='%238cff70' d='M0 0H68L30 100H0Z'/%3E%3C/svg%3E")!important;background-size:100% 100%!important;background-repeat:no-repeat!important;
 }
 #ha-site#ha-site #funkcioterkep.hag-hub,#ha-site#ha-site #referenciak.ha-section,#ha-site#ha-site #kapcsolat.ha-section,#ha-site#ha-site #loxone-ujdonsagok.ha-section{
  background-color:#292b2d!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath fill='%238cff70' d='M70 0H100V100H32Z'/%3E%3C/svg%3E")!important;background-size:100% 100%!important;background-repeat:no-repeat!important;
 }
 #ha-site#ha-site #loxone.ha-section>.ha-loxone-video:after{background-image:linear-gradient(90deg,#8cff70 0%,rgba(140,255,112,.65) 20%,rgba(140,255,112,0) 75%)!important;background-size:100% 100%!important}
}
@media(max-width:767px) and (orientation:portrait){#ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy h1,#ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy p,#ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-live{text-shadow:0 1px 3px #102017,0 0 8px #102017b0}}
/* Portrait hero: wider house framing and local contrast behind the branding/copy. */
@media(max-width:767px) and (orientation:portrait){
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-mobile-house{height:clamp(410px,50svh,450px)!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-header .ha-brand{background:rgba(24,32,28,.55)!important;border:1px solid rgba(140,255,112,.18);border-radius:8px;padding:6px 8px!important;box-shadow:0 3px 14px #0003}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy{padding:10px 5% 12px!important;background:transparent!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-eyebrow,
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy h1,
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-intro,
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-live{width:fit-content!important;max-width:100%!important;background:rgba(24,32,28,.55)!important;border-radius:5px;padding:4px 7px!important;box-decoration-break:clone;-webkit-box-decoration-break:clone}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-eyebrow{margin-bottom:4px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy h1{font-size:19px!important;line-height:1.1!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-partner{width:114px!important;max-width:114px!important;margin:6px 0!important;padding:4px 10px!important;background:rgba(24,32,28,.55)!important;border-radius:5px}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-partner-logo{width:94px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-partner img{width:94px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-intro{margin-top:6px!important;font-size:11px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-actions{margin-top:8px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-actions a:not(:first-child){background:rgba(24,32,28,.55)!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-live{margin-top:6px!important}
}
@media(max-width:767px) and (orientation:portrait){
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-header{flex-wrap:nowrap!important;align-items:flex-start!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-header .ha-brand{box-sizing:border-box!important;grid-template-columns:32px minmax(0,1fr)!important;column-gap:6px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-header .ha-brand img{width:32px!important;height:auto!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-header .ha-brand span:first-of-type{font-size:clamp(8.5px,2.5vw,10.5px)!important;white-space:nowrap}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-header .ha-brand span:last-of-type{font-size:8.5px!important;line-height:1.25!important}
}

@media(max-width:767px) and (orientation:portrait){
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-header .ha-brand{background:transparent!important;border-color:transparent!important;box-shadow:none!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-header .ha-brand img{background:rgba(24,32,28,.55)!important;border-radius:6px;box-shadow:0 0 0 5px rgba(24,32,28,.55)!important}
}
/* Portrait room picker: branded chevrons and a gentle, non-moving highlight. */
@media(max-width:767px) and (orientation:portrait){
 #ha-site#ha-site #ha-portrait-room{appearance:none!important;-webkit-appearance:none!important;padding-right:42px!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='24' viewBox='0 0 18 24' fill='none' stroke='%238cff70' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 8 4-4 4 4M5 16l4 4 4-4'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 14px center!important;background-size:18px 24px!important;animation:ha-room-picker-pulse 2.6s ease-in-out infinite!important}
 #ha-site#ha-site #ha-portrait-room:focus{animation:none!important;outline:2px solid #8cff70;outline-offset:3px}
 .hag-motion-off #ha-site#ha-site #ha-portrait-room{animation:none!important}
}
@keyframes ha-room-picker-pulse{0%,100%{box-shadow:0 0 0 0 #8cff7000;border-color:#8cff7070}50%{box-shadow:0 0 0 5px #8cff701c,0 0 18px #8cff7022;border-color:#8cff70}}
@media(prefers-reduced-motion:reduce){#ha-site#ha-site #ha-portrait-room{animation:none!important}}
/* Portrait tablets: leave room below the hero copy before the day controls. */
@media(min-width:768px) and (max-width:1180px) and (orientation:portrait){
 #ha-site#ha-site #elo-haz{margin-top:max(40px,calc(530px - 56.25vw))!important}
}
/* Translucent phone and portrait tablet navigation. */
@media(max-width:767px), (min-width:768px) and (max-width:1180px) and (orientation:portrait){
 #ha-site#ha-site #ha-navigation.is-open{background:rgba(36,40,39,.58)!important;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
 #ha-site#ha-site #ha-navigation.is-open>a{background:transparent!important;color:#f1f6ef!important;text-shadow:0 1px 3px #102017}
 #ha-site#ha-site #ha-navigation.is-open>a:hover,#ha-site#ha-site #ha-navigation.is-open>a:focus-visible{background:rgba(140,255,112,.12)!important;color:#8cff70!important}
}
/* Portrait tablet menu button stays visible over the house. */
@media(min-width:768px) and (max-width:1180px) and (orientation:portrait){
 #ha-site#ha-site .ha-hero>.ha-header .ha-menu{background:rgba(41,43,45,.72)!important;color:#f1f6ef!important;border:1px solid rgba(140,255,112,.3)!important;border-radius:7px;box-shadow:0 3px 12px #0003;text-shadow:0 1px 3px #102017;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
 #ha-site#ha-site .ha-hero>.ha-header .ha-menu:hover,#ha-site#ha-site .ha-hero>.ha-header .ha-menu:focus-visible{background:rgba(41,43,45,.88)!important;border-color:#8cff70!important}
}
/* Portrait tablet hero copy clears the interactive garden marker. */
@media(min-width:768px) and (max-width:1180px) and (orientation:portrait){
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-partner{margin-top:6px!important;margin-bottom:8px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-intro{margin-top:6px!important}
}
/* Portrait phone still: soft edge shading below the arrival video layer. */
@media(max-width:767px) and (orientation:portrait){
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-mobile-house:after{background:linear-gradient(0deg,rgba(20,28,25,.68) 0%,rgba(20,28,25,.24) 18%,transparent 44%),linear-gradient(90deg,rgba(20,28,25,.40) 0%,rgba(20,28,25,.15) 24%,transparent 60%)!important;pointer-events:none}
}
/* Portrait phone: wider still framing, with the garage kept in view. */
@media(max-width:767px) and (orientation:portrait){
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-mobile-house{background-size:auto 82%!important;background-position:right bottom!important;background-repeat:no-repeat!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-mobile-house .ha-live-svg{height:82%!important;width:auto!important;aspect-ratio:1672/941;left:auto!important;right:0!important;top:auto!important;bottom:0!important}
}
@media(max-width:767px) and (orientation:portrait){
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-mobile-house:before{display:block!important;height:24%!important;background-size:auto 440px!important;background-position:right top!important;mask-image:linear-gradient(#000 70%,transparent)!important;-webkit-mask-image:linear-gradient(#000 70%,transparent)!important}
}
/* Match the portrait arrival frame to the wider still, and show a quiet rotation hint. */
.ha-rotate-hint{display:none}
@media(max-width:767px) and (orientation:portrait){
 #ha-site#ha-site .ha-hero .ha-mobile-house>.ha-arrival{background:transparent!important}
 #ha-site#ha-site .ha-hero .ha-mobile-house .ha-arrival video{position:absolute!important;inset:auto 0 0 auto!important;width:100%!important;height:82%!important;object-fit:cover!important;object-position:right bottom!important}
 #ha-site#ha-site .ha-mobile-house>.ha-rotate-hint{display:block;position:absolute;right:5%;bottom:10px;z-index:7;max-width:125px;margin:0;padding:4px 6px;border-radius:5px;background:rgba(24,32,28,.55);color:#edf4eb;font-size:9px;line-height:1.35;text-align:right;pointer-events:none;text-shadow:0 1px 3px #102017}
}

/* The arrival must cover the header too; the wider destination still remains unchanged. */
@media(max-width:767px) and (orientation:portrait){
 #ha-site#ha-site .ha-hero .ha-mobile-house .ha-arrival video{height:100%!important;inset:0!important}
 #ha-site#ha-site[data-arrival="playing"] .ha-hero:not(.ha-inline-room)>.ha-mobile-house:before{visibility:hidden!important}
}

/* Portrait phones: destination and arrival share the same full-height framing. */
@media(max-width:767px) and (orientation:portrait){
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-mobile-house{background-size:cover!important;background-position:right bottom!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-mobile-house .ha-live-svg{height:100%!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-mobile-house:before{display:none!important}
}

/* Compact hero copy on portrait phones, preserving usable touch targets. */
@media(max-width:767px) and (orientation:portrait){
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy{padding:8px 5% 10px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy h1{font-size:16px!important;line-height:1.1!important;letter-spacing:-.25px!important;padding:3px 5px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-eyebrow{font-size:7px!important;letter-spacing:1px!important;padding:2px 5px!important;margin-bottom:3px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-intro{font-size:10px!important;line-height:1.35!important;max-width:250px!important;padding:3px 5px!important;margin-top:4px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-partner{width:96px!important;max-width:96px!important;margin:4px 0!important;padding:3px 8px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-partner-logo{width:80px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-partner img{width:80px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-actions{margin-top:5px!important;gap:6px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-actions a{font-size:8.5px!important;padding:8px 9px!important;min-height:44px!important}
 #ha-site#ha-site .ha-hero:not(.ha-inline-room)>.ha-copy .ha-live{font-size:8px!important;padding:2px 5px!important;margin-top:4px!important;gap:6px!important}
}