/* ============================================================
   TET 2025 — Design System
   Apple-inspired modern aesthetic for TR Eğitim ve Teknoloji
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Geist:wght@300;400;500;600;700;800;900&display=swap');

:root {
    /* === Brand === */
    --tet-navy: #1D3354;
    --tet-navy-dark: #142540;
    --tet-navy-light: #2A4A6B;
    --tet-teal: #3CB4B5;
    --tet-teal-dark: #2A8A8B;
    --tet-teal-light: #5FC9CA;

    /* === Neutrals === */
    --tet-white: #FFFFFF;
    --tet-bg: #FAFBFC;
    --tet-surface: #F4F6F8;
    --tet-surface-dark: #E8ECF0;
    --tet-border: #E5E8EC;
    --tet-border-strong: #CBD2DA;

    /* === Text === */
    --tet-text: #0F1729;
    --tet-text-muted: #5B6578;
    --tet-text-soft: #9CA3AF;
    --tet-text-inverse: #FFFFFF;

    /* === Effects === */
    --shadow-xs: 0 1px 2px rgba(15, 23, 41, 0.04);
    --shadow-sm: 0 2px 8px rgba(15, 23, 41, 0.04);
    --shadow-md: 0 4px 16px rgba(15, 23, 41, 0.06);
    --shadow-lg: 0 12px 32px rgba(15, 23, 41, 0.08);
    --shadow-xl: 0 24px 64px rgba(15, 23, 41, 0.12);
    --shadow-teal: 0 8px 24px rgba(60, 180, 181, 0.25);
    --shadow-navy: 0 8px 24px rgba(29, 51, 84, 0.25);

    /* === Radius === */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-2xl: 32px;
    --radius-pill: 9999px;

    /* === Transitions === */
    --transition-fast: 150ms cubic-bezier(0.16, 1, 0.3, 1);
    --transition-normal: 280ms cubic-bezier(0.16, 1, 0.3, 1);
    --transition-slow: 480ms cubic-bezier(0.16, 1, 0.3, 1);

    /* === Typography === */
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'SF Pro Display', sans-serif;
    --font-display: 'Geist', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* === GLOBAL BASE === */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    scroll-padding-top: 96px;
}

body.tet-2025 {
    font-family: var(--font-sans) !important;
    font-size: 16px;
    line-height: 1.6;
    color: var(--tet-text) !important;
    background: var(--tet-bg) !important;
    letter-spacing: -0.01em;
    margin: 0;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
}

body.tet-2025 a {
    color: inherit;
    text-decoration: none;
    transition: color var(--transition-fast);
}

body.tet-2025 img {
    max-width: 100%;
    display: block;
}

/* === TYPOGRAPHY === */

.tet-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--tet-teal);
    margin-bottom: 20px;
}

.tet-eyebrow::before {
    content: '';
    width: 24px;
    height: 1.5px;
    background: var(--tet-teal);
    display: inline-block;
}

.tet-h1 {
    font-size: clamp(40px, 6vw, 72px);
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -0.035em;
    color: var(--tet-text);
    margin: 0 0 24px;
}

.tet-h2 {
    font-size: clamp(32px, 4.5vw, 56px);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: var(--tet-text);
    margin: 0 0 24px;
}

.tet-h3 {
    font-size: clamp(24px, 2.5vw, 32px);
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -0.015em;
    color: var(--tet-text);
    margin: 0 0 16px;
}

.tet-h4 {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.01em;
    color: var(--tet-text);
    margin: 0 0 12px;
}

.tet-body {
    font-size: 16px;
    line-height: 1.65;
    color: var(--tet-text-muted);
    margin: 0 0 16px;
}

.tet-body-lg {
    font-size: clamp(17px, 1.5vw, 19px);
    line-height: 1.6;
    color: var(--tet-text-muted);
    margin: 0 0 16px;
}

.tet-gradient-text {
    background: linear-gradient(135deg, var(--tet-navy) 0%, var(--tet-teal) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

/* === LAYOUT === */

.tet-section {
    padding: clamp(72px, 10vw, 128px) 0;
    position: relative;
}

.tet-section--tight {
    padding: clamp(48px, 7vw, 80px) 0;
}

.tet-section--surface {
    background: var(--tet-surface);
}

.tet-section--dark {
    background: var(--tet-navy);
    color: var(--tet-text-inverse);
}

.tet-section--dark .tet-h2,
.tet-section--dark .tet-h3,
.tet-section--dark .tet-h4 {
    color: var(--tet-text-inverse);
}

.tet-section--dark .tet-body,
.tet-section--dark .tet-body-lg {
    color: rgba(255, 255, 255, 0.72);
}

.tet-container {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 24px;
}

.tet-container--narrow {
    max-width: 860px;
}

.tet-section__header {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 64px;
}

.tet-section__header--left {
    text-align: left;
    margin-left: 0;
}

/* === BUTTONS === */

.tet-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 28px;
    border-radius: var(--radius-pill);
    font-family: var(--font-sans);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.01em;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: all var(--transition-normal);
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    line-height: 1;
}

.tet-btn--primary {
    background: var(--tet-navy);
    color: var(--tet-text-inverse);
    box-shadow: var(--shadow-md);
}

.tet-btn--primary:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-navy);
    background: var(--tet-navy-dark);
    color: var(--tet-text-inverse);
}

.tet-btn--teal {
    background: var(--tet-teal);
    color: var(--tet-text-inverse);
    box-shadow: var(--shadow-teal);
}

.tet-btn--teal:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 36px rgba(60, 180, 181, 0.4);
    background: var(--tet-teal-dark);
    color: var(--tet-text-inverse);
}

.tet-btn--ghost {
    background: transparent;
    color: var(--tet-text);
    border: 1.5px solid var(--tet-border-strong);
}

.tet-btn--ghost:hover {
    background: var(--tet-text);
    color: var(--tet-text-inverse);
    border-color: var(--tet-text);
    transform: translateY(-2px);
}

.tet-btn--white {
    background: var(--tet-white);
    color: var(--tet-navy);
    box-shadow: var(--shadow-md);
}

.tet-btn--white:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
    color: var(--tet-navy);
}

.tet-btn__arrow {
    transition: transform var(--transition-normal);
    display: inline-block;
}

.tet-btn:hover .tet-btn__arrow {
    transform: translateX(4px);
}

.tet-btn--lg {
    padding: 18px 36px;
    font-size: 16px;
}

/* === CARDS === */

.tet-card {
    background: var(--tet-white);
    border-radius: var(--radius-xl);
    padding: 36px;
    box-shadow: var(--shadow-sm);
    transition: all var(--transition-normal);
    border: 1px solid var(--tet-border);
    position: relative;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.tet-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-xl);
    border-color: transparent;
}

.tet-card--accent {
    background: linear-gradient(135deg, var(--tet-navy) 0%, var(--tet-navy-light) 100%);
    color: var(--tet-text-inverse);
    border: none;
}

.tet-card--accent .tet-card__title,
.tet-card--accent .tet-card__desc {
    color: var(--tet-text-inverse);
}

.tet-card--accent .tet-card__desc {
    color: rgba(255, 255, 255, 0.75);
}

.tet-card--featured {
    background: linear-gradient(180deg, var(--tet-white) 0%, var(--tet-surface) 100%);
    border: 2px solid var(--tet-teal);
}

.tet-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, var(--tet-teal) 0%, var(--tet-teal-dark) 100%);
    margin-bottom: 28px;
    box-shadow: 0 8px 20px rgba(60, 180, 181, 0.25);
}

.tet-card__icon img {
    width: 28px;
    height: 28px;
    filter: brightness(0) invert(1);
}

.tet-card__icon--navy {
    background: linear-gradient(135deg, var(--tet-navy) 0%, var(--tet-navy-light) 100%);
    box-shadow: 0 8px 20px rgba(29, 51, 84, 0.25);
}

.tet-card__title {
    font-size: 22px;
    font-weight: 600;
    letter-spacing: -0.015em;
    color: var(--tet-text);
    margin: 0 0 12px;
    line-height: 1.3;
}

.tet-card__desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--tet-text-muted);
    margin: 0 0 24px;
    flex-grow: 1;
}

.tet-card__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--tet-teal);
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
    transition: gap var(--transition-normal);
    margin-top: auto;
}

.tet-card__link:hover {
    gap: 10px;
    color: var(--tet-teal-dark);
}

.tet-card__image {
    margin: -36px -36px 28px;
    height: 200px;
    overflow: hidden;
    position: relative;
}

.tet-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-slow);
}

.tet-card:hover .tet-card__image img {
    transform: scale(1.05);
}

/* === GRIDS === */

.tet-grid {
    display: grid;
    gap: 24px;
}

.tet-grid--2 {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.tet-grid--3 {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.tet-grid--4 {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

/* === HEADER (refined, modern, Linear/Stripe-inspired) === */

.tet-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background: rgba(251, 251, 253, 0.5);
    backdrop-filter: saturate(180%) blur(28px);
    -webkit-backdrop-filter: saturate(180%) blur(28px);
    border-bottom: 1px solid transparent;
    transition: padding 320ms cubic-bezier(0.16, 1, 0.3, 1),
                background 240ms ease-out,
                border-color 240ms ease-out,
                box-shadow 240ms ease-out;
    padding: 4px 0;
}

.tet-header.scrolled {
    background: rgba(251, 251, 253, 0.75);
    border-bottom-color: rgba(0, 0, 0, 0.05);
    padding: 0;
}

.tet-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 24px;
    max-width: 1280px;
    margin: 0 auto;
    gap: 24px;
    transition: padding 320ms cubic-bezier(0.16, 1, 0.3, 1);
}

.tet-header.scrolled .tet-header__inner {
    padding-top: 10px;
    padding-bottom: 10px;
}

.tet-header__logo {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    transition: transform 320ms cubic-bezier(0.16, 1, 0.3, 1);
}

.tet-header__logo img {
    height: 38px;
    width: auto;
    transition: height 320ms cubic-bezier(0.16, 1, 0.3, 1);
}

.tet-header.scrolled .tet-header__logo img {
    height: 32px;
}

.tet-header__nav {
    display: flex;
    align-items: center;
    gap: 2px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.tet-header__nav li {
    position: relative;
}

.tet-header__nav > li > a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--apple-text);
    font-weight: 500;
    font-size: 14px;
    letter-spacing: -0.01em;
    padding: 8px 14px;
    border-radius: 980px;
    text-decoration: none;
    position: relative;
    transition: color 200ms ease-out;
}

/* Animated pill background that slides in on hover */
.tet-header__nav > li > a::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.05);
    border-radius: 980px;
    opacity: 0;
    transform: scale(0.92);
    transition: opacity 200ms ease-out, transform 200ms cubic-bezier(0.16, 1, 0.3, 1);
    pointer-events: none;
    z-index: -1;
}

.tet-header__nav > li > a:hover::before,
.tet-header__nav > li.is-active > a::before {
    opacity: 1;
    transform: scale(1);
}

.tet-header__nav > li > a:hover,
.tet-header__nav > li.is-active > a {
    color: var(--apple-text);
}

/* Caret arrow for dropdown items */
.tet-header__nav > li.has-children > a::after {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translate(-1px, -2px);
    margin-left: 2px;
    opacity: 0.5;
    transition: transform 240ms cubic-bezier(0.16, 1, 0.3, 1), opacity 200ms;
}

.tet-header__nav > li.has-children:hover > a::after {
    transform: rotate(225deg) translate(2px, 1px);
    opacity: 1;
}

/* Dropdown card */
.tet-header__nav li ul {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(-4px);
    margin-top: 8px;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: saturate(180%) blur(24px);
    -webkit-backdrop-filter: saturate(180%) blur(24px);
    border-radius: 16px;
    padding: 6px;
    list-style: none;
    box-shadow:
        0 0 0 1px rgba(0, 0, 0, 0.05),
        0 12px 32px rgba(0, 0, 0, 0.08),
        0 4px 12px rgba(0, 0, 0, 0.04);
    min-width: 240px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 200ms ease-out, transform 240ms cubic-bezier(0.16, 1, 0.3, 1), visibility 0s 200ms;
}

.tet-header__nav li:hover > ul {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
    transition: opacity 200ms ease-out, transform 240ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* Dropdown arrow */
.tet-header__nav li ul::before {
    content: '';
    position: absolute;
    top: -5px;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    width: 10px;
    height: 10px;
    background: rgba(255, 255, 255, 0.96);
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    border-left: 1px solid rgba(0, 0, 0, 0.05);
    border-top-left-radius: 2px;
}

.tet-header__nav li ul li {
    margin: 0;
}

.tet-header__nav li ul li a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    font-size: 14px;
    font-weight: 500;
    color: var(--apple-text);
    border-radius: 10px;
    text-decoration: none;
    transition: background 160ms ease-out, color 160ms;
    position: relative;
}

.tet-header__nav li ul li a::after {
    display: none;
}

.tet-header__nav li ul li a:hover {
    background: var(--apple-surface);
    color: var(--apple-accent);
}

/* CTA button — refined Apple style */
.tet-header__actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.tet-header__cta {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 8px 16px !important;
    font-size: 13px !important;
    font-weight: 500;
    border-radius: 980px !important;
    background: var(--apple-text) !important;
    color: #fff !important;
    text-decoration: none;
    transition: opacity 200ms !important;
    box-shadow: none !important;
}

.tet-header__cta:hover {
    background: #000 !important;
    color: #fff !important;
    transform: none !important;
    opacity: 0.92;
}

.tet-header__cta .tet-btn__arrow {
    margin-left: 2px;
    font-size: 1em;
}

/* Mobile toggle */
.tet-header__toggle {
    display: none;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: transparent;
    border: none;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    transition: background 200ms;
}

.tet-header__toggle:hover {
    background: rgba(0, 0, 0, 0.05);
}

.tet-header__toggle span {
    display: block;
    width: 18px;
    height: 1.5px;
    background: var(--apple-text);
    position: relative;
    transition: all var(--transition-normal);
}

.tet-header__toggle span::before,
.tet-header__toggle span::after {
    content: '';
    position: absolute;
    left: 0;
    width: 18px;
    height: 1.5px;
    background: var(--apple-text);
    transition: all var(--transition-normal);
}

.tet-header__toggle span::before { top: -6px; }
.tet-header__toggle span::after { bottom: -6px; }

/* === PAGE HEADER (for inner pages) === */

.tet-page-header {
    padding: 160px 0 64px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.tet-page-header__bg {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
            radial-gradient(circle at 30% 30%, rgba(60, 180, 181, 0.08) 0%, transparent 50%),
            radial-gradient(circle at 70% 70%, rgba(29, 51, 84, 0.06) 0%, transparent 50%);
}

.tet-page-header__title {
    font-size: clamp(40px, 5.5vw, 68px);
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -0.03em;
    margin: 0 0 20px;
    color: var(--tet-text);
}

.tet-page-header__desc {
    font-size: clamp(17px, 1.5vw, 19px);
    line-height: 1.6;
    color: var(--tet-text-muted);
    max-width: 640px;
    margin: 0 auto;
}

/* === BREADCRUMB === */

.tet-breadcrumb {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--tet-text-muted);
    margin-bottom: 24px;
}

