/* Forsíða */
/* hero: the extruded roofs leading the page */
.hero{position:relative;overflow:hidden;padding-block:clamp(3rem,7vw,6rem) clamp(3rem,6vw,5rem)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.hero-copy{display:grid;gap:1.5rem;min-width:0}
.hero h1 .gold-t{display:block}
.ctas{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:.4rem}
.hero-art{min-width:0;max-width:100%}
.roofs3d{display:block;width:100%;height:auto;overflow:visible;filter:drop-shadow(0 30px 60px rgba(230,175,95,.18));will-change:transform}
.roofs3d .f1,.roofs3d .f2{stroke-dasharray:1;stroke-dashoffset:0}
.roofs3d .ext>*{transform:translate(var(--o),var(--o))}
.js .roofs3d .f1,.js .roofs3d .f2{animation:draw 1.3s var(--ease) both}
.js .roofs3d .f1{animation-delay:.25s}
.js .roofs3d .ext>*{animation:grow .7s var(--ease) both}
.js .roofs3d .fw rect{transform-box:fill-box;transform-origin:center;animation:pop .5s var(--ease) both}
@keyframes draw{from{stroke-dashoffset:1}}
@keyframes grow{from{transform:translate(0,0);opacity:0}}
@keyframes pop{from{transform:scale(0)}}
.js .hero-copy>*{animation:rise .8s var(--ease) both}
.js .hero-copy>*:nth-child(2){animation-delay:.08s}.js .hero-copy>*:nth-child(3){animation-delay:.16s}.js .hero-copy>*:nth-child(4){animation-delay:.24s}


/* services */
.svc-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(1.1rem,2.2vw,1.8rem)}
@media (min-width:1101px){.svc-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.svc{grid-column:span 2}}
@media (min-width:761px) and (max-width:1100px){.svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.svc .photo{aspect-ratio:4/5}
.svc{display:grid;grid-template-rows:1fr auto;gap:1.15rem;min-width:0;color:inherit;text-decoration:none;border-radius:var(--r)}
.svc .svc-top{align-self:end}
.svc:focus-visible{outline-offset:6px;border-radius:var(--r)}
.svc:hover .photo img{transform:scale(1.035)}
.svc-go{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1.5px solid var(--line);background:#fff;color:var(--ink);transition:background .25s,border-color .25s,transform .3s var(--ease)}
.svc-go svg{width:17px;height:17px}
.svc:hover .svc-go,.svc:focus-visible .svc-go{background:var(--gold);border-color:var(--gold);transform:translateX(3px)}
.svc-top{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.price-tag{display:inline-block;background:var(--gold);color:var(--ink);font-family:var(--mono);font-size:.7rem;font-weight:500;letter-spacing:.08em;border-radius:999px;padding:.25rem .65rem;vertical-align:middle;margin-left:.4rem;font-stretch:100%}
.other{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:1.2rem 2rem;flex-wrap:wrap;border:1px solid var(--line);background:#fff;border-radius:var(--r);padding:clamp(1.3rem,3vw,1.9rem) clamp(1.3rem,3vw,2.2rem)}
.other div{display:grid;gap:.35rem;max-width:58ch}
.other p{color:var(--mute)}


/* contact */
.contact{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.contact-side{display:grid;gap:1.5rem;min-width:0}
.contact h2 .gold-t{display:block}
.cblock{display:grid;gap:.45rem;padding-top:1.1rem;border-top:1px solid var(--ink-3)}
.cblock .mono{color:var(--gold)}
.erow{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap}
.erow a{font-size:clamp(1.1rem,2vw,1.3rem);font-weight:600;text-decoration:none;color:var(--paper);border-bottom:2px solid var(--gold);overflow-wrap:anywhere}
.big-tel{font-family:var(--display);font-weight:900;font-stretch:116%;font-size:clamp(1.9rem,3.2vw,2.9rem);white-space:nowrap;line-height:1;color:var(--paper);text-decoration:none}
.icon-btn{width:40px;height:40px;border-radius:50%;border:1.5px solid var(--ink-3);background:transparent;display:grid;place-items:center;cursor:pointer;color:var(--bone)}
.icon-btn:hover{border-color:var(--gold);color:var(--gold)}
.icon-btn svg{width:17px;height:17px}
.contact-side .mono[data-copy-email-status]{color:var(--gold)}
.contact-side .link{color:var(--gold)}
.form-card{color:var(--ink)}
.type-hint{grid-column:1/-1;display:flex;gap:.8rem;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--mist);border-radius:12px;padding:.8rem 1rem;font-size:.92rem}
.type-hint a{color:var(--gold-deep);font-weight:600}

@media (max-width:900px){
  .hero-grid,.contact{grid-template-columns:minmax(0,1fr)}
  .hero-art{max-width:460px;width:100%;justify-self:center}
}
@media (max-width:760px){
  .svc-grid{grid-template-columns:minmax(0,1fr)}
  .svc .photo{aspect-ratio:4/3}
}
@media (max-width:600px){
  body{font-size:16px}
  h1{font-size:clamp(2.5rem,11.5vw,3.4rem)}
  .ctas .btn{flex:1 1 100%}
  .other .btn{width:100%}
}