/* Takteam-site-lager: integrerar fler delar ur den riktiga sajten med rörelse.
   Megameny-animation, nav-scroll-state, trust-bar, lead-form, karusell, FAQ, orter. */

/* ---------- Rakkas display-accent ---------- */
.tt-display { font-family: "Rakkas", "Barlow", serif; font-weight: 400; letter-spacing: .01em; line-height: 1.05; }

/* ---------- Nav-scroll-state ---------- */
.top-nav { transition: box-shadow .3s var(--ease-quart), padding .3s var(--ease-quart); }
.top-nav.tt-scrolled { box-shadow: 0 8px 24px rgba(5,30,64,.28); }
.top-nav.tt-scrolled .top-nav__inner { padding-top: 0; padding-bottom: 0; }
.top-nav__item { transition: color .2s, border-color .2s; }

/* ---------- Megameny-animation (is-open, inte hidden) ---------- */
.megamenu { opacity: 0; visibility: hidden; transform: translateY(-12px); transition: opacity .26s var(--ease-quart), transform .32s var(--ease-quart), visibility 0s linear .32s; }
.megamenu.is-open { opacity: 1; visibility: visible; transform: none; transition: opacity .28s var(--ease-quart), transform .36s var(--ease-quart), visibility 0s; }
.megamenu .megamenu__col, .megamenu .megamenu__link { opacity: 0; transform: translateY(8px); }
.megamenu.is-open .megamenu__col, .megamenu.is-open .megamenu__link { opacity: 1; transform: none; transition: opacity .4s var(--ease-expo), transform .45s var(--ease-expo); transition-delay: calc(var(--i, 0) * 45ms + .06s); }

/* ---------- Knapp: blinkande pil ---------- */
.tt-arrow { display: inline-block; margin-left: .5rem; transition: transform .25s var(--ease-quart); }
.tt-btn:hover .tt-arrow, .tt-fbtn:hover .tt-arrow { transform: translateX(4px); }
.tt-fbtn .tt-arrow { animation: tt-blink 1.8s ease-in-out infinite; }
@keyframes tt-blink { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }

/* ---------- Trust-bar ---------- */
.tt-trustbar { display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; align-items: center; background: #fff; border: 1px solid var(--tt-line); border-radius: 12px; padding: .55rem 1rem; margin-bottom: 1.2rem; font-size: .8rem; color: var(--tt-navy); font-weight: 600; }
.tt-trustbar span { display: inline-flex; align-items: center; gap: .4rem; }
.tt-trustbar .tt-tb-ico { color: var(--tt-blue); }
.tt-trustbar .tt-tb-phone { margin-left: auto; color: var(--tt-blue); }

/* ---------- Hero lead-form ---------- */
.tt-leadform { background: linear-gradient(120deg, var(--tt-blue), #1b4f9c); color: #fff; border-radius: 16px; padding: 1.6rem 1.7rem; margin: 1.4rem 0 1.8rem; display: grid; grid-template-columns: 1fr 1.2fr; gap: 1.3rem; align-items: center; }
.tt-leadform__h { font-size: 1.35rem; font-weight: 800; margin: 0 0 .3rem; }
.tt-leadform__p { font-size: .9rem; opacity: .92; margin: 0; max-width: 34ch; }
.tt-leadform__form { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; }
.tt-leadform__form select, .tt-leadform__form input { background: #fff; border: none; border-radius: 8px; padding: .58rem .7rem; font-family: inherit; font-size: .85rem; color: var(--tt-text); width: 100%; box-sizing: border-box; }
.tt-leadform__form .tt-btn { grid-column: 1 / -1; }
.tt-leadform__form .full { grid-column: 1 / -1; }

/* ---------- Kundomdömen, karusell ---------- */
.tt-revs { display: flex; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; padding: .3rem .1rem 1rem; -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
.tt-rev { scroll-snap-align: start; flex: 0 0 300px; background: #fff; border: 1px solid var(--tt-line); border-radius: 14px; padding: 1.1rem 1.2rem; }
.tt-rev__stars { color: #f5b21a; letter-spacing: 2px; font-size: .9rem; }
.tt-rev__q { color: var(--tt-text); font-size: .92rem; line-height: 1.5; margin: .5rem 0 .7rem; }
.tt-rev__by { color: var(--tt-muted); font-weight: 700; font-size: .82rem; }

/* ---------- FAQ-dragspel ---------- */
.tt-faq { display: grid; gap: .5rem; max-width: 760px; }
.tt-faq__item { background: #fff; border: 1px solid var(--tt-line); border-radius: 10px; overflow: hidden; }
.tt-faq__q { width: 100%; text-align: left; background: none; border: none; padding: .85rem 1.1rem; font-family: inherit; font-weight: 700; color: var(--tt-navy); font-size: .94rem; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.tt-faq__q .tt-faq__plus { color: var(--tt-blue); font-size: 1.2rem; transition: transform .3s var(--ease-quart); flex: 0 0 auto; }
.tt-faq__item.open .tt-faq__plus { transform: rotate(45deg); }
.tt-faq__a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .32s var(--ease-quart); }
.tt-faq__item.open .tt-faq__a { grid-template-rows: 1fr; }
.tt-faq__a > div { overflow: hidden; }
.tt-faq__a p { margin: 0; padding: 0 1.1rem 1rem; color: var(--tt-muted); font-size: .88rem; line-height: 1.55; }

/* ---------- Orter / kontor ---------- */
.tt-offices { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .7rem; }
.tt-office { background: #fff; border: 1px solid var(--tt-line); border-radius: 12px; padding: .9rem 1rem; transition: border-color .2s, transform .15s; }
.tt-office:hover { border-color: var(--tt-yellow); transform: translateY(-2px); }
.tt-office__name { font-weight: 800; color: var(--tt-navy); display: flex; align-items: center; gap: .45rem; }
.tt-office__name .tt-pin { color: var(--tt-blue); }
.tt-office__addr { font-size: .8rem; color: var(--tt-muted); margin-top: .25rem; }

.tt-band { margin: 2rem 0 .5rem; }
.tt-band .tt-eyebrow { margin-bottom: .2rem; }

@media (max-width: 760px) {
  .tt-leadform { grid-template-columns: 1fr; }
  .tt-trustbar .tt-tb-phone { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .megamenu, .megamenu.is-open, .megamenu .megamenu__col, .megamenu .megamenu__link { transition: none; transform: none; }
  .tt-fbtn .tt-arrow { animation: none; opacity: 1; }
  .tt-faq__a { transition: none; }
}