.tet-breadcrumb a {
    color: var(--tet-text-muted);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.tet-breadcrumb a:hover {
    color: var(--tet-teal);
}

.tet-breadcrumb__sep {
    color: var(--tet-text-soft);
    font-size: 11px;
}

/* === PROSE (rendered HTML content from WYSIWYG) === */

.tet-prose {
    color: var(--tet-text-muted);
    font-size: 17px;
    line-height: 1.75;
    max-width: 760px;
    margin: 0 auto;
}

.tet-prose--wide {
    max-width: 100%;
}

.tet-prose p {
    margin: 0 0 22px;
}

.tet-prose p:last-child {
    margin-bottom: 0;
}

.tet-prose strong,
.tet-prose b {
    color: var(--tet-text);
    font-weight: 600;
}

.tet-prose a {
    color: var(--tet-teal);
    border-bottom: 1px solid rgba(60, 180, 181, 0.3);
    transition: all var(--transition-fast);
}

.tet-prose a:hover {
    color: var(--tet-teal-dark);
    border-bottom-color: var(--tet-teal);
}

.tet-prose ul,
.tet-prose ol {
    margin: 0 0 24px;
    padding-left: 24px;
}

.tet-prose li {
    margin-bottom: 8px;
}

.tet-prose h1,
.tet-prose h2,
.tet-prose h3,
.tet-prose h4 {
    margin: 36px 0 16px;
    color: var(--tet-text);
    font-weight: 600;
    letter-spacing: -0.015em;
}

.tet-prose h2 {
    font-size: 28px;
}

.tet-prose h3 {
    font-size: 22px;
}

.tet-prose blockquote {
    border-left: 3px solid var(--tet-teal);
    padding: 8px 0 8px 24px;
    margin: 28px 0;
    font-style: italic;
    color: var(--tet-text);
}

.tet-prose img {
    border-radius: var(--radius-lg);
    margin: 24px 0;
}

.tet-prose table {
    width: 100%;
    border-collapse: collapse;
    margin: 24px 0;
    font-size: 15px;
}

.tet-prose th,
.tet-prose td {
    padding: 12px 16px;
    border-bottom: 1px solid var(--tet-border);
    text-align: left;
}

.tet-prose th {
    font-weight: 600;
    color: var(--tet-text);
    background: var(--tet-surface);
}

/* === FEATURE BLOCK (alternating image/text) === */

.tet-feature {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}

.tet-feature--reverse .tet-feature__media {
    order: 2;
}

.tet-feature__media {
    border-radius: var(--radius-xl);
    overflow: hidden;
    aspect-ratio: 4/3;
    background: var(--tet-surface);
    box-shadow: var(--shadow-lg);
}

.tet-feature__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tet-feature__content .tet-eyebrow {
    margin-bottom: 16px;
}

@media (max-width: 768px) {
    .tet-feature {
        grid-template-columns: 1fr;
        gap: 32px;
    }
    .tet-feature--reverse .tet-feature__media {
        order: 0;
    }
    .tet-page-header {
        padding: 120px 0 48px;
    }
}

/* === HERO === */

.tet-hero {
    padding: 180px 0 96px;
    position: relative;
    overflow: hidden;
}

.tet-hero__bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    background:
            radial-gradient(circle at 15% 25%, rgba(60, 180, 181, 0.12) 0%, transparent 40%),
            radial-gradient(circle at 85% 75%, rgba(29, 51, 84, 0.10) 0%, transparent 40%),
            radial-gradient(circle at 50% 50%, rgba(60, 180, 181, 0.04) 0%, transparent 60%);
}

.tet-hero__bg::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image:
            radial-gradient(circle, rgba(29, 51, 84, 0.05) 1px, transparent 1px);
    background-size: 32px 32px;
    opacity: 0.4;
    mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%);
    -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%);
}

.tet-hero__content {
    max-width: 880px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 1;
}

.tet-hero__title {
    font-size: clamp(40px, 7.5vw, 84px);
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -0.04em;
    color: var(--tet-text);
    margin: 0 0 28px;
}

.tet-hero__desc {
    font-size: clamp(17px, 1.8vw, 21px);
    line-height: 1.6;
    color: var(--tet-text-muted);
    margin: 0 auto 40px;
    max-width: 640px;
}

.tet-hero__actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 64px;
}

.tet-hero__media {
    margin-top: 48px;
    border-radius: var(--radius-2xl);
    overflow: hidden;
    box-shadow: var(--shadow-xl);
    background: var(--tet-white);
    border: 1px solid var(--tet-border);
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

.tet-hero__media img {
    width: 100%;
    height: auto;
    display: block;
}

/* === VIDEO SECTION === */

.tet-video {
    border-radius: var(--radius-2xl);
    overflow: hidden;
    box-shadow: var(--shadow-xl);
    background: var(--tet-navy);
    aspect-ratio: 16/9;
    position: relative;
    max-width: 960px;
    margin: 0 auto;
    border: 1px solid var(--tet-border);
}

.tet-video iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}

/* === NEWS / ANNOUNCEMENTS === */

.tet-news-card {
    background: var(--tet-white);
    border-radius: var(--radius-xl);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all var(--transition-normal);
    border: 1px solid var(--tet-border);
    height: 100%;
    display: flex;
    flex-direction: column;
}

.tet-news-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-xl);
    border-color: transparent;
}

.tet-news-card__image {
    position: relative;
    aspect-ratio: 16/10;
    overflow: hidden;
    background: var(--tet-surface);
}

.tet-news-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-slow);
}

.tet-news-card:hover .tet-news-card__image img {
    transform: scale(1.06);
}

.tet-news-card__body {
    padding: 24px 28px 28px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.tet-news-card__title {
    font-size: 17px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: -0.015em;
    color: var(--tet-text);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tet-news-card__title a {
    color: inherit;
    text-decoration: none;
}

.tet-news-card__title a:hover {
    color: var(--tet-teal);
}

/* === VALUE CARDS === */

.tet-value-card {
    background: var(--tet-white);
    border-radius: var(--radius-xl);
    padding: 32px 28px;
    text-align: center;
    box-shadow: var(--shadow-sm);
    transition: all var(--transition-normal);
    border: 1px solid var(--tet-border);
    cursor: pointer;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.tet-value-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-xl);
    border-color: var(--tet-teal);
}

.tet-value-card__icon {
    width: 72px;
    height: 72px;
    border-radius: var(--radius-lg);
    background: var(--tet-surface);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    transition: all var(--transition-normal);
}

.tet-value-card:hover .tet-value-card__icon {
    background: linear-gradient(135deg, var(--tet-teal) 0%, var(--tet-teal-dark) 100%);
    transform: scale(1.05);
}

.tet-value-card__icon img {
    width: 36px;
    height: 36px;
    transition: filter var(--transition-normal);
}

.tet-value-card:hover .tet-value-card__icon img {
    filter: brightness(0) invert(1);
}

.tet-value-card__title {
    font-size: 17px;
    font-weight: 600;
    color: var(--tet-text);
    margin: 0;
    letter-spacing: -0.01em;
}

/* === PILL CARDS (for education category lists) === */

.tet-pill-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 20px 24px;
    background: var(--tet-white);
    border-radius: var(--radius-lg);
    border: 1px solid var(--tet-border);
    box-shadow: var(--shadow-sm);
    text-decoration: none;
    color: var(--tet-text);
    transition: all var(--transition-normal);
    min-height: 88px;
}

.tet-pill-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
    border-color: var(--tet-teal);
    color: var(--tet-text);
    text-decoration: none;
}

.tet-pill-card__title {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--tet-text);
    flex-grow: 1;
    letter-spacing: -0.01em;
}

.tet-pill-card__meta {
    display: inline-block;
    padding: 4px 10px;
    background: var(--tet-surface);
    border-radius: var(--radius-pill);
    font-size: 11px;
    font-weight: 600;
    color: var(--tet-text-muted);
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.tet-pill-card__arrow {
    color: var(--tet-teal);
    font-size: 18px;
    transition: transform var(--transition-normal);
    flex-shrink: 0;
}

.tet-pill-card:hover .tet-pill-card__arrow {
    transform: translateX(4px);
}

/* === TABLES === */

.tet-table-wrap {
    background: var(--tet-white);
    border-radius: var(--radius-xl);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    border: 1px solid var(--tet-border);
    overflow-x: auto;
}

.tet-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px;
}

.tet-table thead th {
    background: var(--tet-surface);
    color: var(--tet-text);
    font-weight: 600;
    text-align: left;
    padding: 18px 24px;
    font-size: 13px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--tet-border);
}

.tet-table tbody td {
    padding: 18px 24px;
    border-bottom: 1px solid var(--tet-border);
    color: var(--tet-text-muted);
    vertical-align: middle;
}

.tet-table tbody tr:last-child td {
    border-bottom: none;
}

.tet-table tbody tr:hover {
    background: var(--tet-surface);
}

.tet-table tbody td strong {
    color: var(--tet-text);
    font-weight: 600;
}

.tet-table__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--tet-teal);
    font-weight: 600;
    text-decoration: none;
    transition: gap var(--transition-fast);
}

.tet-table__link:hover {
    gap: 10px;
    color: var(--tet-teal-dark);
}

.tet-chip {
    display: inline-block;
    padding: 4px 12px;
    background: var(--tet-surface);
    border-radius: var(--radius-pill);
    font-size: 12px;
    font-weight: 600;
    color: var(--tet-text-muted);
    letter-spacing: 0.02em;
}

/* === NEWS CARD ENHANCEMENTS === */

.tet-news-card__date {
    position: absolute;
    top: 16px;
    left: 16px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    padding: 8px 14px;
    border-radius: var(--radius-md);
    text-align: center;
    box-shadow: var(--shadow-sm);
    line-height: 1;
}

.tet-news-card__date strong {
    display: block;
    font-size: 20px;
    font-weight: 700;
    color: var(--tet-navy);
    margin-bottom: 2px;
}

.tet-news-card__date span {
    display: block;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--tet-text-muted);
    letter-spacing: 0.05em;
}

.tet-news-card__excerpt {
    font-size: 14px;
    line-height: 1.6;
    color: var(--tet-text-muted);
    margin: 12px 0 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* === PAGINATION === */

.tet-pagination {
    display: flex;
    justify-content: center;
    margin-top: 56px;
}

.tet-pagination .pagination {
    display: inline-flex;
    gap: 4px;
    list-style: none;
    padding: 6px;
    background: var(--tet-white);
    border-radius: var(--radius-pill);
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--tet-border);
    margin: 0;
}

.tet-pagination .page-item .page-link,
.tet-pagination .pagination li a,
.tet-pagination .pagination li span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border-radius: var(--radius-pill);
    color: var(--tet-text-muted);
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
    border: none !important;
    background: transparent !important;
    transition: all var(--transition-fast);
}

.tet-pagination .page-item .page-link:hover,
.tet-pagination .pagination li a:hover {
    background: var(--tet-surface) !important;
    color: var(--tet-text);
}

.tet-pagination .page-item.active .page-link,
.tet-pagination .pagination li.active span {
    background: var(--tet-navy) !important;
    color: var(--tet-text-inverse) !important;
}

/* === FILTER BAR (for gallery/portfolio filters) === */

.tet-filter-wrap {
    display: flex;
    justify-content: center;
    margin-bottom: 48px;
}

.tet-filter {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px;
    list-style: none;
    margin: 0;
    padding: 6px;
    background: var(--tet-white);
    border-radius: var(--radius-pill);
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--tet-border);
}

.tet-filter li {
    margin: 0;
}

.tet-filter a {
    display: inline-block;
    padding: 10px 20px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--tet-text-muted);
    text-decoration: none;
    border-radius: var(--radius-pill);
    transition: all var(--transition-fast);
    white-space: nowrap;
}

.tet-filter a:hover {
    color: var(--tet-text);
    background: var(--tet-surface);
}

.tet-filter a.selected,
.tet-filter a.active {
    background: var(--tet-navy);
    color: var(--tet-text-inverse);
}

/* === GALLERY === */

.tet-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}

.tet-gallery__card {
    background: var(--tet-white);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--tet-border);
    transition: all var(--transition-normal);
    height: 100%;
    display: flex;
    flex-direction: column;
}

.tet-gallery__card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
    border-color: transparent;
}

.tet-gallery__media {
    position: relative;
    aspect-ratio: 4/3;
    overflow: hidden;
    background: var(--tet-surface);
}

.tet-gallery__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-slow);
}

.tet-gallery__card:hover .tet-gallery__media img {
    transform: scale(1.06);
}

.tet-gallery__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 56px;
    height: 56px;
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    color: var(--tet-navy);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all var(--transition-normal);
    box-shadow: var(--shadow-md);
    z-index: 2;
}

.tet-gallery__card:hover .tet-gallery__play {
    background: var(--tet-teal);
    color: var(--tet-text-inverse);
    transform: translate(-50%, -50%) scale(1.1);
}

.tet-gallery__caption {
    padding: 16px 20px 20px;
}

.tet-gallery__caption h4 {
    font-size: 15px;
    font-weight: 600;
    color: var(--tet-text);
    margin: 0;
    letter-spacing: -0.01em;
}

/* === MYH (Milli Yetkinlik Hamlesi) FEATURED CARD === */

.tet-myh-card {
    display: block;
    background: linear-gradient(135deg, #1D3354 0%, #2A4A6B 50%, #1D3354 100%);
    border-radius: var(--radius-2xl);
    overflow: hidden;
    box-shadow: var(--shadow-xl);
    position: relative;
    transition: all var(--transition-normal);
}

.tet-myh-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 32px 80px rgba(15, 23, 41, 0.18);
}

.tet-myh-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
            radial-gradient(circle, rgba(255,255,255,0.06) 1px, transparent 1px);
    background-size: 24px 24px;
    opacity: 0.5;
    pointer-events: none;
}

.tet-myh-card__inner {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 48px;
    align-items: center;
    padding: clamp(40px, 6vw, 72px);
    position: relative;
}

.tet-myh-card__content {
    color: var(--tet-text-inverse);
    position: relative;
    z-index: 1;
}

.tet-myh-card__title {
    font-size: clamp(32px, 4vw, 52px);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.025em;
    margin: 0 0 20px;
    color: var(--tet-text-inverse);
}

.tet-myh-card__desc {
    font-size: 17px;
    line-height: 1.65;
    color: rgba(255, 255, 255, 0.75);
    margin: 0 0 32px;
    max-width: 540px;
}

.tet-myh-card__desc strong {
    color: var(--tet-text-inverse);
    font-weight: 600;
}

.tet-myh-card__visual {
    position: relative;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tet-myh-card__visual svg {
    width: 100%;
    max-width: 320px;
    height: auto;
    position: relative;
    z-index: 1;
    animation: tet-myh-spin 60s linear infinite;
}

.tet-myh-card__glow {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle, rgba(60, 180, 181, 0.3) 0%, transparent 60%);
    filter: blur(40px);
}

@keyframes tet-myh-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@media (max-width: 768px) {
    .tet-myh-card__inner {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .tet-myh-card__visual {
        max-width: 200px;
        margin: 0 auto;
    }
}

/* === CTA BLOCK === */

.tet-cta {
    background: linear-gradient(135deg, var(--tet-navy) 0%, var(--tet-navy-light) 100%);
    border-radius: var(--radius-2xl);
    padding: clamp(48px, 8vw, 96px) clamp(24px, 5vw, 64px);
    text-align: center;
    color: var(--tet-text-inverse);
    position: relative;
    overflow: hidden;
    box-shadow: var(--shadow-xl);
}

.tet-cta::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(60, 180, 181, 0.25) 0%, transparent 70%);
    pointer-events: none;
}

.tet-cta::after {
    content: '';
    position: absolute;
    bottom: -50%;
    left: -20%;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(60, 180, 181, 0.15) 0%, transparent 70%);
    pointer-events: none;
}

.tet-cta > * {
    position: relative;
    z-index: 1;
}

.tet-cta__title {
    font-size: clamp(28px, 4vw, 48px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.025em;
    margin: 0 0 16px;
    color: var(--tet-text-inverse);
}

.tet-cta__desc {
    font-size: clamp(16px, 1.5vw, 18px);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.78);
    max-width: 580px;
    margin: 0 auto 32px;
}

/* === FOOTER === */

.tet-footer {
    background: var(--tet-navy);
    color: rgba(255, 255, 255, 0.65);
    padding: 80px 0 32px;
    position: relative;
}

.tet-footer__grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 64px;
    margin-bottom: 64px;
}

.tet-footer__brand .tet-footer__logo {
    margin-bottom: 24px;
}

.tet-footer__brand .tet-footer__logo img {
    height: 56px;
    filter: brightness(0) invert(1);
}

.tet-footer__brand p {
    color: rgba(255, 255, 255, 0.65);
    font-size: 14px;
    line-height: 1.6;
    margin: 0 0 24px;
    max-width: 320px;
}

.tet-footer h4 {
    color: var(--tet-text-inverse);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin: 0 0 24px;
}

.tet-footer ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.tet-footer ul li {
    margin-bottom: 12px;
}

.tet-footer ul a,
.tet-footer ul li a {
    color: rgba(255, 255, 255, 0.65) !important;
    text-decoration: none !important;
    font-size: 14px;
    transition: color var(--transition-fast);
}

.tet-footer ul a:hover,
.tet-footer ul li a:hover {
    color: var(--tet-teal-light) !important;
}

.tet-footer__bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 32px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.5);
    flex-wrap: wrap;
    gap: 16px;
}

.tet-footer__social {
    display: flex;
    gap: 8px;
}

.tet-footer__social a {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.08);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.8) !important;
    transition: all var(--transition-fast);
    font-size: 15px;
}

.tet-footer__social a:hover {
    background: var(--tet-teal);
    color: var(--tet-text-inverse) !important;
    transform: translateY(-2px);
}

/* === ANIMATIONS === */

