/*
Theme Name:     TechPort
Theme URI:      https://www.techport.at/
Template:       kadence
Author:         Markus Reichl
Author URI:     https://github.com/produmatico/
Description:    Custom child theme for TechPort e.U. - a clean, modern IT-consulting site. Independent design built on the Kadence framework.
Version:        1.0.0
License:        GNU General Public License v2 or later
License URI:    https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:    techport
*/

/* =========================================================================
   TechPort design system
   ========================================================================= */
:root{
  --tp-ink:#0b1220;
  --tp-navy:#0f1b2d;
  --tp-navy-2:#13243c;
  --tp-surface:#ffffff;
  --tp-muted:#f5f8fc;
  --tp-line:#e6ecf3;
  --tp-text:#1f2a3a;
  --tp-text-soft:#5a6b82;
  --tp-teal:#14b8a6;
  --tp-teal-2:#0d9488;
  --tp-indigo:#6366f1;
  --tp-on-dark:#e7ecf5;
  --tp-on-dark-soft:#9fb0c9;
  --tp-radius:16px;
  --tp-radius-sm:10px;
  --tp-shadow:0 10px 30px -12px rgba(13,30,55,.18);
  --tp-shadow-lg:0 24px 60px -20px rgba(13,30,55,.35);
  --tp-maxw:1160px;
  --tp-font: "Segoe UI", system-ui, -apple-system, Roboto, Helvetica, Arial, sans-serif;
}
body{ font-family:var(--tp-font); color:var(--tp-text); background:var(--tp-surface);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
a{ text-decoration:none; }
.tp-section{ padding:96px 0; }
.tp-section > .wp-block-group__inner-container, .tp-wrap{ max-width:var(--tp-maxw); margin-inline:auto; padding-inline:24px; }
.tp-eyebrow{ text-transform:uppercase; letter-spacing:.18em; font-weight:700; font-size:.78rem; color:var(--tp-teal-2); margin:0 0 .6rem; }
.tp-section h2{ font-size:clamp(1.8rem,3.4vw,2.6rem); line-height:1.12; letter-spacing:-.02em; font-weight:800; margin:.1em 0 .5em; color:var(--tp-navy); }
.tp-lead{ font-size:1.12rem; line-height:1.7; color:var(--tp-text-soft); max-width:62ch; }

.tp-btns{ display:flex; gap:14px; flex-wrap:wrap; }
.tp-btn-ghost{ display:inline-flex; align-items:center; gap:.5em; background:transparent; color:var(--tp-on-dark)!important; border:1px solid rgba(231,236,245,.35); padding:13px 24px; border-radius:999px; font-weight:600; transition:border-color .15s, color .15s; }
.tp-btn-ghost:hover{ border-color:var(--tp-teal); color:#fff!important; }
.tp-foot-brand .mark{ font-weight:800; font-size:1.3rem; color:#fff; letter-spacing:-.01em; }
.tp-foot-brand .mark span{ color:var(--tp-teal); }
.tp-foot-links{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.tp-foot-links a{ font-size:.96rem; }
.wp-block-button.tp-cta-primary .wp-block-button__link, .tp-btn{ display:inline-flex; align-items:center; gap:.5em; background:var(--tp-teal); color:#04201c!important; font-weight:700; padding:14px 26px; border-radius:999px; border:0; box-shadow:0 8px 22px -8px rgba(20,184,166,.6); transition:transform .15s, box-shadow .15s, background .15s; }
.wp-block-button.tp-cta-primary .wp-block-button__link:hover, .tp-btn:hover{ transform:translateY(-2px); background:#19cdb8; box-shadow:0 14px 30px -10px rgba(20,184,166,.7); }
.wp-block-button.tp-cta-ghost .wp-block-button__link{ background:transparent; color:var(--tp-on-dark)!important; border:1px solid rgba(231,236,245,.35); padding:13px 24px; border-radius:999px; font-weight:600; }
.wp-block-button.tp-cta-ghost .wp-block-button__link:hover{ border-color:var(--tp-teal); color:#fff!important; }

.tp-hero{ position:relative; overflow:hidden; color:var(--tp-on-dark); background:radial-gradient(1100px 520px at 78% -10%, #1d3a6b 0%, rgba(29,58,107,0) 60%), radial-gradient(900px 500px at 8% 110%, #134e4a 0%, rgba(19,78,74,0) 55%), linear-gradient(160deg, #0b1220 0%, #0f1b2d 60%, #102338 100%); }
.tp-hero::before{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px); background-size:46px 46px; -webkit-mask-image:radial-gradient(70% 60% at 50% 30%, #000 40%, transparent 100%); mask-image:radial-gradient(70% 60% at 50% 30%, #000 40%, transparent 100%); }
.tp-hero .tp-wrap{ position:relative; padding-top:120px; padding-bottom:120px; }
.tp-hero h1{ font-size:clamp(2.3rem,5.2vw,4rem); line-height:1.05; letter-spacing:-.03em; font-weight:800; margin:.4em 0 .35em; color:#fff; max-width:18ch; }
.tp-hero h1 .tp-hl{ color:var(--tp-teal); }
.tp-hero .tp-lead{ color:var(--tp-on-dark-soft); font-size:1.2rem; max-width:60ch; }
.tp-hero .tp-eyebrow{ color:var(--tp-teal); }
.tp-hero .tp-btns{ margin-top:34px; }
.tp-hero-meta{ margin-top:46px; display:flex; gap:30px; flex-wrap:wrap; color:var(--tp-on-dark-soft); font-size:.95rem; }
.tp-hero-meta b{ color:#fff; }

.tp-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.tp-stat{ text-align:center; }
.tp-stat .n{ font-size:2.4rem; font-weight:800; color:var(--tp-navy); letter-spacing:-.02em; }
.tp-stat .l{ color:var(--tp-text-soft); font-size:.95rem; margin-top:4px; }

.tp-bg-muted{ background:var(--tp-muted); }
.tp-grid{ display:grid; gap:22px; grid-template-columns:repeat(3,1fr); margin-top:42px; }
.tp-card{ background:var(--tp-surface); border:1px solid var(--tp-line); border-radius:var(--tp-radius); padding:30px 28px; box-shadow:var(--tp-shadow); transition:transform .18s, box-shadow .18s, border-color .18s; }
.tp-card:hover{ transform:translateY(-4px); box-shadow:var(--tp-shadow-lg); border-color:#d6e6f5; }
.tp-card .ic{ width:48px; height:48px; border-radius:12px; display:grid; place-items:center; background:linear-gradient(135deg, rgba(20,184,166,.16), rgba(99,102,241,.16)); margin-bottom:16px; font-size:24px; }
.ic svg{ width:24px; height:24px; fill:none; stroke:var(--tp-teal-2); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.tp-contact-card .row .ic{ width:34px; height:34px; border-radius:9px; display:grid; place-items:center; background:linear-gradient(135deg, rgba(20,184,166,.16), rgba(99,102,241,.16)); }
.tp-contact-card .row .ic svg{ width:18px; height:18px; }
/* Branding: show logo only (hide duplicate site title), keep header clean */
.site-branding .site-title-wrap{ display:none !important; }
.site-branding a.brand img.custom-logo, .site-branding a.brand img.svg-logo-image{ max-width:170px; width:170px; height:auto; }
#masthead{ box-shadow:0 1px 0 rgba(15,27,45,.06), 0 6px 24px -18px rgba(13,30,55,.35); }
.main-navigation .primary-menu-container > ul > li.menu-item > a{ font-weight:600; }
.tp-card h3{ font-size:1.18rem; font-weight:700; color:var(--tp-navy); margin:.2em 0 .4em; }
.tp-card p{ color:var(--tp-text-soft); line-height:1.6; margin:0; font-size:.98rem; }

.tp-split{ display:grid; grid-template-columns:1.05fr 1fr; gap:56px; align-items:start; }
.tp-profile{ display:grid; grid-template-columns:.82fr 1.18fr; gap:56px; align-items:start; }
.tp-portrait{ margin:0; position:sticky; top:96px; }
.tp-portrait .frame{ padding:6px; border-radius:20px; background:linear-gradient(140deg, rgba(20,184,166,.55), rgba(99,102,241,.5)); box-shadow:var(--tp-shadow-lg); }
.tp-portrait img{ display:block; width:100%; height:auto; border-radius:15px; }
.tp-portrait figcaption{ margin-top:16px; }
.tp-portrait figcaption strong{ display:block; color:var(--tp-navy); font-size:1.05rem; }
.tp-portrait figcaption span{ color:var(--tp-text-soft); font-size:.92rem; }
.tp-profile-body .tp-timeline{ margin-top:34px; }
@media (max-width:1024px){ .tp-profile{ grid-template-columns:1fr; gap:30px; } .tp-portrait{ position:static; max-width:340px; } }
.tp-timeline{ list-style:none; margin:0; padding:0; position:relative; }
.tp-timeline::before{ content:""; position:absolute; left:9px; top:6px; bottom:6px; width:2px; background:linear-gradient(var(--tp-teal), var(--tp-indigo)); opacity:.35; }
.tp-timeline li{ position:relative; padding:0 0 26px 38px; }
.tp-timeline li::before{ content:""; position:absolute; left:2px; top:4px; width:16px; height:16px; border-radius:50%; background:var(--tp-surface); border:3px solid var(--tp-teal); box-shadow:0 0 0 4px rgba(20,184,166,.12); }
.tp-timeline .yr{ font-weight:800; color:var(--tp-teal-2); font-size:.92rem; letter-spacing:.04em; }
.tp-timeline h4{ margin:.15em 0 .25em; font-size:1.05rem; color:var(--tp-navy); }
.tp-timeline p{ margin:0; color:var(--tp-text-soft); font-size:.96rem; line-height:1.55; }

.tp-quote{ background:var(--tp-navy); color:var(--tp-on-dark); border-radius:var(--tp-radius); padding:40px; box-shadow:var(--tp-shadow-lg); }
.tp-quote p{ font-size:1.25rem; line-height:1.6; color:#fff; font-weight:500; }
.tp-quote cite{ color:var(--tp-on-dark-soft); font-style:normal; font-size:.95rem; }
.tp-reflist{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:30px; }
.tp-reflist span{ display:grid; place-items:center; padding:22px; border:1px dashed var(--tp-line); border-radius:12px; color:var(--tp-text-soft); font-weight:600; background:#fff; }

.tp-contact-grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:48px; align-items:start; }
.tp-contact-card{ background:var(--tp-muted); border:1px solid var(--tp-line); border-radius:var(--tp-radius); padding:30px; }
.tp-contact-card .row{ display:flex; gap:12px; align-items:flex-start; margin-bottom:16px; }
.tp-contact-card .row .ic{ font-size:18px; }
.tp-contact-card a{ color:var(--tp-teal-2); font-weight:600; }
.fluentform .ff-btn-submit{ background:var(--tp-teal)!important; border:0!important; border-radius:999px!important; padding:13px 28px!important; font-weight:700!important; color:#04201c!important; }
.fluentform input.ff-el-form-control, .fluentform textarea.ff-el-form-control{ border-radius:10px!important; border:1px solid var(--tp-line)!important; padding:12px 14px!important; }

.tp-ctaband{ background:linear-gradient(120deg, var(--tp-teal-2), var(--tp-indigo)); color:#fff; border-radius:24px; padding:54px; text-align:center; box-shadow:var(--tp-shadow-lg); }
.tp-ctaband h2{ color:#fff; margin-top:0; }
.tp-ctaband .tp-lead{ color:rgba(255,255,255,.9); margin:0 auto 24px; }
.tp-ctaband .tp-btn{ background:#fff; color:var(--tp-navy)!important; box-shadow:0 10px 30px -10px rgba(0,0,0,.35); }

.tp-langswitch{ display:inline-flex; gap:6px; list-style:none; margin:0; padding:0; line-height:normal; }
.tp-langswitch .tp-lang{ box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center;
  min-width:34px; height:30px; padding:0 8px; border-radius:999px; font-size:.82rem; font-weight:700;
  color:var(--tp-text-soft); border:1px solid var(--tp-line); background:transparent;
  transition:background-color .15s, color .15s, border-color .15s; text-decoration:none; }
.tp-langswitch .tp-lang:hover{ color:var(--tp-teal-2); border-color:var(--tp-teal); background:transparent; }
.tp-langswitch .tp-lang.is-current{ background:var(--tp-navy); color:#fff; border-color:var(--tp-navy); }
.tp-langswitch .tp-lang.is-current:hover{ background:var(--tp-navy-2); color:#fff; border-color:var(--tp-navy-2); }
/* Neutralise theme menu effects on the switcher (no underline pseudo, no transform/flip) */
.tp-menu-lang{ display:flex; align-items:center; }
.tp-menu-lang .tp-langswitch .tp-lang::before,
.tp-menu-lang .tp-langswitch .tp-lang::after{ content:none !important; display:none !important; }
.tp-menu-lang .tp-langswitch, .tp-menu-lang .tp-langswitch .tp-lang{ transform:none !important; }

.tp-footer{ background:var(--tp-ink); color:var(--tp-on-dark-soft); }
.tp-footer a{ color:var(--tp-on-dark-soft); }
.tp-footer a:hover{ color:var(--tp-teal); }
.tp-footer h4{ color:#fff; font-size:1rem; margin:0 0 .8em; }
.tp-footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; padding:64px 0 40px; }
.tp-footer-bottom{ border-top:1px solid rgba(255,255,255,.08); padding:22px 0; font-size:.88rem; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }

.tp-legal{ max-width:820px; }
.tp-legal h2{ font-size:1.4rem; margin-top:1.6em; }
.tp-legal p, .tp-legal li{ color:var(--tp-text-soft); line-height:1.7; }

/* ---------- Contact form ---------- */
.tp-form{ display:flex; flex-direction:column; gap:16px; }
.tp-form-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.tp-field{ display:flex; flex-direction:column; gap:6px; }
.tp-field > span{ font-weight:600; color:var(--tp-navy); font-size:.92rem; }
.tp-form input[type=text], .tp-form input[type=email], .tp-form textarea{
  width:100%; border:1px solid var(--tp-line); border-radius:10px; padding:12px 14px;
  font:inherit; color:var(--tp-text); background:#fff; transition:border-color .15s, box-shadow .15s; }
.tp-form input:focus, .tp-form textarea:focus{ outline:none; border-color:var(--tp-teal);
  box-shadow:0 0 0 3px rgba(20,184,166,.15); }
.tp-form textarea{ resize:vertical; min-height:130px; }
.tp-consent{ display:flex; gap:10px; align-items:flex-start; font-size:.9rem; color:var(--tp-text-soft); line-height:1.5; }
.tp-consent input{ margin-top:3px; }
.tp-consent a{ color:var(--tp-teal-2); font-weight:600; }
.tp-form .tp-btn{ align-self:flex-start; cursor:pointer; }
.tp-hp{ position:absolute!important; left:-9999px!important; width:1px; height:1px; overflow:hidden; }
.tp-formnotice{ border-radius:10px; padding:14px 16px; font-weight:600; font-size:.95rem; }
.tp-formnotice.is-ok{ background:rgba(20,184,166,.12); color:#0b6b5f; border:1px solid rgba(20,184,166,.4); }
.tp-formnotice.is-err{ background:rgba(239,68,68,.1); color:#b91c1c; border:1px solid rgba(239,68,68,.35); }
@media (max-width:640px){ .tp-form-row{ grid-template-columns:1fr; } }

@media (max-width:1024px){
  .tp-grid{ grid-template-columns:repeat(2,1fr); }
  .tp-split,.tp-contact-grid{ grid-template-columns:1fr; gap:40px; }
  .tp-stats{ grid-template-columns:repeat(2,1fr); }
  .tp-reflist{ grid-template-columns:repeat(2,1fr); }
  .tp-footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .tp-section{ padding:64px 0; }
  .tp-grid{ grid-template-columns:1fr; }
  .tp-ctaband{ padding:36px 22px; }
  .tp-footer-grid{ grid-template-columns:1fr; gap:28px; }
  .tp-hero .tp-wrap{ padding-top:90px; padding-bottom:90px; }
}