/* ==========================================================================
   TEAM MIKE — CHI SIAMO
   ========================================================================== */

.tm-about-page{
    --tm-about-bg:#080808;
    --tm-about-bg-2:#0d0d0d;
    --tm-about-panel:#111;
    --tm-about-text:#f5f5f5;
    --tm-about-muted:#a7a7a7;
    --tm-about-red:#e10600;
    --tm-about-red-2:#ff2a22;
    --tm-about-line:#282828;
    --tm-about-shadow:0 18px 50px rgba(0,0,0,.26);
    overflow:hidden;
    background:var(--tm-about-bg);
    color:var(--tm-about-text);
    font-family:Montserrat,Arial,sans-serif;
    line-height:1.55;
}

.tm-about-page *,.tm-about-page *::before,.tm-about-page *::after{box-sizing:border-box}
.tm-about-page .section{padding:92px 0}

.tm-about-kicker{
    display:block;
    margin-bottom:11px;
    color:var(--tm-about-red-2);
    font-size:.76rem;
    line-height:1;
    font-weight:900;
    letter-spacing:.17em;
    text-transform:uppercase;
}

/* HERO */
.tm-about-hero{
    position:relative;
    isolation:isolate;
    min-height:620px;
    display:grid;
    align-items:center;
    overflow:hidden;
    border-bottom:1px solid rgba(255,255,255,.07);
    background:
        radial-gradient(circle at 82% 28%,rgba(225,6,0,.15),transparent 28%),
        linear-gradient(135deg,#080808 0%,#0b0b0b 58%,#151515 100%);
}

.tm-about-hero__grid{
    position:absolute;
    inset:0;
    z-index:-3;
    opacity:.75;
    background-image:
        linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
    background-size:40px 40px;
    mask-image:linear-gradient(to right,#000,transparent 86%);
}

.tm-about-hero::after{
    content:"TEAM MIKE";
    position:absolute;
    right:-20px;
    bottom:-22px;
    z-index:-2;
    color:rgba(255,255,255,.015);
    font-family:Oswald,Impact,sans-serif;
    font-size:clamp(5.5rem,12vw,11rem);
    line-height:.8;
    font-weight:500;
    letter-spacing:-.03em;
    white-space:nowrap;
    pointer-events:none;
}

.tm-about-hero__glow{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
}

.tm-about-hero__glow--one{
    width:360px;
    height:360px;
    top:-150px;
    right:-120px;
    border:1px solid rgba(225,6,0,.12);
    box-shadow:
        0 0 0 50px rgba(225,6,0,.016),
        0 0 0 100px rgba(225,6,0,.008);
}

.tm-about-hero__glow--two{
    width:200px;
    height:200px;
    left:47%;
    bottom:-140px;
    background:rgba(225,6,0,.035);
}

.tm-about-hero__layout{
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
    gap:clamp(42px,6vw,82px);
    align-items:center;
    padding:72px 0 76px;
}

.tm-about-hero__content{
    max-width:720px;
    position:relative;
    z-index:2;
}

.tm-about-hero h1{
    max-width:720px;
    margin:14px 0 20px;
    color:#fff;
    font-family:Oswald,Impact,sans-serif;
    font-size:clamp(2.9rem,5vw,4.8rem);
    line-height:.98;
    font-weight:500;
    letter-spacing:-.02em;
    text-transform:uppercase;
}

.tm-about-hero h1 span{
    color:var(--tm-about-red-2);
}

.tm-about-hero__lead{
    max-width:620px;
    margin:0;
    color:#d0d0d0;
    font-size:1rem;
    line-height:1.7;
}

.tm-about-hero__lead strong{
    color:#fff;
    font-weight:700;
}

.tm-about-hero__intro{
    max-width:590px;
    margin:14px 0 0;
    color:#8f8f8f;
    font-size:.92rem;
    line-height:1.68;
}

.tm-about-hero__signature{
    display:flex;
    align-items:center;
    gap:14px;
    margin-top:30px;
    color:#c7c7c7;
    font-size:.74rem;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.tm-about-hero__signature i{
    width:34px;
    height:1px;
    background:var(--tm-about-red);
}


/* Hero media / photo */
.tm-about-hero__media{
    min-width:0;
}

.tm-about-hero-photo{
    position:relative;
    min-height:470px;
    overflow:hidden;
    border:1px solid #2b2b2b;
    border-radius:26px;
    background:
        radial-gradient(circle at 68% 22%,rgba(225,6,0,.13),transparent 30%),
        linear-gradient(145deg,#171717,#0d0d0d);
    box-shadow:0 24px 60px rgba(0,0,0,.28);
}

.tm-about-hero-photo>img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    object-position:center;
}

.tm-about-hero-photo__placeholder{
    position:absolute;
    inset:0;
    z-index:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:6px;
    padding:32px;
    color:#717171;
    text-align:center;
}

.tm-about-hero-photo__placeholder span{
    color:var(--tm-about-red);
    font-size:.7rem;
    line-height:1;
    font-weight:900;
    letter-spacing:.16em;
    text-transform:uppercase;
}

.tm-about-hero-photo__placeholder strong{
    color:#bdbdbd;
    font-family:Oswald,Impact,sans-serif;
    font-size:1.8rem;
    line-height:1.05;
    font-weight:500;
    text-transform:uppercase;
}

.tm-about-hero-photo__placeholder small{
    max-width:280px;
    color:#666;
    font-size:.72rem;
    line-height:1.45;
}

.tm-about-hero-photo__overlay{
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
    background:
        linear-gradient(180deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,.02) 55%,rgba(0,0,0,.70) 100%);
}

.tm-about-hero-photo__badge{
    position:absolute;
    left:20px;
    right:20px;
    bottom:20px;
    z-index:2;
    padding:15px 17px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:14px;
    background:rgba(8,8,8,.74);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}

.tm-about-hero-photo__badge span{
    display:block;
    margin-bottom:4px;
    color:var(--tm-about-red-2);
    font-size:.66rem;
    line-height:1;
    font-weight:900;
    letter-spacing:.11em;
    text-transform:uppercase;
}

.tm-about-hero-photo__badge strong{
    display:block;
    color:#fff;
    font-family:Oswald,Impact,sans-serif;
    font-size:1.35rem;
    line-height:1.08;
    font-weight:500;
    text-transform:uppercase;
}

/* HEADINGS */
.tm-about-section-head{
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(280px,.65fr);
    gap:44px;
    align-items:end;
    margin-bottom:42px;
}

.tm-about-section-head h2,
.tm-about-direction h2,
.tm-about-union h2,
.tm-about-future h2,
.tm-about-cta h2{
    margin:0;
    color:#fff;
    font-family:Oswald,Impact,sans-serif;
    font-size:clamp(2rem,3.8vw,3.5rem);
    line-height:1;
    font-weight:500;
    letter-spacing:-.02em;
    text-transform:uppercase;
}

.tm-about-section-head>p{margin:0;color:#909090;font-size:.94rem;line-height:1.7}

/* BROTHERS */
.tm-about-brothers{background:#0c0c0c}
.tm-about-brothers-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.tm-about-person{
    position:relative;
    overflow:hidden;
    border:1px solid #282828;
    border-radius:26px;
    background:radial-gradient(circle at 100% 0%,rgba(225,6,0,.055),transparent 28%),linear-gradient(145deg,#151515,#0e0e0e);
    box-shadow:var(--tm-about-shadow);
}
.tm-about-person__number{position:absolute;right:18px;top:10px;color:rgba(255,255,255,.04);font-family:Oswald,Impact,sans-serif;font-size:5.4rem;line-height:1;font-weight:500}
.tm-about-person__head{padding:30px 30px 25px;border-bottom:1px solid #272727}
.tm-about-person__head>span{display:block;margin-bottom:8px;color:var(--tm-about-red-2);font-size:.69rem;line-height:1;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.tm-about-person__head h3{margin:0;color:#fff;font-family:Oswald,Impact,sans-serif;font-size:clamp(2.3rem,4vw,3.7rem);line-height:1;font-weight:500;letter-spacing:-.02em;text-transform:uppercase}
.tm-about-person__head strong{display:block;margin-top:7px;color:#757575;font-size:.76rem;font-weight:700}
.tm-about-person__content{padding:28px 30px 32px}
.tm-about-person__content>p{margin:0;color:#a6a6a6;font-size:.9rem;line-height:1.75}
.tm-about-person__content>p+p{margin-top:16px}

.tm-about-quote{position:relative;margin:23px 0;padding:18px 18px 18px 44px;border-left:3px solid var(--tm-about-red);border-radius:0 12px 12px 0;background:rgba(255,255,255,.025)}
.tm-about-quote>span{position:absolute;top:5px;left:14px;color:var(--tm-about-red);font-family:Georgia,serif;font-size:2rem}
.tm-about-quote p{margin:0;color:#d0d0d0;font-size:.88rem;line-height:1.65}

.tm-about-highlight{margin:22px 0;padding:18px 20px;display:flex;align-items:center;gap:18px;border:1px solid rgba(225,6,0,.18);border-radius:14px;background:rgba(225,6,0,.07)}
.tm-about-highlight strong{flex:0 0 auto;color:#fff;font-family:Oswald,Impact,sans-serif;font-size:2rem;line-height:1;font-weight:500}
.tm-about-highlight span{color:#aaa;font-size:.76rem;line-height:1.45}

/* DIRECTION */
.tm-about-direction{background:#f4f4f4;color:#111}
.tm-about-direction-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(45px,7vw,90px)}
.tm-about-direction h2{color:#111}
.tm-about-direction__content{padding-left:30px;border-left:1px solid #d8d8d8}
.tm-about-direction__content>p{margin:0;color:#626262;font-size:.94rem;line-height:1.76}
.tm-about-direction__content>p+p{margin-top:17px}
.tm-about-direction__content strong{color:#171717}
.tm-about-direction__statement{margin-top:25px!important;padding:18px 20px;border-left:3px solid var(--tm-about-red);background:#fff}
.tm-about-not-list{margin-top:26px;display:grid;gap:8px}
.tm-about-not-list span,.tm-about-not-list strong{display:block;padding:11px 13px;border-radius:10px;background:#e9eaec;color:#555;font-size:.82rem}
.tm-about-not-list strong{background:#111;color:#fff}

/* UNION */
.tm-about-union{background:#090909}
.tm-about-union-card{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    overflow:hidden;
    border:1px solid #292929;
    border-radius:28px;
    background:radial-gradient(circle at 0 100%,rgba(225,6,0,.08),transparent 28%),linear-gradient(145deg,#151515,#0d0d0d);
    box-shadow:var(--tm-about-shadow);
}
.tm-about-union-card__top{padding:clamp(30px,4vw,48px);border-right:1px solid #292929}
.tm-about-union-card__top h2 span{color:var(--tm-about-red-2)}
.tm-about-union-card__body{padding:clamp(30px,4vw,48px)}
.tm-about-union-card__body>p{margin:0;color:#a0a0a0;font-size:.91rem;line-height:1.72}
.tm-about-union-card__body>p+p{margin-top:16px}
.tm-about-union-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:26px 0}
.tm-about-union-columns>div{padding:18px;border:1px solid #292929;border-radius:14px;background:#101010}
.tm-about-union-columns span{display:block;margin-bottom:10px;color:var(--tm-about-red);font-family:Oswald,Impact,sans-serif;font-size:1rem;font-weight:500}
.tm-about-union-columns strong{display:block;margin-bottom:7px;color:#fff;font-size:.86rem}
.tm-about-union-columns p{margin:0;color:#808080;font-size:.77rem;line-height:1.55}
.tm-about-union-conclusion{padding-top:22px;border-top:1px solid #292929;color:#d0d0d0!important}
.tm-about-union-conclusion strong{color:#fff}

/* WORK */
.tm-about-work{background:#f4f4f4;color:#111}
.tm-about-section-head--light h2{color:#111}
.tm-about-section-head--light>p{color:#676767}
.tm-about-work-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);gap:clamp(40px,7vw,80px);align-items:center}
.tm-about-work-copy p{margin:0;color:#626262;font-size:.93rem;line-height:1.75}
.tm-about-work-copy p+p{margin-top:17px}
.tm-about-work-copy strong{color:#171717}

.tm-about-work-visual{
    min-height:430px;
    position:relative;
    display:grid;
    grid-template-columns:repeat(2,1fr);
    grid-template-rows:repeat(2,1fr);
    gap:15px;
    padding:25px;
    border:1px solid #dedede;
    border-radius:24px;
    background:#fff;
    box-shadow:0 16px 40px rgba(0,0,0,.055);
}
.tm-about-work-node{min-height:150px;display:grid;place-items:center;border:1px solid #e3e3e3;border-radius:16px;background:#f7f7f7;color:#4f4f4f;font-size:.75rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.tm-about-work-core{
    position:absolute;
    left:50%;top:50%;z-index:3;
    width:185px;height:185px;
    display:grid;place-content:center;
    padding:20px;
    border:8px solid #fff;border-radius:50%;
    background:radial-gradient(circle at 70% 20%,rgba(225,6,0,.2),transparent 35%),#111;
    color:#fff;text-align:center;
    transform:translate(-50%,-50%);
    box-shadow:0 18px 38px rgba(0,0,0,.20);
}
.tm-about-work-core small{color:#999;font-size:.61rem;line-height:1.4;text-transform:uppercase}
.tm-about-work-core strong{display:block;margin-top:7px;font-family:Oswald,Impact,sans-serif;font-size:1.75rem;line-height:1;font-weight:500}

/* FUTURE */
.tm-about-future{background:radial-gradient(circle at 85% 15%,rgba(225,6,0,.12),transparent 25%),#0a0a0a}
.tm-about-future-card{max-width:980px;margin:0 auto;text-align:center}
.tm-about-future h2{font-size:clamp(2.2rem,4.4vw,4rem)}
.tm-about-future h2 span{color:var(--tm-about-red-2)}
.tm-about-future-text{max-width:760px;margin:28px auto 0}
.tm-about-future-text p{margin:0;color:#9c9c9c;font-size:.94rem;line-height:1.75}
.tm-about-future-text p+p{margin-top:16px}
.tm-about-future-manifesto{max-width:720px;margin:32px auto 0;display:grid;gap:7px}
.tm-about-future-manifesto span{padding:12px 14px;border:1px solid #292929;border-radius:11px;background:#101010;color:#d1d1d1;font-size:.83rem;font-weight:700}
.tm-about-future-signoff{margin-top:38px}
.tm-about-future-signoff strong{display:block;color:#fff;font-family:Oswald,Impact,sans-serif;font-size:2rem;line-height:1;font-weight:500;text-transform:uppercase}
.tm-about-future-signoff p{margin:9px 0 0;color:#777;font-size:.82rem}

/* CTA */
.tm-about-cta{padding:0 0 82px;background:#0a0a0a}
.tm-about-cta__inner{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:32px 34px;border:1px solid #2a2a2a;border-radius:22px;background:radial-gradient(circle at 100% 0%,rgba(225,6,0,.08),transparent 28%),#111}
.tm-about-cta h2{max-width:700px;font-size:clamp(1.8rem,3.2vw,2.9rem)}
.tm-about-cta .btn{flex:0 0 auto}

/* RESPONSIVE */
@media(max-width:991.98px){
    .tm-about-hero__layout,
    .tm-about-section-head,
    .tm-about-direction-grid,
    .tm-about-union-card,
    .tm-about-work-layout{grid-template-columns:1fr}

    .tm-about-brothers-grid{grid-template-columns:1fr}

    .tm-about-direction__content{
        padding-left:0;
        padding-top:25px;
        border-left:0;
        border-top:1px solid #d8d8d8;
    }

    .tm-about-union-card__top{
        border-right:0;
        border-bottom:1px solid #292929;
    }

    .tm-about-hero__media{
        max-width:720px;
        width:100%;
        margin:0 auto;
    }

    .tm-about-hero-photo{
        min-height:520px;
    }

    .tm-about-work-visual{
        max-width:680px;
        width:100%;
        margin:0 auto;
    }

    .tm-about-cta__inner{
        align-items:flex-start;
        flex-direction:column;
    }
}

@media(max-width:767.98px){
    .tm-about-page .section{padding:68px 0}
    .tm-about-hero{min-height:auto}
    .tm-about-hero__layout{padding:58px 0 64px;gap:34px}
    .tm-about-hero h1{font-size:clamp(2.55rem,11vw,3.8rem)}
    .tm-about-hero__lead{font-size:.98rem}
    .tm-about-hero-photo{min-height:420px;border-radius:21px}

    .tm-about-person__head,
    .tm-about-person__content{padding-left:22px;padding-right:22px}

    .tm-about-union-columns{grid-template-columns:1fr}

    .tm-about-work-visual{
        min-height:360px;
        padding:15px;
        gap:10px;
    }

    .tm-about-work-node{min-height:130px;font-size:.68rem}
    .tm-about-work-core{width:155px;height:155px}
    .tm-about-cta{padding-bottom:62px}
    .tm-about-cta__inner{padding:26px 22px}
}

@media(max-width:520px){
    .tm-about-highlight{align-items:flex-start;flex-direction:column;gap:8px}
    .tm-about-work-visual{min-height:330px}
    .tm-about-work-core{width:140px;height:140px;border-width:6px}
    .tm-about-work-core strong{font-size:1.45rem}
    .tm-about-future-manifesto span{font-size:.78rem}
    .tm-about-cta .btn{width:100%}
}

.tm-about-page a:focus-visible{
    outline:2px solid rgba(225,6,0,.92);
    outline-offset:3px;
}

@media(prefers-reduced-motion:reduce){
    .tm-about-page *,
    .tm-about-page *::before,
    .tm-about-page *::after{
        scroll-behavior:auto!important;
        transition-duration:.01ms!important;
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
    }
}