@keyframes tet-fade-up {
    from {
        opacity: 0;
        transform: translateY(24px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes tet-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

.tet-fade-up {
    animation: tet-fade-up 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.tet-fade-up--delay-1 { animation-delay: 80ms; }
.tet-fade-up--delay-2 { animation-delay: 160ms; }
.tet-fade-up--delay-3 { animation-delay: 240ms; }
.tet-fade-up--delay-4 { animation-delay: 320ms; }
.tet-fade-up--delay-5 { animation-delay: 400ms; }

/* On-scroll reveal */
.tet-reveal {
    opacity: 0;
    transform: translateY(32px);
    transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.tet-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* === RESPONSIVE === */

@media (max-width: 1024px) {
    .tet-footer__grid {
        grid-template-columns: 1fr 1fr;
        gap: 48px;
    }
}

@media (max-width: 768px) {
    .tet-header__inner {
        padding: 12px 20px;
        gap: 12px;
    }

    .tet-header__logo img {
        height: 36px;
    }

    .tet-header__nav-wrapper {
        display: none;
    }

    .tet-header__toggle {
        display: inline-flex;
    }

    .tet-hero {
        padding: 96px 0 56px;
    }

    .tet-hero__title {
        font-size: clamp(34px, 9vw, 48px);
    }

    .tet-hero__actions {
        flex-direction: column;
        align-items: stretch;
        margin-bottom: 40px;
    }

    .tet-hero__actions .tet-btn {
        width: 100%;
        justify-content: center;
    }

    .tet-section {
        padding: 56px 0;
    }

    .tet-section__header {
        margin-bottom: 40px;
    }

    .tet-card {
        padding: 28px;
    }

    .tet-cta {
        padding: 56px 24px;
    }

    .tet-cta__title {
        font-size: 28px;
    }

    .tet-footer {
        padding: 56px 0 24px;
    }

    .tet-footer__grid {
        grid-template-columns: 1fr;
        gap: 36px;
        margin-bottom: 36px;
    }

    .tet-footer__bottom {
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
    }
}

/* === HEADER/FOOTER VISIBILITY SWITCH ===
   New header/footer shows on tet-2025 pages, old shows on legacy pages.
   This prevents double headers/footers during incremental migration. */

body.tet-2025 .xs-header,
body.tet-2025 footer.xs-footer-section {
    display: none !important;
}

body.tet-2025 .banner-overlay-bg {
    display: none;
}

body:not(.tet-2025) .tet-header,
body:not(.tet-2025) .tet-footer {
    display: none !important;
}

/* ============================================================
   MOBILE NAV DRAWER — proper slide-in panel with backdrop
   ============================================================ */

@media (max-width: 768px) {
    /* hide desktop CTA on mobile */
    .tet-header__cta {
        display: none;
    }

    /* Backdrop overlay — appears when nav is open */
    body.tet-nav-open::before {
        content: '';
        position: fixed;
        inset: 0;
        background: rgba(15, 23, 41, 0.55);
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
        z-index: 998;
        opacity: 1;
        animation: tetNavBackdropIn 280ms ease-out;
    }

    /* Lock body scroll */
    body.tet-nav-open {
        overflow: hidden;
    }

    /* Drawer container — slide-in from right */
    .tet-header__nav-wrapper {
        position: fixed !important;
        top: 0;
        right: 0;
        bottom: 0;
        width: min(86vw, 360px);
        height: 100vh;
        background: #fff;
        z-index: 1000;
        padding: 88px 24px 32px;
        overflow-y: auto;
        overscroll-behavior: contain;
        transform: translateX(100%);
        transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
        box-shadow: -24px 0 60px rgba(15, 23, 41, 0.18);
        display: block !important;
        visibility: hidden;
    }

    .tet-header__nav-wrapper.is-open,
    body.tet-nav-open .tet-header__nav-wrapper {
        transform: translateX(0);
        visibility: visible;
    }

    /* Top toolbar inside drawer with close indicator */
    .tet-header__nav-wrapper::before {
        content: 'Menü';
        position: absolute;
        top: 28px;
        left: 24px;
        font-size: 11px;
        font-weight: 500;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        color: var(--apple-text-muted);
    }

    .tet-header__nav-wrapper::after {
        content: '';
        position: absolute;
        top: 72px;
        left: 24px;
        right: 24px;
        height: 1px;
        background: var(--apple-border);
    }

    /* Menu list — full column */
    .tet-header__nav-wrapper .tet-header__nav {
        display: flex !important;
        flex-direction: column;
        align-items: stretch;
        gap: 2px;
        padding: 0;
        margin: 0;
        list-style: none;
        width: 100%;
    }

    .tet-header__nav-wrapper .tet-header__nav > li {
        position: relative;
        width: 100%;
    }

    .tet-header__nav-wrapper .tet-header__nav > li > a {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding: 16px 16px;
        font-size: 17px;
        font-weight: 500;
        color: var(--apple-text);
        text-decoration: none;
        border-radius: 12px;
        letter-spacing: -0.01em;
        transition: background 200ms, color 200ms;
        line-height: 1.3;
    }

    .tet-header__nav-wrapper .tet-header__nav > li > a:hover,
    .tet-header__nav-wrapper .tet-header__nav > li > a:active {
        background: var(--apple-surface);
        color: var(--apple-text);
    }

    .tet-header__nav-wrapper .tet-header__nav > li > a::before {
        display: none;
    }

    .tet-header__nav-wrapper .tet-header__nav > li.has-children > a::after {
        margin-left: auto;
        transform: rotate(45deg);
        opacity: 0.4;
    }

    /* Submenu — rendered inline below parent */
    .tet-header__nav-wrapper .tet-header__nav li ul {
        position: static !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        background: var(--apple-surface) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        border: none !important;
        box-shadow: none !important;
        border-radius: 12px;
        padding: 4px;
        margin: 4px 0 8px;
        min-width: 0;
        list-style: none;
    }

    .tet-header__nav-wrapper .tet-header__nav li ul::before {
        display: none;
    }

    .tet-header__nav-wrapper .tet-header__nav li ul li a {
        padding: 12px 16px;
        font-size: 14.5px;
        color: var(--apple-text-muted);
        border-radius: 8px;
        display: block;
        text-decoration: none;
        transition: background 200ms, color 200ms;
    }

    .tet-header__nav-wrapper .tet-header__nav li ul li a:hover {
        background: #fff;
        color: var(--apple-text);
    }

    .tet-header__nav-wrapper .tet-header__nav li ul li a::after {
        display: none;
    }
}

@keyframes tetNavBackdropIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Hamburger button — animate to X when open */
.tet-header__toggle.is-active span {
    background: transparent;
}

.tet-header__toggle.is-active span::before {
    top: 0;
    transform: rotate(45deg);
}

.tet-header__toggle.is-active span::after {
    bottom: 0;
    transform: rotate(-45deg);
}

/* Toggle always above drawer for closing */
.tet-header__toggle {
    position: relative;
    z-index: 1001;
}

/* Voyager menu footer rendering — outputs <li><a> directly without <ul> */
.tet-footer ul {
    list-style: none;
    padding: 0;
}

/* ============================================================
   TET 2025 — PRO LAYER
   Editorial / Futuristic components for premium pages
   ============================================================ */

/* === GLOBAL MOUSE GLOW === */

.tet-mouse-glow {
    position: fixed;
    pointer-events: none;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(60, 180, 181, 0.18) 0%, transparent 70%);
    filter: blur(40px);
    transform: translate(-50%, -50%);
    z-index: 1;
    transition: opacity 600ms;
    opacity: 0;
    will-change: transform;
    mix-blend-mode: screen;
}

body.tet-mouse-ready .tet-mouse-glow {
    opacity: 1;
}

/* === PRO HERO === */

.tet-pro-hero {
    position: relative;
    min-height: 100vh;
    padding: 120px 0 80px;
    overflow: hidden;
    background: var(--tet-bg);
    display: flex;
    flex-direction: column;
}

.tet-pro-hero__grid {
    position: absolute;
    inset: 0;
    background-image:
            linear-gradient(rgba(15, 23, 41, 0.04) 1px, transparent 1px),
            linear-gradient(90deg, rgba(15, 23, 41, 0.04) 1px, transparent 1px);
    background-size: 64px 64px;
    mask-image: radial-gradient(ellipse 80% 60% at 50% 40%, black 30%, transparent 80%);
    -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 40%, black 30%, transparent 80%);
    pointer-events: none;
}

.tet-pro-hero__aurora {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
            radial-gradient(circle 600px at 10% 20%, rgba(60, 180, 181, 0.12) 0%, transparent 60%),
            radial-gradient(circle 500px at 90% 70%, rgba(29, 51, 84, 0.10) 0%, transparent 60%),
            radial-gradient(circle 400px at 60% 30%, rgba(95, 201, 202, 0.08) 0%, transparent 60%);
    animation: tet-aurora 18s ease-in-out infinite alternate;
}

@keyframes tet-aurora {
    0%   { transform: translate(0,0) scale(1); }
    50%  { transform: translate(-2%, 1%) scale(1.05); }
    100% { transform: translate(2%, -1%) scale(0.98); }
}

.tet-pro-hero__topbar {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 clamp(48px, 8vh, 96px);
    padding: 0 24px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--tet-text-muted);
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.tet-pro-hero__topbar > * {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.tet-pro-hero__topbar .dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--tet-teal);
    box-shadow: 0 0 10px var(--tet-teal);
    animation: tet-pulse 2s ease-in-out infinite;
}

@keyframes tet-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(1.3); }
}

.tet-pro-hero__body {
    position: relative;
    z-index: 2;
    flex: 1;
    display: flex;
    align-items: center;
    padding: 0 24px;
    max-width: 1320px;
    margin: 0 auto;
    width: 100%;
}

.tet-pro-hero__index {
    position: absolute;
    top: -40px;
    right: 24px;
    font-size: clamp(120px, 22vw, 320px);
    font-weight: 900;
    line-height: 0.8;
    letter-spacing: -0.06em;
    color: transparent;
    -webkit-text-stroke: 1.5px rgba(29, 51, 84, 0.08);
    user-select: none;
    pointer-events: none;
    z-index: 0;
}

.tet-pro-hero__content {
    position: relative;
    z-index: 1;
    max-width: 1100px;
}

.tet-pro-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 8px 16px;
    border: 1px solid var(--tet-border-strong);
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--tet-text);
    margin-bottom: 32px;
}

.tet-pro-hero__eyebrow .dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--tet-teal);
}

.tet-pro-hero__title {
    font-size: clamp(48px, 9.5vw, 136px);
    font-weight: 800;
    line-height: 0.92;
    letter-spacing: -0.045em;
    color: var(--tet-text);
    margin: 0 0 32px;
}

.tet-pro-hero__title em {
    font-style: italic;
    font-weight: 300;
    color: var(--tet-text-muted);
}

.tet-pro-hero__title .accent {
    color: var(--tet-teal);
    font-style: italic;
    font-weight: 600;
}

.tet-pro-hero__sub {
    max-width: 580px;
    font-size: clamp(17px, 1.6vw, 21px);
    line-height: 1.55;
    color: var(--tet-text-muted);
    margin: 0 0 48px;
}

.tet-pro-hero__actions {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.tet-pro-hero__scroll {
    position: absolute;
    bottom: 32px;
    right: 24px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--tet-text-muted);
    z-index: 2;
}

.tet-pro-hero__scroll .line {
    display: inline-block;
    width: 40px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--tet-text));
    position: relative;
}

.tet-pro-hero__scroll .line::after {
    content: '';
    position: absolute;
    right: 0;
    top: -3px;
    width: 7px;
    height: 7px;
    border-top: 1px solid var(--tet-text);
    border-right: 1px solid var(--tet-text);
    transform: rotate(45deg);
}

/* === MARQUEE === */

.tet-marquee {
    position: relative;
    overflow: hidden;
    padding: 28px 0;
    background: var(--tet-text);
    color: var(--tet-bg);
    border-top: 1px solid var(--tet-border);
    border-bottom: 1px solid var(--tet-border);
}

.tet-marquee__track {
    display: flex;
    gap: 64px;
    width: max-content;
    animation: tet-marquee-scroll 35s linear infinite;
    will-change: transform;
}

.tet-marquee__item {
    display: inline-flex;
    align-items: center;
    gap: 32px;
    font-size: clamp(20px, 2.6vw, 32px);
    font-weight: 700;
    letter-spacing: -0.02em;
    white-space: nowrap;
    color: inherit;
    flex-shrink: 0;
}

.tet-marquee__item::before {
    content: '';
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--tet-teal);
    box-shadow: 0 0 16px rgba(60, 180, 181, 0.6);
}

@keyframes tet-marquee-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* === STATS STRIP === */

.tet-stats {
    padding: 0;
    background: var(--tet-bg);
}

.tet-stats__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-top: 1px solid var(--tet-border);
    border-bottom: 1px solid var(--tet-border);
}

.tet-stat {
    padding: 64px 32px;
    border-right: 1px solid var(--tet-border);
    position: relative;
    transition: background var(--transition-normal);
}

.tet-stat:last-child { border-right: none; }

.tet-stat:hover { background: var(--tet-surface); }

.tet-stat__index {
    position: absolute;
    top: 20px;
    right: 24px;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.16em;
    color: var(--tet-text-soft);
}

.tet-stat__num {
    display: flex;
    align-items: baseline;
    gap: 4px;
    font-size: clamp(56px, 6.5vw, 88px);
    font-weight: 800;
    line-height: 0.95;
    letter-spacing: -0.04em;
    color: var(--tet-text);
    margin-bottom: 12px;
}

.tet-stat__suffix {
    font-size: 0.5em;
    color: var(--tet-teal);
    font-weight: 700;
}

.tet-stat__label {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--tet-text-muted);
}

@media (max-width: 900px) {
    .tet-stats__grid { grid-template-columns: repeat(2, 1fr); }
    .tet-stat:nth-child(2) { border-right: none; }
    .tet-stat:nth-child(1), .tet-stat:nth-child(2) { border-bottom: 1px solid var(--tet-border); }
    .tet-stat { padding: 40px 24px; }
}

/* === BENTO GRID === */

.tet-bento-section {
    padding: clamp(80px, 12vw, 160px) 0;
    background: var(--tet-surface);
}

.tet-bento-section__header {
    margin-bottom: 56px;
    padding: 0 24px;
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: end;
    gap: 32px;
}

.tet-bento-section__index {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.16em;
    color: var(--tet-teal);
    text-transform: uppercase;
}

.tet-bento-section__title {
    font-size: clamp(36px, 5vw, 64px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.035em;
    color: var(--tet-text);
    margin: 0;
}

.tet-bento-section__title em {
    font-style: italic;
    font-weight: 300;
    color: var(--tet-text-muted);
}

.tet-bento-section__cta {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--tet-text);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    border: 1px solid var(--tet-border-strong);
    border-radius: var(--radius-pill);
    transition: all var(--transition-fast);
    white-space: nowrap;
}

.tet-bento-section__cta:hover {
    background: var(--tet-text);
    color: var(--tet-text-inverse);
    border-color: var(--tet-text);
}

.tet-bento {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: 220px;
    gap: 16px;
    padding: 0 24px;
    max-width: 1320px;
    margin: 0 auto;
}

.tet-bento__cell {
    position: relative;
    background: var(--tet-white);
    border-radius: 28px;
    padding: 36px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-decoration: none;
    color: var(--tet-text);
    transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    border: 1px solid transparent;
}

.tet-bento__cell:hover {
    transform: translateY(-4px);
    box-shadow: 0 24px 48px rgba(15, 23, 41, 0.08);
    border-color: var(--tet-border);
}

.tet-bento__cell:hover .tet-bento__arrow {
    transform: translate(4px, -4px);
}

.tet-bento__cell--xl {
    grid-column: span 4;
    grid-row: span 2;
    background: linear-gradient(135deg, var(--tet-navy) 0%, var(--tet-navy-light) 100%);
    color: var(--tet-text-inverse);
}

.tet-bento__cell--xl::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
            radial-gradient(circle 400px at 80% 20%, rgba(60, 180, 181, 0.3) 0%, transparent 60%),
            radial-gradient(circle 300px at 20% 80%, rgba(95, 201, 202, 0.15) 0%, transparent 60%);
    pointer-events: none;
}

.tet-bento__cell--xl::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle, rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size: 24px 24px;
    opacity: 0.6;
    pointer-events: none;
}

.tet-bento__cell--md {
    grid-column: span 2;
}

.tet-bento__cell--accent {
    background: var(--tet-text);
    color: var(--tet-text-inverse);
}

.tet-bento__cell--teal {
    background: linear-gradient(135deg, var(--tet-teal) 0%, var(--tet-teal-dark) 100%);
    color: var(--tet-text-inverse);
}

.tet-bento__header {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.tet-bento__index {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.16em;
    color: currentColor;
    opacity: 0.6;
    text-transform: uppercase;
}

.tet-bento__arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(15, 23, 41, 0.06);
    color: currentColor;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    font-size: 16px;
    flex-shrink: 0;
}

.tet-bento__cell--xl .tet-bento__arrow,
.tet-bento__cell--accent .tet-bento__arrow,
.tet-bento__cell--teal .tet-bento__arrow {
    background: rgba(255,255,255,0.12);
}

.tet-bento__title {
    position: relative;
    z-index: 1;
    font-size: clamp(20px, 2vw, 28px);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.02em;
    margin: 0 0 8px;
    color: inherit;
}

.tet-bento__cell--xl .tet-bento__title {
    font-size: clamp(32px, 3.5vw, 48px);
    font-weight: 700;
}

.tet-bento__desc {
    position: relative;
    z-index: 1;
    font-size: 14px;
    line-height: 1.55;
    color: currentColor;
    opacity: 0.7;
    margin: 0;
    max-width: 480px;
}

@media (max-width: 1024px) {
    .tet-bento { grid-template-columns: repeat(4, 1fr); }
    .tet-bento__cell--xl { grid-column: span 4; }
    .tet-bento__cell--md { grid-column: span 2; }
}

@media (max-width: 640px) {
    .tet-bento { grid-template-columns: 1fr; grid-auto-rows: auto; }
    .tet-bento__cell, .tet-bento__cell--xl, .tet-bento__cell--md {
        grid-column: span 1;
        grid-row: span 1;
        min-height: 260px;
    }
    .tet-bento-section__header { grid-template-columns: 1fr; gap: 16px; }
}

/* === DARK FEATURE === */

.tet-dark-feature {
    padding: clamp(96px, 14vw, 200px) 0;
    background: #0A1429;
    color: var(--tet-text-inverse);
    position: relative;
    overflow: hidden;
}

.tet-dark-feature::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
            radial-gradient(circle 800px at 70% 20%, rgba(60, 180, 181, 0.18) 0%, transparent 60%),
            radial-gradient(circle 600px at 20% 80%, rgba(29, 51, 84, 0.4) 0%, transparent 60%);
    pointer-events: none;
}

.tet-dark-feature::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
            linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
            linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
    background-size: 64px 64px;
    pointer-events: none;
    mask-image: radial-gradient(ellipse 100% 80% at 50% 50%, black 20%, transparent 70%);
    -webkit-mask-image: radial-gradient(ellipse 100% 80% at 50% 50%, black 20%, transparent 70%);
}

.tet-dark-feature__inner {
    position: relative;
    z-index: 1;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 24px;
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 80px;
    align-items: center;
}

.tet-dark-feature__index {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--tet-teal-light);
    margin-bottom: 32px;
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.tet-dark-feature__index::before {
    content: '';
    display: inline-block;
    width: 32px;
    height: 1px;
    background: var(--tet-teal-light);
}

.tet-dark-feature__title {
    font-size: clamp(40px, 6vw, 88px);
    font-weight: 800;
    line-height: 0.96;
    letter-spacing: -0.035em;
    margin: 0 0 32px;
    color: var(--tet-text-inverse);
}

.tet-dark-feature__title em {
    font-style: italic;
    font-weight: 300;
    color: var(--tet-teal-light);
}

.tet-dark-feature__desc {
    font-size: 17px;
    line-height: 1.65;
    color: rgba(255, 255, 255, 0.7);
    margin: 0 0 40px;
    max-width: 480px;
}

.tet-dark-feature__cta {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 18px 32px;
    background: var(--tet-teal);
    color: var(--tet-text-inverse);
    border-radius: var(--radius-pill);
    font-weight: 600;
    text-decoration: none;
    transition: all var(--transition-normal);
    box-shadow: 0 12px 40px rgba(60, 180, 181, 0.35);
}

.tet-dark-feature__cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 48px rgba(60, 180, 181, 0.5);
    background: var(--tet-teal-dark);
    color: var(--tet-text-inverse);
}

.tet-dark-feature__visual {
    position: relative;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tet-dark-feature__visual svg {
    width: 100%;
    height: 100%;
    max-width: 560px;
    animation: tet-orbit 60s linear infinite;
}

@keyframes tet-orbit {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

@media (max-width: 900px) {
    .tet-dark-feature__inner { grid-template-columns: 1fr; gap: 48px; }
    .tet-dark-feature__visual { max-width: 320px; margin: 0 auto; }
}

/* === NUMBERED VALUES === */

.tet-values {
    padding: clamp(96px, 14vw, 160px) 0;
    background: var(--tet-bg);
}

.tet-values__header {
    max-width: 1320px;
    margin: 0 auto 64px;
    padding: 0 24px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: end;
}

.tet-values__title {
    font-size: clamp(36px, 5vw, 64px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.035em;
    margin: 0;
    color: var(--tet-text);
}

.tet-values__title em {
    font-style: italic;
    font-weight: 300;
    color: var(--tet-text-muted);
}

.tet-values__intro {
    font-size: clamp(15px, 1.4vw, 18px);
    line-height: 1.6;
    color: var(--tet-text-muted);
    max-width: 420px;
    margin: 0;
    justify-self: end;
}

.tet-values__list {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 24px;
}

.tet-value-row {
    display: grid;
    grid-template-columns: 80px 1fr 60px;
    gap: 32px;
    align-items: start;
    padding: 32px 16px;
    border-top: 1px solid var(--tet-border);
    cursor: pointer;
    transition: all var(--transition-normal);
    position: relative;
    text-decoration: none;
    color: inherit;
}

.tet-value-row:last-child { border-bottom: 1px solid var(--tet-border); }

.tet-value-row::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 0;
    background: linear-gradient(90deg, transparent, rgba(60, 180, 181, 0.06), transparent);
    transition: width 0.5s ease;
    pointer-events: none;
}

.tet-value-row:hover::before { width: 100%; }
.tet-value-row:hover .tet-value-row__num { color: var(--tet-teal); }
.tet-value-row:hover .tet-value-row__arrow {
    opacity: 1;
    transform: translateX(0);
}

.tet-value-row__num {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.08em;
    color: var(--tet-text-soft);
    padding-top: 6px;
    transition: color var(--transition-normal);
}

.tet-value-row__title {
    font-size: clamp(24px, 3vw, 36px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--tet-text);
    margin: 0;
}

.tet-value-row__arrow {
    font-size: 24px;
    color: var(--tet-text);
    opacity: 0;
    transform: translateX(-8px);
    transition: all var(--transition-normal);
    text-align: right;
    padding-top: 6px;
}

@media (max-width: 768px) {
    .tet-values__header { grid-template-columns: 1fr; gap: 24px; }
    .tet-values__intro { justify-self: start; }
    .tet-value-row { grid-template-columns: 48px 1fr 32px; gap: 16px; padding: 24px 8px; }
    .tet-value-row__arrow { opacity: 1; transform: none; }
}

/* === EDITORIAL NEWS === */

.tet-news-pro {
    padding: clamp(96px, 14vw, 160px) 0;
    background: var(--tet-bg);
}

.tet-news-pro__header {
    max-width: 1320px;
    margin: 0 auto 56px;
    padding: 0 24px;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    flex-wrap: wrap;
}

.tet-news-pro__title {
    font-size: clamp(36px, 5vw, 64px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.035em;
    margin: 0;
    color: var(--tet-text);
}

.tet-news-pro__title em {
    font-style: italic;
    font-weight: 300;
    color: var(--tet-text-muted);
}

.tet-news-pro__grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 24px;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 24px;
}

.tet-news-pro__item {
    text-decoration: none;
    color: var(--tet-text);
    display: block;
}

.tet-news-pro__item:first-child {
    grid-row: span 2;
}

.tet-news-pro__media {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    background: var(--tet-surface);
    aspect-ratio: 4/3;
    margin-bottom: 20px;
}

.tet-news-pro__item:first-child .tet-news-pro__media {
    aspect-ratio: 4/5;
}

.tet-news-pro__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.tet-news-pro__item:hover .tet-news-pro__media img {
    transform: scale(1.06);
}

.tet-news-pro__date {
    position: absolute;
    top: 16px;
    left: 16px;
    padding: 6px 12px;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(8px);
    border-radius: var(--radius-pill);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    color: var(--tet-text);
    text-transform: uppercase;
}

.tet-news-pro__cat {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.12em;
    color: var(--tet-teal);
    text-transform: uppercase;
    margin-bottom: 8px;
}

.tet-news-pro__heading {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.015em;
    color: var(--tet-text);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tet-news-pro__item:first-child .tet-news-pro__heading {
    font-size: clamp(22px, 2vw, 28px);
}

@media (max-width: 900px) {
    .tet-news-pro__grid { grid-template-columns: 1fr 1fr; }
    .tet-news-pro__item:first-child { grid-row: span 1; grid-column: span 2; }
}

@media (max-width: 560px) {
    .tet-news-pro__grid { grid-template-columns: 1fr; }
    .tet-news-pro__item:first-child { grid-column: span 1; }
}

/* === BIG CTA === */

.tet-big-cta {
    padding: clamp(120px, 18vw, 220px) 0;
    background: var(--tet-bg);
    position: relative;
    overflow: hidden;
    text-align: center;
}

.tet-big-cta::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
            linear-gradient(rgba(15, 23, 41, 0.04) 1px, transparent 1px),
            linear-gradient(90deg, rgba(15, 23, 41, 0.04) 1px, transparent 1px);
    background-size: 80px 80px;
    mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, black 30%, transparent 70%);
    -webkit-mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, black 30%, transparent 70%);
}

.tet-big-cta__inner {
    position: relative;
    z-index: 1;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 24px;
}

.tet-big-cta__eyebrow {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--tet-teal);
    margin-bottom: 32px;
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.tet-big-cta__eyebrow::before,
.tet-big-cta__eyebrow::after {
    content: '';
    display: inline-block;
    width: 24px;
    height: 1px;
    background: var(--tet-teal);
}

.tet-big-cta__title {
    font-size: clamp(48px, 9vw, 144px);
    font-weight: 800;
    line-height: 0.92;
    letter-spacing: -0.045em;
    color: var(--tet-text);
    margin: 0 0 48px;
}

.tet-big-cta__title em {
    font-style: italic;
    font-weight: 300;
    color: var(--tet-text-muted);
}

.tet-big-cta__email {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    font-size: clamp(20px, 2.5vw, 32px);
    font-weight: 600;
    letter-spacing: -0.015em;
    color: var(--tet-text);
    text-decoration: none;
    padding: 16px 32px;
    border: 1.5px solid var(--tet-text);
    border-radius: var(--radius-pill);
    transition: all var(--transition-normal);
}

.tet-big-cta__email:hover {
    background: var(--tet-text);
    color: var(--tet-text-inverse);
    transform: translateY(-2px);
}

.tet-big-cta__email .arrow {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--tet-text);
    color: var(--tet-text-inverse);
    transition: all var(--transition-normal);
    font-size: 14px;
}

.tet-big-cta__email:hover .arrow {
    background: var(--tet-text-inverse);
    color: var(--tet-text);
}

/* ============================================================
   TET 2025 — APPLE CLEAN
   Restrained, corporate, contained. No editorial flourishes.
   ============================================================ */

:root {
    --apple-bg: #FBFBFD;
    --apple-surface: #F5F5F7;
    --apple-text: #1D1D1F;
    --apple-text-muted: #6E6E73;
    --apple-text-soft: #86868B;
    --apple-border: rgba(0, 0, 0, 0.06);
    --apple-accent: #3CB4B5;
    --apple-accent-dark: #2A8A8B;
    --apple-navy: #1D3354;
    --apple-container: 980px;
    --apple-container-wide: 1180px;
}

body.tet-2025 {
    background: var(--apple-bg) !important;
    color: var(--apple-text) !important;
    font-feature-settings: 'ss01', 'cv11';
}

/* === KILL old aggressive elements that don't fit Apple === */

.tet-mouse-glow { display: none !important; }

/* === CONTAINER === */

.apple-container {
    max-width: var(--apple-container);
    margin: 0 auto;
    padding: 0 24px;
    width: 100%;
}

.apple-container--wide {
    max-width: var(--apple-container-wide);
}

@media (min-width: 1024px) {
    .apple-container { padding: 0 32px; }
}

/* === SECTION === */

.apple-section {
    padding: 120px 0;
}

.apple-section--tight { padding: 80px 0; }
.apple-section--loose { padding: 160px 0; }

.apple-section--surface { background: var(--apple-surface); }
.apple-section--dark {
    background: var(--apple-text);
    color: #F5F5F7;
}

@media (max-width: 768px) {
    .apple-section { padding: 72px 0; }
    .apple-section--loose { padding: 96px 0; }
    .apple-section--tight { padding: 56px 0; }
}

/* === TYPOGRAPHY === */

.apple-eyebrow {
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--apple-accent);
    margin-bottom: 16px;
}

.apple-h1 {
    font-family: var(--font-display);
    font-size: clamp(40px, 5.6vw, 80px);
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: -0.025em;
    color: var(--apple-text);
    margin: 0 0 20px;
    font-feature-settings: "ss01", "ss02";
}

.apple-h2 {
    font-family: var(--font-display);
    font-size: clamp(32px, 4vw, 56px);
    font-weight: 600;
    line-height: 1.07;
    letter-spacing: -0.02em;
    color: var(--apple-text);
    margin: 0 0 20px;
    font-feature-settings: "ss01", "ss02";
}

.apple-h3 {
    font-size: clamp(22px, 2vw, 28px);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.015em;
    color: var(--apple-text);
    margin: 0 0 12px;
}

.apple-lead {
    font-size: clamp(18px, 1.5vw, 22px);
    line-height: 1.45;
    color: var(--apple-text-muted);
    margin: 0 0 32px;
    font-weight: 400;
}

.apple-body {
    font-size: 17px;
    line-height: 1.55;
    color: var(--apple-text-muted);
    margin: 0;
}

.apple-section-head {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 80px;
}

.apple-section-head--left {
    text-align: left;
    margin-left: 0;
    margin-right: auto;
}

/* === BUTTONS (Apple-style: pill, restrained) === */

.apple-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 12px 22px;
    border-radius: 980px;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: -0.01em;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: all 200ms ease-out;
    white-space: nowrap;
    line-height: 1.2;
}

.apple-btn--primary {
    background: var(--apple-text);
    color: #fff;
}

.apple-btn--primary:hover {
    background: #000;
    color: #fff;
}

.apple-btn--accent {
    background: var(--apple-accent);
    color: #fff;
}

.apple-btn--accent:hover {
    background: var(--apple-accent-dark);
    color: #fff;
}

.apple-btn--ghost {
    background: transparent;
    color: var(--apple-accent);
    padding: 12px 0;
    border-radius: 0;
}

.apple-btn--ghost:hover {
    color: var(--apple-accent-dark);
    text-decoration: underline;
}

.apple-btn--link {
    background: transparent;
    color: var(--apple-accent);
    padding: 0;
    font-size: 17px;
}

.apple-btn--link:hover { text-decoration: underline; }

.apple-btn .arrow {
    display: inline-block;
    transition: transform 200ms ease-out;
}

.apple-btn:hover .arrow { transform: translateX(2px); }

/* === HERO === */

.apple-hero {
    padding: 140px 0 80px;
    text-align: center;
    background: var(--apple-bg);
    position: relative;
    overflow: hidden;
}

.apple-hero__eyebrow {
    color: var(--apple-accent);
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 16px;
}

.apple-hero__title {
    font-size: clamp(40px, 6.5vw, 96px);
    font-weight: 700;
    line-height: 1.02;
    letter-spacing: -0.03em;
    color: var(--apple-text);
    margin: 0 auto 24px;
    max-width: 18ch;
}

.apple-hero__sub {
    font-size: clamp(19px, 1.7vw, 24px);
    line-height: 1.4;
    color: var(--apple-text-muted);
    margin: 0 auto 40px;
    max-width: 640px;
    font-weight: 400;
}

.apple-hero__actions {
    display: flex;
    gap: 24px;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}

@media (max-width: 768px) {
    .apple-hero { padding: 96px 0 64px; }
    .apple-hero__actions { gap: 16px; }
}

/* === CARD GRID === */

.apple-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.apple-grid--2 { grid-template-columns: repeat(2, 1fr); }
.apple-grid--4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 900px) {
    .apple-grid, .apple-grid--2, .apple-grid--4 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 560px) {
    .apple-grid, .apple-grid--2, .apple-grid--4 {
        grid-template-columns: 1fr;
    }
}

.apple-card {
    background: #fff;
    border-radius: 22px;
    padding: 36px 32px;
    transition: transform 300ms ease-out, box-shadow 300ms ease-out;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    height: 100%;
    border: 1px solid var(--apple-border);
}

.apple-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.06);
}

.apple-card__icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--apple-surface);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 28px;
    overflow: hidden;
}

.apple-card__icon img {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.apple-card__title {
    font-size: 21px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.015em;
    color: var(--apple-text);
    margin: 0 0 8px;
}

.apple-card__desc {
    font-size: 15px;
    line-height: 1.5;
    color: var(--apple-text-muted);
    margin: 0 0 20px;
    flex-grow: 1;
}

.apple-card__link {
    color: var(--apple-accent);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    margin-top: auto;
}

.apple-card__link:hover { text-decoration: underline; }

/* === FEATURE BLOCK (two-column for featured content like MYH) === */

.apple-feature {
    background: var(--apple-text);
    color: #fff;
    border-radius: 24px;
    overflow: hidden;
    position: relative;
}

.apple-feature__inner {
    padding: clamp(56px, 8vw, 96px);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}

.apple-feature__content .apple-eyebrow {
    color: var(--apple-accent);
}

.apple-feature__title {
    font-size: clamp(32px, 4vw, 52px);
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: #fff;
    margin: 0 0 20px;
}

.apple-feature__desc {
    font-size: 17px;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.72);
    margin: 0 0 32px;
    max-width: 480px;
}

.apple-feature__visual {
    aspect-ratio: 1;
    border-radius: 16px;
    overflow: hidden;
    background:
            radial-gradient(circle at 30% 30%, rgba(60, 180, 181, 0.3) 0%, transparent 60%),
            linear-gradient(135deg, #1D3354 0%, #0A1429 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 64px;
}

.apple-feature__visual--text {
    font-size: clamp(48px, 6vw, 88px);
    font-weight: 700;
    letter-spacing: -0.04em;
    color: #fff;
    line-height: 0.95;
    text-align: center;
}

.apple-feature__visual--text .accent {
    display: block;
    color: var(--apple-accent);
    font-weight: 500;
}

@media (max-width: 900px) {
    .apple-feature__inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .apple-feature__visual {
        max-width: 480px;
        margin: 0 auto;
        width: 100%;
    }
}

/* === STATS (simple inline strip) === */

.apple-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    border-top: 1px solid var(--apple-border);
    border-bottom: 1px solid var(--apple-border);
}

.apple-stat {
    padding: 48px 24px;
    text-align: center;
    border-right: 1px solid var(--apple-border);
}

.apple-stat:last-child { border-right: none; }

.apple-stat__num {
    font-size: clamp(40px, 5vw, 64px);
    font-weight: 700;
    letter-spacing: -0.025em;
    color: var(--apple-text);
    line-height: 1;
    margin-bottom: 8px;
}

.apple-stat__num .suffix {
    color: var(--apple-accent);
    font-weight: 600;
    font-size: 0.55em;
}

.apple-stat__label {
    font-size: 14px;
    color: var(--apple-text-muted);
    font-weight: 500;
}

@media (max-width: 768px) {
    .apple-stats { grid-template-columns: repeat(2, 1fr); }
    .apple-stat:nth-child(2) { border-right: none; }
    .apple-stat:nth-child(1), .apple-stat:nth-child(2) {
        border-bottom: 1px solid var(--apple-border);
    }
    .apple-stat { padding: 32px 16px; }
}

/* === VALUES GRID (4-col, equal, balanced) === */

.apple-values-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.apple-value {
    background: #fff;
    border: 1px solid var(--apple-border);
    border-radius: 18px;
    padding: 32px 28px;
    text-align: left;
    cursor: pointer;
    transition: all 300ms ease-out;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.apple-value:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.06);
}

.apple-value__icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--apple-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    overflow: hidden;
    flex-shrink: 0;
}

.apple-value__icon img {
    width: 22px;
    height: 22px;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.apple-value__title {
    font-size: 17px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -0.01em;
    color: var(--apple-text);
    margin: 0;
}

@media (max-width: 900px) {
    .apple-values-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
    .apple-values-grid { grid-template-columns: 1fr; }
}

/* === NEWS GRID (clean 3-col) === */

.apple-news-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.apple-news {
    text-decoration: none;
    color: inherit;
    display: block;
    transition: opacity 200ms ease-out;
}

.apple-news__media {
    aspect-ratio: 4/3;
    border-radius: 16px;
    overflow: hidden;
    background: var(--apple-surface);
    margin-bottom: 20px;
}

.apple-news__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 500ms ease-out;
}

.apple-news:hover .apple-news__media img {
    transform: scale(1.04);
}

.apple-news__date {
    font-size: 13px;
    color: var(--apple-text-soft);
    font-weight: 500;
    margin-bottom: 8px;
    letter-spacing: -0.005em;
}

.apple-news__title {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.015em;
    color: var(--apple-text);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (max-width: 900px) {
    .apple-news-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}

@media (max-width: 560px) {
    .apple-news-grid { grid-template-columns: 1fr; }
}

/* === CTA === */

.apple-cta {
    text-align: center;
}

.apple-cta__title {
    font-family: var(--font-display);
    font-size: clamp(36px, 4.5vw, 64px);
    font-weight: 600;
    line-height: 1.08;
    letter-spacing: -0.02em;
    color: var(--apple-text);
    margin: 0 0 16px;
    font-feature-settings: "ss01", "ss02";
}

.apple-cta__sub {
    font-size: clamp(17px, 1.4vw, 20px);
    line-height: 1.5;
    color: var(--apple-text-muted);
    max-width: 560px;
    margin: 0 auto 32px;
}

/* ============================================================
   CTA-PRO — modern, dramatic, full-bleed dark section
   Replaces generic centered apple-cta with premium design
   ============================================================ */

.a-cta-pro {
    position: relative;
    padding: clamp(56px, 7vw, 88px) 24px;
    background: #0A1429;
    background-image:
        linear-gradient(rgba(60, 180, 181, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(60, 180, 181, 0.035) 1px, transparent 1px);
    background-size: 56px 56px;
    color: #fff;
    overflow: hidden;
    text-align: center;
    isolation: isolate;
}

/* Ambient radial glow */
.a-cta-pro::before {
    content: '';
    position: absolute;
    inset: -10%;
    z-index: -2;
    background:
        radial-gradient(ellipse 900px 600px at 50% 100%, rgba(60, 180, 181, 0.22), transparent 65%),
        radial-gradient(circle 400px at 10% 10%, rgba(60, 180, 181, 0.08), transparent 50%),
        radial-gradient(circle 400px at 90% 15%, rgba(95, 201, 202, 0.06), transparent 50%);
    pointer-events: none;
}

/* (scan line removed) */

/* Mouse-following spotlight */
.a-cta-pro__spot {
    position: absolute;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(60, 180, 181, 0.18), transparent 70%);
    filter: blur(40px);
    pointer-events: none;
    z-index: -1;
    transform: translate(-50%, -50%);
    opacity: 0;
    transition: opacity 600ms;
    mix-blend-mode: screen;
    left: 50%;
    top: 50%;
}

.a-cta-pro.is-hover .a-cta-pro__spot {
    opacity: 1;
}

/* Content wrapper */
.a-cta-pro__content {
    position: relative;
    z-index: 1;
    max-width: 920px;
    margin: 0 auto;
}

/* Glassmorphic eyebrow chip with pulse dot */
.a-cta-pro__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(12px) saturate(180%);
    -webkit-backdrop-filter: blur(12px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 980px;
    font-size: 13px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 32px;
    letter-spacing: -0.005em;
}

.a-cta-pro__eyebrow::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--apple-accent);
    box-shadow: 0 0 12px rgba(60, 180, 181, 0.8);
    animation: ctaPulse 2s ease-in-out infinite;
}

@keyframes ctaPulse {
    0%, 100% { opacity: 1; transform: scale(1); box-shadow: 0 0 12px rgba(60, 180, 181, 0.8); }
    50%      { opacity: 0.7; transform: scale(1.4); box-shadow: 0 0 20px rgba(60, 180, 181, 1); }
}

/* Headline — sized like inner hero, with subtle neon glow */
.a-cta-pro__title {
    font-family: var(--font-display);
    font-size: clamp(36px, 4.5vw, 64px);
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: -0.025em;
    color: #fff;
    margin: 0 0 20px;
    max-width: 18ch;
    margin-left: auto;
    margin-right: auto;
    text-shadow:
        0 0 1px rgba(255, 255, 255, 0.4),
        0 0 60px rgba(60, 180, 181, 0.2);
}

.a-cta-pro__sub {
    font-size: clamp(16px, 1.3vw, 19px);
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.62);
    margin: 0 auto 44px;
    max-width: 540px;
    font-weight: 400;
}

/* Actions row */
.a-cta-pro__actions {
    display: flex;
    gap: 24px;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

/* Primary button — white pill with dark icon circle */
.a-cta-pro .a-cta-pro__primary,
.a-cta-pro a.a-cta-pro__primary {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    padding: 14px 14px 14px 28px;
    background: #fff !important;
    color: #0F1729 !important;
    border-radius: 980px;
    font-size: 15px;
    font-weight: 500;
    text-decoration: none !important;
    transition: all 400ms cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    letter-spacing: -0.01em;
    border: none;
    cursor: pointer;
}

.a-cta-pro .a-cta-pro__primary:hover,
.a-cta-pro a.a-cta-pro__primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.25);
    color: #0F1729 !important;
    background: #fff !important;
}

.a-cta-pro__primary .icon-circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: var(--apple-text);
    color: #fff;
    border-radius: 50%;
    font-size: 14px;
    transition: transform 400ms cubic-bezier(0.16, 1, 0.3, 1);
    flex-shrink: 0;
}

.a-cta-pro__primary:hover .icon-circle {
    transform: translateX(4px) rotate(-45deg);
}

/* Secondary text link */
.a-cta-pro__secondary {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
    font-size: 15px;
    font-weight: 400;
    transition: color 200ms, gap 200ms;
}

.a-cta-pro__secondary:hover {
    color: #fff;
    gap: 10px;
}

.a-cta-pro__secondary .chev {
    color: var(--apple-accent);
    font-size: 1.2em;
}

/* Decorative shapes — hidden, replaced by cyber corner brackets */
.a-cta-pro__deco {
    display: none;
}

.a-cta-pro__deco--ring,
.a-cta-pro__deco--ring-sm {
    display: none;
}

/* Cyber corner brackets — HUD-style framing */
.a-cta-pro .a-cta-pro__content::before,
.a-cta-pro .a-cta-pro__content::after {
    content: '';
    position: absolute;
    width: 40px;
    height: 40px;
    pointer-events: none;
    z-index: 0;
}

.a-cta-pro .a-cta-pro__content::before {
    top: -28px;
    left: -28px;
    border-top: 1.5px solid var(--apple-accent);
    border-left: 1.5px solid var(--apple-accent);
    box-shadow: -2px -2px 14px rgba(60, 180, 181, 0.35);
}

.a-cta-pro .a-cta-pro__content::after {
    bottom: -28px;
    right: -28px;
    border-bottom: 1.5px solid var(--apple-accent);
    border-right: 1.5px solid var(--apple-accent);
    box-shadow: 2px 2px 14px rgba(60, 180, 181, 0.35);
}

@media (max-width: 768px) {
    .a-cta-pro .a-cta-pro__content::before,
    .a-cta-pro .a-cta-pro__content::after {
        width: 24px;
        height: 24px;
    }
    .a-cta-pro .a-cta-pro__content::before { top: -16px; left: -16px; }
    .a-cta-pro .a-cta-pro__content::after { bottom: -16px; right: -16px; }
}

@media (max-width: 768px) {
    .a-cta-pro { padding: 48px 20px; }
    .a-cta-pro__actions { flex-direction: column; gap: 12px; }
}

/* ============================================================
   APPLE-PROPER additions: link style + image-driven sections
   ============================================================ */

/* Apple-style text link (not pill) */
.a-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--apple-accent);
    font-size: 17px;
    font-weight: 400;
    text-decoration: none;
    transition: color 200ms;
    letter-spacing: -0.01em;
}

.a-link:hover { text-decoration: underline; color: var(--apple-accent-dark); }

.a-link .chev {
    font-size: 1.1em;
    font-weight: 600;
    transition: transform 200ms;
    transform: translateY(-0.05em);
}

.a-link:hover .chev { transform: translateX(2px) translateY(-0.05em); }

.a-link--lg { font-size: 19px; }
.a-link--white { color: #fff; }
.a-link--white:hover { color: #fff; }

/* Apple-style solid pill (for "Buy" / primary CTA only) */
.a-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 12px 22px;
    border-radius: 980px;
    background: var(--apple-text);
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: -0.01em;
    text-decoration: none;
    transition: opacity 200ms;
    white-space: nowrap;
}

.a-pill:hover { color: #fff; opacity: 0.86; }

.a-pill--accent { background: var(--apple-accent); }
.a-pill--accent:hover { background: var(--apple-accent-dark); }

/* === APPLE HERO V2 — Image-driven full-bleed === */

.a-hero {
    position: relative;
    min-height: 92vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 140px 24px 80px;
    overflow: hidden;
    background: var(--apple-bg);
}

.a-hero__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.a-hero__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.a-hero__bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(251,251,253,0.7) 0%, rgba(251,251,253,0.4) 30%, rgba(251,251,253,0.9) 100%);
}

.a-hero__bg--dark::after {
    background: linear-gradient(180deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.5) 60%, rgba(0,0,0,0.85) 100%);
}

.a-hero__content {
    position: relative;
    z-index: 1;
    max-width: 920px;
}

.a-hero__eyebrow {
    font-size: 16px;
    font-weight: 500;
    color: var(--apple-text-muted);
    margin-bottom: 16px;
    letter-spacing: -0.01em;
}

.a-hero__title {
    font-size: clamp(48px, 7vw, 96px);
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: -0.03em;
    color: var(--apple-text);
    margin: 0 0 16px;
}

.a-hero__title--white { color: #fff; }

.a-hero__sub {
    font-size: clamp(20px, 2vw, 28px);
    line-height: 1.3;
    color: var(--apple-text-muted);
    margin: 0 0 28px;
    font-weight: 400;
}

.a-hero__sub--white { color: rgba(255,255,255,0.8); }

.a-hero__actions {
    display: flex;
    gap: 28px;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}

/* ============================================================
   INNER PAGE HERO — smaller, with decorative bg pattern
   For all pages except the homepage main hero
   ============================================================ */

.a-hero--inner {
    min-height: 44vh;
    padding: 140px 24px 80px;
    background: var(--apple-bg);
    position: relative;
    overflow: hidden;
}

.a-hero--inner .a-hero__mesh {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

/* Lottie animation — edge-to-edge cover */
.a-hero--inner .a-hero__lottie {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none;
    z-index: 0;
    display: block;
}

/* Force the internal SVG to cover (slice) regardless of aspect ratio */
.a-hero--inner .a-hero__lottie svg {
    width: 100% !important;
    height: 100% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    object-fit: cover;
}

@keyframes meshFlow {
    0%, 100% { transform: scale(1) translate(0, 0) rotate(0deg); }
    25%      { transform: scale(1.12) translate(-3%, 2%) rotate(2deg); }
    50%      { transform: scale(1.06) translate(2%, -3%) rotate(-1deg); }
    75%      { transform: scale(1.15) translate(-2%, -2%) rotate(1deg); }
}

/* Cursor-following spotlight blob */
.a-hero--inner .a-hero__cursor {
    position: absolute;
    pointer-events: none;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(60, 180, 181, 0.20) 0%, transparent 70%);
    filter: blur(40px);
    transform: translate(-50%, -50%);
    opacity: 0;
    transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 0;
    will-change: left, top, opacity;
    mix-blend-mode: screen;
    left: 50%;
    top: 50%;
}

.a-hero--inner.is-cursor-active .a-hero__cursor {
    opacity: 1;
}

/* Letter reveal animation */
.a-hero--inner .a-hero__title .word {
    display: inline-block;
    overflow: hidden;
    vertical-align: top;
    /* Expand clip zone to include descenders (g, ş, ç) + diacritics (ğ, ı, İ) */
    padding: 0.15em 0.05em;
    margin: -0.15em -0.05em;
    line-height: 1.15;
}

.a-hero--inner .a-hero__title .word > span {
    display: inline-block;
    transform: translateY(110%);
    opacity: 0;
    animation: letterUp 900ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: calc(var(--i, 0) * 60ms + 100ms);
    will-change: transform, opacity;
}

@keyframes letterUp {
    0%   { transform: translateY(110%); opacity: 0; }
    60%  { opacity: 1; }
    100% { transform: translateY(0); opacity: 1; }
}

/* Sub text fades in after title finishes */
.a-hero--inner .a-hero__sub,
.a-hero--inner .a-hero__eyebrow {
    opacity: 0;
    transform: translateY(16px);
    animation: subFadeUp 800ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
    will-change: transform, opacity;
}

.a-hero--inner .a-hero__eyebrow {
    animation-delay: 80ms;
}

.a-hero--inner .a-hero__sub {
    animation-delay: 500ms;
}

@keyframes subFadeUp {
    to { opacity: 1; transform: translateY(0); }
}

/* ============================================================
   HERO DECORATIVE SHAPES — injected by JS
   ============================================================ */

.a-hero__deco {
    position: absolute;
    color: var(--apple-accent);
    pointer-events: none;
    z-index: 0;
    translate: 0 var(--parallax-y, 0);
    transition: translate 100ms linear;
    will-change: rotate, translate;
}

.a-hero__deco--circles {
    top: 14%;
    right: 6%;
    width: clamp(100px, 14vw, 200px);
    height: clamp(100px, 14vw, 200px);
    opacity: 0.7;
    animation: deco-spin 60s linear infinite;
}

.a-hero__deco--circles-sm {
    bottom: 18%;
    left: 7%;
    width: clamp(70px, 9vw, 130px);
    height: clamp(70px, 9vw, 130px);
    opacity: 0.55;
    animation: deco-spin-reverse 45s linear infinite;
}

.a-hero__deco--plus {
    top: 26%;
    left: 10%;
    width: 26px;
    height: 26px;
    opacity: 0.5;
    animation: deco-plus-spin 12s ease-in-out infinite;
}

.a-hero__deco--plus-2 {
    bottom: 22%;
    right: 18%;
    width: 20px;
    height: 20px;
    opacity: 0.55;
    animation: deco-plus-spin 14s ease-in-out infinite 2s;
}

.a-hero__deco--dots {
    top: 18%;
    left: 18%;
    width: clamp(80px, 10vw, 140px);
    height: 40px;
    opacity: 0.6;
}

.a-hero__deco--dots-2 {
    bottom: 12%;
    right: 8%;
    width: clamp(70px, 8vw, 110px);
    height: 32px;
    opacity: 0.45;
}

.a-hero__deco--diamond {
    top: 50%;
    right: 14%;
    width: 16px;
    height: 16px;
    opacity: 0.6;
    color: var(--myh-red);
    animation: deco-spin 30s linear infinite;
}

@keyframes deco-spin {
    from { rotate: 0deg; }
    to   { rotate: 360deg; }
}

@keyframes deco-spin-reverse {
    from { rotate: 360deg; }
    to   { rotate: 0deg; }
}

@keyframes deco-plus-spin {
    0%, 100% { rotate: 0deg; }
    50%      { rotate: 90deg; }
}

@media (max-width: 768px) {
    .a-hero__deco--plus,
    .a-hero__deco--plus-2,
    .a-hero__deco--diamond,
    .a-hero__deco--dots,
    .a-hero__deco--dots-2 { display: none; }

    .a-hero__deco--circles { right: -8%; top: 8%; opacity: 0.35; }
    .a-hero__deco--circles-sm { left: -6%; bottom: 8%; opacity: 0.3; }
}

@keyframes heroMesh {
    0%   { transform: translate(0, 0) scale(1); }
    100% { transform: translate(-2%, 1%) scale(1.04); }
}

.a-hero--inner::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle, rgba(29, 29, 31, 0.07) 1px, transparent 1px);
    background-size: 26px 26px;
    background-position: -1px -1px;
    mask-image: radial-gradient(ellipse 70% 60% at 50% 45%, black 25%, transparent 75%);
    -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 45%, black 25%, transparent 75%);
    pointer-events: none;
    z-index: 0;
}

.a-hero--inner::after {
    content: '';
    position: absolute;
    top: 76px;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    max-width: 720px;
    height: 1px;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(60, 180, 181, 0.5) 50%,
        transparent 100%);
    z-index: 0;
}

.a-hero--inner .a-hero__content {
    position: relative;
    z-index: 1;
    max-width: 880px;
}

.a-hero--inner .a-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 980px;
    font-size: 13px;
    font-weight: 500;
    color: var(--apple-text-muted);
    margin-bottom: 24px;
}

.a-hero--inner .a-hero__eyebrow::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--apple-accent);
    box-shadow: 0 0 8px rgba(60, 180, 181, 0.6);
    flex-shrink: 0;
}

.a-hero--inner .a-hero__eyebrow a {
    color: var(--apple-text-muted);
    text-decoration: none;
    transition: color 200ms;
}

.a-hero--inner .a-hero__eyebrow a:hover {
    color: var(--apple-text);
}

.a-hero--inner .a-hero__title {
    font-family: var(--font-display);
    font-size: clamp(40px, 5vw, 72px) !important;
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: -0.028em;
    margin: 0 auto 20px;
    max-width: 18ch;
    font-feature-settings: "ss01", "ss02";
}

.a-hero--inner .a-hero__sub {
    font-size: clamp(17px, 1.4vw, 21px) !important;
    line-height: 1.45;
    color: var(--apple-text-muted);
    max-width: 600px;
    margin: 0 auto;
}

@media (max-width: 768px) {
    .a-hero--inner {
        min-height: auto;
        padding: 112px 20px 56px;
    }
    .a-hero--inner .a-hero__title {
        font-size: clamp(34px, 8vw, 52px) !important;
    }
}

/* === APPLE PRODUCT CARD (alternating image+text sections) === */

.a-product {
    background: var(--apple-surface);
    border-radius: 28px;
    overflow: hidden;
    margin-bottom: 16px;
    position: relative;
}

/* Full-bleed variant — edge-to-edge, no rounded corners */
.a-product--full {
    border-radius: 0 !important;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    margin-bottom: 0;
    width: 100vw;
    max-width: 100vw;
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.a-product--full + .a-product--full {
    border-top: 1px solid rgba(255, 255, 255, 0.04);
}

.a-product--full .a-product__inner {
    max-width: 1600px;
    margin: 0 auto;
    min-height: 600px;
    position: relative;
    z-index: 1;
}

.a-product--full .a-product__content {
    padding: clamp(64px, 8vw, 112px);
    position: relative;
}

/* ============================================================
   CYBER/NEON treatment for dark full-bleed cards
   ============================================================ */

.a-product--full.a-product--dark {
    background: #0A1429;
    background-image:
        linear-gradient(rgba(60, 180, 181, 0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(60, 180, 181, 0.025) 1px, transparent 1px);
    background-size: 48px 48px;
}

/* Subtle ambient glow that follows position in card */
.a-product--full.a-product--dark::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        radial-gradient(circle 700px at 80% 20%, rgba(60, 180, 181, 0.18), transparent 50%),
        radial-gradient(circle 500px at 15% 90%, rgba(95, 201, 202, 0.10), transparent 50%);
    pointer-events: none;
}

/* (scan line removed) */

/* Neon title glow */
.a-product--full.a-product--dark .a-product__title {
    color: #fff;
    text-shadow:
        0 0 1px rgba(255, 255, 255, 0.3),
        0 0 40px rgba(60, 180, 181, 0.25);
}

/* Cyber eyebrow with neon accent */
.a-product--full.a-product--dark .a-product__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 5px 14px;
    background: rgba(60, 180, 181, 0.08);
    border: 1px solid rgba(60, 180, 181, 0.25);
    border-radius: 980px;
    color: var(--apple-accent);
    font-size: 12px;
    text-shadow: 0 0 12px rgba(60, 180, 181, 0.6);
    box-shadow: 0 0 24px rgba(60, 180, 181, 0.12), inset 0 0 12px rgba(60, 180, 181, 0.05);
}

.a-product--full.a-product--dark .a-product__eyebrow::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--apple-accent);
    box-shadow: 0 0 10px var(--apple-accent);
    animation: ctaPulse 2.5s ease-in-out infinite;
}

/* Cyber corner brackets on media */
.a-product--full.a-product--dark .a-product__media {
    position: relative;
    background: linear-gradient(135deg, rgba(60, 180, 181, 0.06), transparent);
}

.a-product--full.a-product--dark .a-product__media::before,
.a-product--full.a-product--dark .a-product__media::after,
.a-product--full.a-product--dark .a-product__media > .corner-tl,
.a-product--full.a-product--dark .a-product__media > .corner-tr,
.a-product--full.a-product--dark .a-product__media > .corner-bl,
.a-product--full.a-product--dark .a-product__media > .corner-br {
    pointer-events: none;
}

.a-product--full.a-product--dark .a-product__media::before {
    content: '';
    position: absolute;
    top: 32px;
    left: 32px;
    width: 32px;
    height: 32px;
    border-top: 1.5px solid var(--apple-accent);
    border-left: 1.5px solid var(--apple-accent);
    box-shadow: -2px -2px 12px rgba(60, 180, 181, 0.3);
    z-index: 3;
}

.a-product--full.a-product--dark .a-product__media::after {
    content: '';
    position: absolute;
    bottom: 32px;
    right: 32px;
    width: 32px;
    height: 32px;
    border-bottom: 1.5px solid var(--apple-accent);
    border-right: 1.5px solid var(--apple-accent);
    box-shadow: 2px 2px 12px rgba(60, 180, 181, 0.3);
    z-index: 3;
}

/* Subtle glow image overlay */
.a-product--full.a-product--dark .a-product__media img {
    filter: brightness(0.9) contrast(1.05);
}

/* Light cards — subtle premium treatment */
.a-product--full:not(.a-product--dark):not(.a-product--myh) {
    background: linear-gradient(180deg, #fff 0%, var(--apple-surface) 100%);
}

.a-product--full:not(.a-product--dark):not(.a-product--myh)::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 280px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--apple-accent), transparent);
    box-shadow: 0 0 16px rgba(60, 180, 181, 0.4);
    z-index: 2;
}

.a-product--full:not(.a-product--dark):not(.a-product--myh) .a-product__title {
    color: var(--apple-text);
}

/* Hover — subtle neon ring around dark card */
.a-product--full.a-product--dark {
    transition: box-shadow 600ms;
}

.a-product--full.a-product--dark:hover {
    box-shadow: inset 0 0 80px rgba(60, 180, 181, 0.06);
}

.a-product--dark { background: var(--apple-text); color: #fff; }
.a-product--dark .a-product__title { color: #fff; }
.a-product--dark .a-product__desc { color: rgba(255,255,255,0.72); }
.a-product--dark .a-product__eyebrow { color: var(--apple-accent); }

.a-product__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
    min-height: 480px;
}

.a-product--reverse .a-product__inner {
    direction: rtl;
}
.a-product--reverse .a-product__inner > * { direction: ltr; }

.a-product__content {
    padding: clamp(48px, 6vw, 80px);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.a-product__eyebrow {
    font-size: 14px;
    font-weight: 600;
    color: var(--apple-accent);
    margin-bottom: 16px;
    letter-spacing: -0.005em;
}

.a-product__title {
    font-family: var(--font-display);
    font-size: clamp(32px, 3.5vw, 48px);
    font-weight: 600;
    line-height: 1.08;
    letter-spacing: -0.025em;
    color: var(--apple-text);
    margin: 0 0 16px;
    font-feature-settings: "ss01", "ss02";
}

.a-product__desc {
    font-size: 17px;
    line-height: 1.55;
    color: var(--apple-text-muted);
    margin: 0 0 28px;
    max-width: 460px;
}

.a-product__media {
    position: relative;
    overflow: hidden;
    background: var(--apple-surface);
    min-height: 480px;
}

.a-product__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 700ms ease-out;
}

.a-product:hover .a-product__media img {
    transform: scale(1.03);
}

@media (max-width: 900px) {
    .a-product__inner {
        grid-template-columns: 1fr;
        min-height: auto;
    }
    .a-product--reverse .a-product__inner { direction: ltr; }
    .a-product__media {
        min-height: 320px;
        order: -1;
    }
}

/* ============================================================
   MYH BRAND VARIANT
   Primary: #9D3831 (red-burgundy) · Secondary: #575756 (gray)
   ============================================================ */

:root {
    --myh-red: #9D3831;
    --myh-red-dark: #862C26;
    --myh-gray: #575756;
    --myh-gray-dark: #3F3F3E;
}

.a-product--myh {
    background: var(--myh-gray) !important;
    overflow: hidden;
    position: relative;
}

.a-product--myh::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle 500px at 85% 25%, rgba(157, 56, 49, 0.20), transparent 60%),
        radial-gradient(circle 400px at 15% 90%, rgba(0, 0, 0, 0.18), transparent 60%);
    pointer-events: none;
    z-index: 0;
}

.a-product--myh .a-product__content {
    position: relative;
    z-index: 1;
}

.a-product--myh .a-product__eyebrow {
    color: rgba(255, 255, 255, 0.85) !important;
}

.a-product--myh .a-product__title {
    color: #fff !important;
}

.a-product--myh .a-product__desc {
    color: rgba(255, 255, 255, 0.82) !important;
}

.a-product--myh .a-product__desc strong {
    color: #fff !important;
}

.a-product--myh .a-link {
    color: #fff !important;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.a-product--myh .a-link .chev {
    color: #fff;
}

.a-product--myh .a-link:hover {
    color: rgba(255, 255, 255, 0.8) !important;
}

/* MYH visual variant: red bg with image OR video */
.a-product__media--myh {
    background: var(--myh-red);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    position: relative;
    overflow: hidden;
    min-height: 480px;
}

.a-product__media--myh img {
    position: relative;
    z-index: 1;
    max-width: 280px;
    width: 100%;
    height: auto;
    object-fit: contain;
    padding: clamp(48px, 6vw, 80px);
    transition: transform 600ms cubic-bezier(0.16, 1, 0.3, 1);
}

.a-product--myh:hover .a-product__media--myh img {
    transform: scale(1.04);
}

/* Video — clean on red bg, luminosity blend tints to burgundy */
.a-product__media--myh video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
    display: block;
    mix-blend-mode: luminosity;
    opacity: 1;
}

/* ============================================================
   SSA — Savunma Sanayii Akademi partner card
   ============================================================ */

.a-product--ssa {
    display: block;
    text-decoration: none;
    color: inherit;
    background: var(--apple-surface) !important;
    border: 1px solid var(--apple-border);
    transition: transform 400ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 400ms;
    cursor: pointer;
}

.a-product--ssa:hover {
    transform: translateY(-4px);
    box-shadow: 0 24px 60px rgba(15, 23, 41, 0.08);
    color: inherit !important;
    text-decoration: none !important;
}

.a-product--ssa .a-product__title {
    color: var(--apple-text);
}

.a-product--ssa .a-product__desc {
    color: var(--apple-text-muted);
}

.a-product--ssa .a-link {
    color: var(--apple-accent) !important;
}

.a-product__media--ssa {
    background: #0F1729;
    background-image:
        linear-gradient(rgba(60, 180, 181, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(60, 180, 181, 0.04) 1px, transparent 1px);
    background-size: 40px 40px;
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: stretch;
    min-height: 480px;
}

.a-product__media--ssa svg {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    z-index: 1;
}

/* Cyber corner brackets on SSA media */
.a-product__media--ssa::before,
.a-product__media--ssa::after {
    content: '';
    position: absolute;
    width: 28px;
    height: 28px;
    pointer-events: none;
    z-index: 2;
}

.a-product__media--ssa::before {
    top: 24px;
    left: 24px;
    border-top: 1.5px solid var(--apple-accent);
    border-left: 1.5px solid var(--apple-accent);
    box-shadow: -2px -2px 10px rgba(60, 180, 181, 0.3);
}

.a-product__media--ssa::after {
    bottom: 24px;
    right: 24px;
    border-bottom: 1.5px solid var(--apple-accent);
    border-right: 1.5px solid var(--apple-accent);
    box-shadow: 2px 2px 10px rgba(60, 180, 181, 0.3);
}

@media (max-width: 900px) {
    .a-product__media--ssa { min-height: 280px; }
    .a-product__media--ssa::before,
    .a-product__media--ssa::after { width: 18px; height: 18px; }
    .a-product__media--ssa::before { top: 14px; left: 14px; }
    .a-product__media--ssa::after { bottom: 14px; right: 14px; }
}

/* MYH-branded pill button — bordo with white text */
.a-pill--myh {
    background: var(--myh-red) !important;
    color: #fff !important;
    box-shadow: 0 6px 20px rgba(157, 56, 49, 0.35);
}

.a-pill--myh:hover {
    background: var(--myh-red-dark) !important;
    color: #fff !important;
    opacity: 1;
    box-shadow: 0 8px 24px rgba(157, 56, 49, 0.45);
}

/* === APPLE STATS V2 (cleaner) === */

.a-stats {
    text-align: center;
    padding: 96px 0;
}

.a-stats__intro {
    font-size: clamp(28px, 3vw, 40px);
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--apple-text);
    max-width: 720px;
    margin: 0 auto 64px;
}

.a-stats__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 24px;
}

.a-stats__item .num {
    display: block;
    font-size: clamp(48px, 5vw, 72px);
    font-weight: 600;
    letter-spacing: -0.03em;
    line-height: 1;
    color: var(--apple-text);
    margin-bottom: 8px;
}

.a-stats__item .num .suf {
    color: var(--apple-accent);
    font-weight: 500;
}

.a-stats__item .lbl {
    font-size: 15px;
    color: var(--apple-text-muted);
    font-weight: 400;
}

@media (max-width: 768px) {
    .a-stats__grid { grid-template-columns: repeat(2, 1fr); gap: 48px 24px; }
}

/* === APPLE NEWS GRID === */

.a-news {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}

.a-news__item {
    text-decoration: none;
    color: inherit;
}

.a-news__media {
    aspect-ratio: 4/3;
    border-radius: 22px;
    overflow: hidden;
    background: var(--apple-surface);
    margin-bottom: 20px;
}

.a-news__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 500ms;
}

.a-news__item:hover .a-news__media img { transform: scale(1.04); }

.a-news__date {
    font-size: 14px;
    color: var(--apple-text-soft);
    font-weight: 400;
    margin-bottom: 6px;
}

.a-news__title {
    font-size: 19px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.015em;
    color: var(--apple-text);
    margin: 0 0 12px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (max-width: 900px) {
    .a-news { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
    .a-news { grid-template-columns: 1fr; }
}

/* === APPLE VALUES (smaller, refined) === */

.a-values {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.a-value {
    background: #fff;
    border-radius: 18px;
    padding: 28px 24px;
    text-decoration: none;
    color: inherit;
    transition: transform 250ms, box-shadow 250ms;
    display: block;
}

.a-value:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0,0,0,0.05);
}

.a-value__icon {
    width: 36px;
    height: 36px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.a-value__icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.a-value__title {
    font-size: 17px;
    font-weight: 600;
    color: var(--apple-text);
    margin: 0;
    letter-spacing: -0.01em;
}

@media (max-width: 900px) { .a-values { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .a-values { grid-template-columns: 1fr; } }

/* === APPLE SECTION HEADER (uniform) === */

.a-head {
    text-align: center;
    margin-bottom: 56px;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}

.a-head--left {
    text-align: left;
    margin-left: 0;
}

.a-head__title {
    font-family: var(--font-display);
    font-size: clamp(36px, 4.5vw, 56px);
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: -0.025em;
    color: var(--apple-text);
    margin: 0 0 12px;
    font-feature-settings: "ss01", "ss02";
}

.a-head__sub {
    font-size: clamp(17px, 1.4vw, 21px);
    line-height: 1.4;
    color: var(--apple-text-muted);
    margin: 0;
}

/* ============================================================
   APPLE FOOTER
   ============================================================ */

.a-footer {
    background: var(--apple-bg);
    padding: 80px 0 32px;
    border-top: 1px solid var(--apple-border);
    color: var(--apple-text-muted);
    font-size: 13px;
    line-height: 1.5;
}

body:not(.tet-2025) .a-footer {
    display: none !important;
}

.a-footer__brand-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 56px;
    border-bottom: 1px solid var(--apple-border);
    margin-bottom: 48px;
    gap: 24px;
    flex-wrap: wrap;
}

.a-footer__logo-link img {
    height: 40px;
    width: auto;
}

.a-footer__mail {
    font-size: 17px;
    font-weight: 400;
    color: var(--apple-accent);
}

.a-footer__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 200px;
    padding: 0 60px 56px 140px;
    border-bottom: 1px solid var(--apple-border);
    justify-items: start;
}

@media (max-width: 900px) {
    .a-footer__grid {
        padding: 0 0 40px;
        gap: 40px 32px;
    }
}

.a-footer__col {
    min-width: 0;
}

.a-footer__heading {
    font-size: 13px;
    font-weight: 600;
    color: var(--apple-text);
    margin: 0 0 16px;
    letter-spacing: -0.005em;
}

.a-footer__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.a-footer__list li {
    margin-bottom: 8px;
    color: var(--apple-text-muted);
    font-size: 13px;
    line-height: 1.5;
}

.a-footer__list a {
    color: var(--apple-text-muted) !important;
    text-decoration: none !important;
    transition: color 200ms;
    font-size: 13px;
}

.a-footer__list a:hover {
    color: var(--apple-text) !important;
}

.a-footer__bottom {
    padding-top: 32px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    color: var(--apple-text-soft);
    flex-wrap: wrap;
}

.a-footer__sep {
    color: var(--apple-text-soft);
}

@media (max-width: 900px) {
    .a-footer__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px 32px;
    }
}

@media (max-width: 560px) {
    .a-footer {
        padding: 56px 0 24px;
    }
    .a-footer__brand-row {
        flex-direction: column;
        align-items: flex-start;
        padding-bottom: 40px;
        margin-bottom: 32px;
    }
    .a-footer__grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px 24px;
    }
}

/* ============================================================
   APPLE PROSE OVERRIDE — WYSIWYG content (service body etc.)
   Refines the old .tet-prose to match Apple typography.
   ============================================================ */

body.tet-2025 .tet-prose {
    color: var(--apple-text-muted);
    font-size: clamp(17px, 1.4vw, 19px);
    line-height: 1.6;
    max-width: 780px;
    margin: 0 auto;
}

body.tet-2025 .tet-prose p {
    margin: 0 0 28px;
    color: var(--apple-text-muted);
    font-weight: 400;
}

body.tet-2025 .tet-prose p:last-child {
    margin-bottom: 0;
}

/* === AGGRESSIVE OVERRIDE for inline-styled WYSIWYG content === */
body.tet-2025 .tet-prose,
body.tet-2025 .tet-prose p,
body.tet-2025 .tet-prose div,
body.tet-2025 .tet-prose span,
body.tet-2025 .tet-prose li,
body.tet-2025 .tet-prose strong,
body.tet-2025 .tet-prose em,
body.tet-2025 .tet-prose b,
body.tet-2025 .tet-prose i,
body.tet-2025 .tet-prose a {
    font-family: var(--font-sans) !important;
    background-color: transparent !important;
}

body.tet-2025 .tet-prose p,
body.tet-2025 .tet-prose p[style],
body.tet-2025 .tet-prose p span[style] {
    color: var(--apple-text-muted) !important;
    font-size: clamp(17px, 1.4vw, 19px) !important;
    line-height: 1.6 !important;
    text-align: left !important;
    font-weight: 400 !important;
}

body.tet-2025 .tet-prose strong,
body.tet-2025 .tet-prose b {
    font-weight: 600 !important;
    color: var(--apple-text) !important;
}

/* Counter for feature-style headings */
body.tet-2025 .tet-prose {
    counter-reset: tet-feature;
}

/* ============================================================
   FEATURE BLOCKS — animated Apple-style cards (2-col grid)
   Each block = is-heading + following paragraphs (wrapped by JS)
   ============================================================ */

/* When prose has a feature grid, expand container fully */
body.tet-2025 .tet-prose.has-feature-grid {
    max-width: 1200px !important;
}

body.tet-2025 .tet-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin: 56px 0;
}

@media (max-width: 768px) {
    body.tet-2025 .tet-feature-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

/* If the last card is alone in its row (odd total), center it */
body.tet-2025 .tet-feature-grid .tet-feature-block:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    justify-self: center;
    width: calc((100% - 20px) / 2);
}

@media (max-width: 768px) {
    body.tet-2025 .tet-feature-grid .tet-feature-block:last-child:nth-child(odd) {
        width: 100%;
    }
}

body.tet-2025 .tet-prose .tet-feature-grid .tet-feature-block {
    margin: 0;
}

body.tet-2025 .tet-prose .tet-feature-block {
    counter-increment: tet-feature;
    position: relative;
    padding: clamp(48px, 6vw, 80px) clamp(32px, 5vw, 64px);
    margin: 24px 0;
    border-radius: 28px;
    background: var(--apple-surface);
    overflow: hidden;
    opacity: 0;
    transform: translateY(48px);
    transition:
        opacity 800ms cubic-bezier(0.16, 1, 0.3, 1),
        transform 800ms cubic-bezier(0.16, 1, 0.3, 1),
        box-shadow 500ms ease-out,
        background 500ms ease-out;
    cursor: default;
    border: 1px solid transparent;
}

body.tet-2025 .tet-prose .tet-feature-block.is-revealed {
    opacity: 1;
    transform: translateY(0);
}

body.tet-2025 .tet-prose .tet-feature-block:hover {
    background: #fff;
    box-shadow: 0 20px 60px rgba(15, 23, 41, 0.07);
    border-color: var(--apple-border);
    transform: translateY(-4px);
}

/* Glow that follows the mouse on each card */
body.tet-2025 .tet-prose .tet-feature-block::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(
        circle 400px at var(--mx, 50%) var(--my, 50%),
        rgba(60, 180, 181, 0.12),
        transparent 60%
    );
    opacity: 0;
    transition: opacity 400ms;
}

body.tet-2025 .tet-prose .tet-feature-block:hover::before {
    opacity: 1;
}

/* Floating number "01", "02", ... — smaller for 2-col grid */
body.tet-2025 .tet-prose .tet-feature-block::after {
    content: counter(tet-feature, decimal-leading-zero);
    position: absolute;
    top: -4px;
    right: 20px;
    font-size: clamp(60px, 7vw, 100px);
    font-weight: 800;
    line-height: 0.85;
    letter-spacing: -0.06em;
    color: transparent;
    -webkit-text-stroke: 1.5px rgba(60, 180, 181, 0.18);
    pointer-events: none;
    user-select: none;
    transition: -webkit-text-stroke 400ms, color 400ms;
}

body.tet-2025 .tet-prose .tet-feature-block:hover::after {
    -webkit-text-stroke: 1.5px rgba(60, 180, 181, 0.45);
}

/* Heading inside feature block — smaller for 2-col */
body.tet-2025 .tet-prose .tet-feature-block > p.is-heading {
    font-size: clamp(22px, 2.2vw, 28px) !important;
    font-weight: 600 !important;
    color: var(--apple-text) !important;
    letter-spacing: -0.02em !important;
    line-height: 1.2 !important;
    margin: 0 0 16px !important;
    padding-top: 0 !important;
    border-top: none !important;
    position: relative;
    text-align: left !important;
    z-index: 1;
    max-width: 85%;
    display: flex;
    align-items: center;
    gap: 12px;
}

/* SVG icon inside heading (replaces emoji) */
body.tet-2025 .tet-prose .tet-feature-block > p.is-heading .tet-feat-icon {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: rgba(60, 180, 181, 0.1);
    color: var(--apple-accent);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 400ms cubic-bezier(0.16, 1, 0.3, 1);
}

body.tet-2025 .tet-prose .tet-feature-block:hover .tet-feat-icon {
    background: var(--apple-accent);
    color: #fff;
    transform: scale(1.05);
}

body.tet-2025 .tet-prose .tet-feature-block > p.is-heading .tet-feat-icon svg {
    width: 18px;
    height: 18px;
}

body.tet-2025 .tet-prose .tet-feature-block > p.is-heading strong {
    font-weight: inherit !important;
    color: inherit !important;
    font-size: inherit !important;
}

/* Description paragraphs inside feature block */
body.tet-2025 .tet-prose .tet-feature-block > p:not(.is-heading) {
    position: relative;
    z-index: 1;
    max-width: 640px;
    margin: 0 0 14px !important;
    color: var(--apple-text-muted) !important;
}

body.tet-2025 .tet-prose .tet-feature-block > p:not(.is-heading):last-child {
    margin-bottom: 0 !important;
}

/* Standalone is-heading (not in a block, fallback) */
body.tet-2025 .tet-prose > p.is-heading {
    font-size: clamp(28px, 3vw, 36px) !important;
    font-weight: 600 !important;
    color: var(--apple-text) !important;
    letter-spacing: -0.025em !important;
    line-height: 1.15 !important;
    margin: 72px 0 16px !important;
    padding-top: 48px !important;
    border-top: 1px solid var(--apple-border) !important;
    position: relative;
    text-align: left !important;
}

body.tet-2025 .tet-prose > p.is-heading strong {
    font-weight: inherit !important;
    color: inherit !important;
    font-size: inherit !important;
}

body.tet-2025 .tet-prose > p.is-heading:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: none !important;
}

body.tet-2025 .tet-prose h1,
body.tet-2025 .tet-prose h2,
body.tet-2025 .tet-prose h3,
body.tet-2025 .tet-prose h4,
body.tet-2025 .tet-prose h5,
body.tet-2025 .tet-prose h6 {
    color: var(--apple-text);
    font-weight: 600;
    letter-spacing: -0.025em;
    line-height: 1.15;
    margin: 64px 0 16px;
}

body.tet-2025 .tet-prose h1 {
    font-size: clamp(40px, 5vw, 56px);
    letter-spacing: -0.03em;
    margin-top: 96px;
}

body.tet-2025 .tet-prose h2 {
    font-size: clamp(36px, 4vw, 48px);
    margin-top: 80px;
}

/* Feature-style h3: bigger, with top border separator and counter */
body.tet-2025 .tet-prose h3 {
    font-size: clamp(28px, 3vw, 36px);
    margin-top: 72px;
    margin-bottom: 16px;
    padding-top: 48px;
    border-top: 1px solid var(--apple-border);
    counter-increment: tet-feature;
    position: relative;
}

body.tet-2025 .tet-prose h3::before {
    content: counter(tet-feature, decimal-leading-zero);
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--apple-accent);
    letter-spacing: 0.12em;
    margin-bottom: 12px;
    line-height: 1;
}

body.tet-2025 .tet-prose h4 {
    font-size: 22px;
    margin-top: 48px;
}

body.tet-2025 .tet-prose h5 { font-size: 19px; }
body.tet-2025 .tet-prose h6 { font-size: 17px; }

/* First child of prose container — no top margin/border */
body.tet-2025 .tet-prose > :first-child {
    margin-top: 0;
}

body.tet-2025 .tet-prose > h3:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

body.tet-2025 .tet-prose strong,
body.tet-2025 .tet-prose b {
    color: var(--apple-text);
    font-weight: 600;
}

body.tet-2025 .tet-prose em,
body.tet-2025 .tet-prose i {
    color: var(--apple-text);
}

body.tet-2025 .tet-prose a {
    color: var(--apple-accent);
    text-decoration: none;
    border-bottom: 1px solid rgba(60, 180, 181, 0.3);
    transition: border-color 200ms;
}

body.tet-2025 .tet-prose a:hover {
    border-bottom-color: var(--apple-accent);
    color: var(--apple-accent-dark);
}

body.tet-2025 .tet-prose ul,
body.tet-2025 .tet-prose ol {
    margin: 0 0 28px;
    padding-left: 24px;
}

body.tet-2025 .tet-prose li {
    margin-bottom: 10px;
    line-height: 1.6;
}

body.tet-2025 .tet-prose ul li::marker {
    color: var(--apple-accent);
}

body.tet-2025 .tet-prose blockquote {
    border-left: 3px solid var(--apple-accent);
    padding: 4px 0 4px 24px;
    margin: 32px 0;
    font-style: normal;
    color: var(--apple-text);
    font-size: 1.05em;
}

body.tet-2025 .tet-prose img {
    border-radius: 18px;
    margin: 32px 0;
    max-width: 100%;
}

body.tet-2025 .tet-prose hr {
    border: 0;
    border-top: 1px solid var(--apple-border);
    margin: 56px 0;
}

body.tet-2025 .tet-prose table {
    width: 100%;
    border-collapse: collapse;
    margin: 32px 0;
    font-size: 16px;
}

body.tet-2025 .tet-prose th,
body.tet-2025 .tet-prose td {
    padding: 14px 18px;
    border-bottom: 1px solid var(--apple-border);
    text-align: left;
}

body.tet-2025 .tet-prose th {
    font-weight: 600;
    color: var(--apple-text);
    background: var(--apple-surface);
}

/* Inline code / pre */
body.tet-2025 .tet-prose code {
    background: var(--apple-surface);
    padding: 2px 8px;
    border-radius: 6px;
    font-size: 0.92em;
    color: var(--apple-text);
}

body.tet-2025 .tet-prose pre {
    background: var(--apple-surface);
    padding: 24px;
    border-radius: 14px;
    overflow-x: auto;
    margin: 32px 0;
}


/* ============================================================
   SERVICES — 3D character-select carousel (Metin2-style)
   ============================================================ */

.services-stage {
    position: relative;
    margin: 64px auto 0;
    height: 700px;
    perspective: 1800px;
    perspective-origin: 50% 50%;
    width: 100%;
    max-width: 1400px;
}

.services-stage__track {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
}

.service-3d {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 400px;
    height: 620px;
    margin-left: -200px;
    margin-top: -310px;
    border-radius: 28px;
    overflow: hidden;
    background: #0F1729;
    color: #fff;
    box-shadow:
        0 30px 80px rgba(15, 23, 41, 0.35),
        0 8px 20px rgba(15, 23, 41, 0.18);
    cursor: pointer;
    transform-style: preserve-3d;
    transition:
        transform 900ms cubic-bezier(0.16, 1, 0.3, 1),
        opacity 700ms cubic-bezier(0.16, 1, 0.3, 1),
        box-shadow 700ms cubic-bezier(0.16, 1, 0.3, 1),
        filter 700ms cubic-bezier(0.16, 1, 0.3, 1);
    will-change: transform, opacity;
    text-decoration: none;
    user-select: none;
}

/* Center / active card */
.service-3d.is-active {
    transform: translate3d(0, 0, 120px) rotateY(0deg) scale(1.04);
    z-index: 4;
    opacity: 1;
    box-shadow:
        0 60px 120px rgba(15, 23, 41, 0.45),
        0 24px 50px rgba(60, 180, 181, 0.18),
        0 0 0 1px rgba(60, 180, 181, 0.25);
    filter: brightness(1);
}

/* Left card */
.service-3d.is-prev {
    transform: translate3d(-340px, 0, -40px) rotateY(32deg) scale(0.88);
    z-index: 2;
    opacity: 0.78;
    filter: brightness(0.75) saturate(0.9);
}

/* Right card */
.service-3d.is-next {
    transform: translate3d(340px, 0, -40px) rotateY(-32deg) scale(0.88);
    z-index: 2;
    opacity: 0.78;
    filter: brightness(0.75) saturate(0.9);
}

/* If more than 3 cards: hidden state */
.service-3d.is-hidden {
    transform: translate3d(0, 0, -300px) scale(0.5);
    opacity: 0;
    z-index: 1;
    pointer-events: none;
}

/* Media — top portion of card */
.service-3d__media {
    position: relative;
    width: 100%;
    height: 48%;
    overflow: hidden;
    background: linear-gradient(135deg, #1D3354, #0F1729);
}

/* Floating tag — top-left over the media */
.service-3d__tag {
    position: absolute;
    top: 18px;
    left: 18px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px 6px 11px;
    background: rgba(15, 23, 41, 0.55);
    backdrop-filter: blur(14px) saturate(180%);
    -webkit-backdrop-filter: blur(14px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.02em;
    color: rgba(255, 255, 255, 0.92);
    z-index: 2;
}

.service-3d__tag .dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--apple-accent);
    box-shadow: 0 0 10px var(--apple-accent);
    flex-shrink: 0;
}

.service-3d.is-active .service-3d__tag .dot {
    animation: ctaPulse 2s ease-in-out infinite;
}

.service-3d__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.05);
    transition: transform 1200ms cubic-bezier(0.16, 1, 0.3, 1);
}

.service-3d.is-active .service-3d__media img {
    transform: scale(1.12);
}

.service-3d__media::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        rgba(15, 23, 41, 0) 50%,
        rgba(15, 23, 41, 0.85) 100%);
    pointer-events: none;
}

.service-3d__glow {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle 300px at 50% 40%, rgba(60, 180, 181, 0.25), transparent 60%);
    opacity: 0;
    transition: opacity 700ms;
    pointer-events: none;
    mix-blend-mode: screen;
}

.service-3d.is-active .service-3d__glow {
    opacity: 1;
}

/* Body */
.service-3d__body {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 30px 32px 32px;
    height: 52%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    background: linear-gradient(180deg, rgba(15, 23, 41, 0) 0%, #0F1729 18%);
}

.service-3d__title {
    font-family: var(--font-display);
    font-size: 28px;
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: #fff;
    margin: 0 0 14px;
}

.service-3d__desc {
    font-size: 14.5px;
    line-height: 1.62;
    color: rgba(255, 255, 255, 0.74);
    margin: 0 0 20px;
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;
    letter-spacing: -0.005em;
}

.service-3d__cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--apple-accent) !important;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none !important;
    transition: gap 300ms;
    align-self: flex-start;
}

.service-3d__cta .arrow {
    transition: transform 300ms;
}

.service-3d.is-active .service-3d__cta:hover .arrow {
    transform: translateX(4px);
}

/* Side cards: dim the CTA so it doesn't compete */
.service-3d:not(.is-active) .service-3d__cta {
    pointer-events: none;
    opacity: 0.6;
}

/* Shine sweep on active */
.service-3d__shine {
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg,
        transparent 30%,
        rgba(255, 255, 255, 0.07) 50%,
        transparent 70%);
    transform: translateX(-100%);
    pointer-events: none;
    opacity: 0;
}

.service-3d.is-active .service-3d__shine {
    animation: serviceShine 2.4s ease-in-out 0.6s;
}

@keyframes serviceShine {
    0%   { transform: translateX(-100%); opacity: 0; }
    20%  { opacity: 1; }
    100% { transform: translateX(100%); opacity: 0; }
}

/* Dots nav */
.services-stage__nav {
    position: absolute;
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 5;
}

.services-stage__dot {
    appearance: none;
    -webkit-appearance: none;
    background: rgba(15, 23, 41, 0.2);
    border: 1px solid rgba(15, 23, 41, 0.15);
    width: 28px;
    height: 6px;
    border-radius: 999px;
    padding: 0;
    cursor: pointer;
    transition: all 400ms cubic-bezier(0.16, 1, 0.3, 1);
}

.services-stage__dot.is-active {
    background: var(--apple-accent);
    border-color: var(--apple-accent);
    width: 44px;
    box-shadow: 0 0 12px rgba(60, 180, 181, 0.5);
}

/* Ambient stage lighting under cards */
.services-stage::before {
    content: '';
    position: absolute;
    bottom: -40px;
    left: 50%;
    transform: translateX(-50%);
    width: 600px;
    height: 80px;
    background: radial-gradient(ellipse, rgba(60, 180, 181, 0.18), transparent 70%);
    filter: blur(20px);
    pointer-events: none;
    z-index: 0;
}

/* Disable hover on side cards in active state */
.service-3d:not(.is-active) {
    pointer-events: auto;
}

/* Responsive */
@media (max-width: 1200px) {
    .services-stage { height: 660px; }
    .service-3d { width: 360px; height: 580px; margin-left: -180px; margin-top: -290px; }
    .service-3d.is-prev { transform: translate3d(-300px, 0, -40px) rotateY(32deg) scale(0.85); }
    .service-3d.is-next { transform: translate3d(300px, 0, -40px) rotateY(-32deg) scale(0.85); }
}

@media (max-width: 820px) {
    .services-stage {
        height: auto;
        perspective: none;
    }
    .services-stage__track {
        display: flex;
        flex-direction: column;
        gap: 24px;
        align-items: center;
    }
    .service-3d {
        position: relative;
        top: auto;
        left: auto;
        margin: 0;
        width: min(400px, 92vw);
        height: 560px;
        transform: none !important;
        opacity: 1 !important;
        filter: none !important;
    }
    .services-stage__nav { display: none; }
    .services-stage::before { display: none; }
}

/* ============================================================
   VIZYON / MISYON — custom SVG illustrations
   ============================================================ */

.a-product__media--vision,
.a-product__media--mission {
    position: relative;
    overflow: hidden;
    min-height: 460px;
    display: block;
    isolation: isolate;
}

.a-product__media--vision {
    background: linear-gradient(135deg, var(--apple-accent) 0%, var(--apple-accent-dark) 100%);
}

.a-product__media--mission {
    background: #0A1429;
}

.a-vis-svg,
.a-mis-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}

/* Overlaid title label */
.a-product__media-label {
    position: absolute;
    left: 32px;
    bottom: 28px;
    z-index: 2;
    font-family: var(--font-display);
    font-size: clamp(48px, 5.5vw, 84px);
    font-weight: 600;
    letter-spacing: -0.03em;
    line-height: 1;
    color: #FFFFFF;
    text-shadow: 0 4px 30px rgba(0, 0, 0, 0.25);
    pointer-events: none;
}

.a-product__media-label--light {
    color: #FFFFFF;
    text-shadow: 0 0 1px rgba(255, 255, 255, 0.4), 0 0 30px rgba(60, 180, 181, 0.3);
}

/* Subtle hover lift on the SVG */
.a-product__media--vision .a-vis-svg,
.a-product__media--mission .a-mis-svg {
    transition: transform 1200ms cubic-bezier(0.16, 1, 0.3, 1);
}

.a-product:hover .a-product__media--vision .a-vis-svg,
.a-product:hover .a-product__media--mission .a-mis-svg {
    transform: scale(1.04);
}

@media (max-width: 900px) {
    .a-product__media--vision,
    .a-product__media--mission {
        min-height: 280px;
    }
    .a-product__media-label {
        left: 20px;
        bottom: 18px;
    }
}

/* ============================================================
   ABOUT — centered editorial typography
   ============================================================ */

.a-about-editorial {
    padding-top: 32px;
}

.a-about-edi {
    max-width: 760px;
    margin: 0 auto;
    padding: 0 24px;
    text-align: center;
}

/* Meta line — small caps, tight tracking, centered */
.a-about-edi__meta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    font-size: 11.5px;
    font-weight: 500;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--apple-text-muted);
    margin-bottom: 32px;
}

.a-about-edi__meta .lbl {
    color: var(--apple-accent);
}

.a-about-edi__meta .sep {
    width: 28px;
    height: 1px;
    background: var(--apple-border);
}

.a-about-edi__meta .loc {
    color: var(--apple-text-muted);
}

/* Title — centered, large but restrained */
.a-about-edi__title {
    font-family: var(--font-display);
    font-size: clamp(40px, 4.5vw, 64px);
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: -0.03em;
    color: var(--apple-text);
    margin: 0 0 24px;
    text-align: center;
}

/* Thin centered divider under title */
.a-about-edi__title::after {
    content: '';
    display: block;
    width: 56px;
    height: 2px;
    margin: 28px auto 0;
    background: var(--apple-accent);
    border-radius: 2px;
}

/* Prose — centered text alignment */
.a-about-edi__prose {
    font-size: 17.5px;
    line-height: 1.78;
    color: var(--apple-text-muted);
    text-align: center;
    margin-top: 32px;
}

.a-about-edi__prose > *:first-child {
    margin-top: 0;
}

.a-about-edi__prose p {
    margin: 0 0 22px;
}

.a-about-edi__prose p:last-child {
    margin-bottom: 0;
}

/* Lead paragraph — first paragraph slightly larger/darker */
.a-about-edi__prose > p:first-of-type,
.a-about-edi__prose > div:first-of-type > p:first-of-type {
    font-size: clamp(18px, 1.4vw, 21px);
    line-height: 1.65;
    color: var(--apple-text);
    font-weight: 500;
    letter-spacing: -0.01em;
}

/* Signoff — centered minimal mark at the end */
.a-about-edi__sign {
    margin-top: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
}

.a-about-edi__sign .brand {
    font-family: var(--font-display);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.2em;
    color: var(--apple-accent);
    background: transparent !important;
    padding: 0;
}

.a-about-edi__sign .signoff {
    font-size: 12.5px;
    color: var(--apple-text-muted);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.a-about-edi__sign::before,
.a-about-edi__sign::after {
    content: '';
    width: 40px;
    height: 1px;
    background: var(--apple-border);
}

@media (max-width: 600px) {
    .a-about-edi__meta {
        flex-wrap: wrap;
        gap: 10px;
        justify-content: center;
    }
    .a-about-edi__meta .sep { display: none; }
    .a-about-edi__title { margin-bottom: 16px; }
    .a-about-edi__title::after { margin-top: 20px; }
    .a-about-edi__sign::before,
    .a-about-edi__sign::after { width: 24px; }
}

/* ============================================================
   SAVUNMA SANAYİİ AKADEMİ — embedded site card
   ============================================================ */

:root {
    --ssa-red:        #A52A2D;
    --ssa-red-dark:   #7E1F22;
    --ssa-red-deep:   #4C1214;
    --ssa-ink:        #0E0708;
    --ssa-paper:      #EFE9E2;
}

.a-product--ssa-edu {
    border-radius: 22px;
    overflow: hidden;
    background: #1A1115;
    color: #fff;
    box-shadow:
        0 30px 80px rgba(76, 18, 20, 0.18),
        0 6px 18px rgba(76, 18, 20, 0.10);
}

.a-product--ssa-edu .a-product__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 480px;
}

/* === LEFT: content === */
.a-product--ssa-edu .a-product__content {
    padding: clamp(48px, 5vw, 80px);
    background: #1A1115;
    background-image:
        linear-gradient(180deg, rgba(165, 42, 45, 0.08), transparent 60%),
        radial-gradient(circle 600px at 0% 100%, rgba(165, 42, 45, 0.12), transparent 60%);
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 18px;
    position: relative;
}

/* Top accent line — red border that runs across top edge */
.a-product--ssa-edu .a-product__content::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--ssa-red) 0%, var(--ssa-red-dark) 60%, transparent 100%);
}

.a-product--ssa-edu .a-product__title {
    font-family: var(--font-display);
    font-size: clamp(34px, 3.4vw, 48px);
    font-weight: 600;
    line-height: 1.06;
    letter-spacing: -0.02em;
    color: #fff;
    margin: 0;
}

.a-product--ssa-edu .a-product__desc {
    font-size: 15.5px;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.72);
    margin: 0;
    max-width: 56ch;
}

/* Eyebrow — single official authority line */
.a-ssa-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-size: 11.5px;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.92);
    max-width: 100%;
}

.a-ssa-eyebrow .dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--ssa-red);
    box-shadow: 0 0 10px rgba(165, 42, 45, 0.7);
    flex-shrink: 0;
}

.a-ssa-eyebrow .lbl {
    color: rgba(255, 255, 255, 0.92);
}

/* SSA pill button — red brand */
.a-pill--ssa {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 12px 22px 12px 14px;
    background: var(--ssa-red) !important;
    color: #fff !important;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none !important;
    box-shadow:
        0 6px 22px rgba(165, 42, 45, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.15);
    transition: all 320ms cubic-bezier(0.16, 1, 0.3, 1);
    border: 1px solid rgba(255, 255, 255, 0.12);
}

.a-pill--ssa__mark {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #fff;
    padding: 5px 4px;
    object-fit: contain;
    object-position: left center;
    flex-shrink: 0;
    /* show only the S monogram (left ~33% of horizontal lockup) */
    -o-object-position: -1px center;
}

.a-pill--ssa__txt {
    letter-spacing: -0.005em;
}

.a-pill--ssa__arrow {
    transition: transform 280ms;
    font-size: 1.1em;
    line-height: 1;
}

.a-pill--ssa:hover {
    background: var(--ssa-red-dark) !important;
    color: #fff !important;
    box-shadow:
        0 10px 30px rgba(165, 42, 45, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.18);
    transform: translateY(-1px);
}

.a-pill--ssa:hover .a-pill--ssa__arrow {
    transform: translateX(3px);
}

/* === RIGHT: media === */
.a-product__media--ssa-edu {
    position: relative;
    overflow: hidden;
    background: var(--ssa-red-deep);
    min-height: 480px;
    display: flex;
    align-items: center;
    justify-content: center;
    isolation: isolate;
}

/* Photo backdrop (training scene) */
.a-ssa-edu__photo {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    filter: grayscale(1) contrast(1.1) brightness(0.55);
    z-index: 0;
}

/* Red veil overlay — heavy duotone */
.a-ssa-edu__veil {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(135deg, rgba(165, 42, 45, 0.92) 0%, rgba(76, 18, 20, 0.96) 100%);
    mix-blend-mode: multiply;
    z-index: 1;
}

/* Decorative grid + corner brackets */
.a-ssa-edu__deco {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    pointer-events: none;
}

/* Centered logo plate block */
.a-ssa-edu__mark {
    position: relative;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 22px;
    text-align: center;
    color: #fff;
    padding: 24px;
    max-width: 100%;
}

/* Logo wrapper — no plate, just the mark floating */
.a-ssa-edu__plate {
    background: transparent;
    padding: 0;
    box-shadow: none;
    max-width: 380px;
    width: 80%;
    transition: transform 600ms cubic-bezier(0.16, 1, 0.3, 1);
}

.a-product--ssa-edu:hover .a-ssa-edu__plate {
    transform: translateY(-3px);
}

/* Recolor the red logo to white so it reads on the dark red background */
.a-ssa-edu__logo {
    display: block;
    width: 100%;
    height: auto;
    max-height: 110px;
    object-fit: contain;
    opacity: 0.95;
    filter: brightness(0) invert(1) drop-shadow(0 4px 22px rgba(0, 0, 0, 0.35));
    -webkit-filter: brightness(0) invert(1) drop-shadow(0 4px 22px rgba(0, 0, 0, 0.35));
}

.a-ssa-edu__rule {
    width: 56px;
    height: 1.5px;
    background: rgba(255, 255, 255, 0.4);
    margin: 0;
}

.a-ssa-edu__url {
    font-size: 12px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.75);
    font-weight: 500;
}

@media (max-width: 900px) {
    .a-product--ssa-edu .a-product__inner {
        grid-template-columns: 1fr;
    }
    .a-product--ssa-edu .a-product__content,
    .a-product__media--ssa-edu {
        min-height: auto;
    }
    .a-product__media--ssa-edu {
        min-height: 320px;
    }
    .a-ssa-edu__plate { max-width: 280px; }
    .a-ssa-edu__logo { max-height: 80px; }
    .a-ssa-eyebrow {
        flex-wrap: wrap;
        gap: 8px;
        letter-spacing: 0.1em;
    }
}