:root {
    --tnk-ref-color: #ff3c00;
    --tnk-ref-glow: #ff7a40;
    --tnk-ref-bg: #fff;
    --tnk-ref-text: #000;
    --tnk-ref-muted: #949494;
    --tnk-ref-cream: #f5f1eb;
}

.tnk-ref-wrap *,
.tnk-ref-wrap *::before,
.tnk-ref-wrap *::after {
    box-sizing: border-box;
}

.tnk-ref-wrap {
    font-family: 'Montserrat-Medium', 'montserrat-medium-en', sans-serif;
    color: var(--tnk-ref-text);
    line-height: 1.5;
}

.tnk-ref-services-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tnk-ref-service-tag {
    display: inline-block;
    padding: 6px 14px;
    border: 1.5px solid var(--tag-color, currentColor);
    border-radius: 50px;
    font-family: 'Montserrat-Medium', sans-serif;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    line-height: 1.4;
    color: var(--tag-color, #000);
    background: transparent;
    transition: all 0.4s ease;
    cursor: default;
}

.tnk-ref-service-tag:hover {
    background: var(--tag-color);
    color: #fff;
}

.tnk-ref-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 5%;
}

.tnk-ref-container--narrow {
    max-width: 960px;
}

.tnk-ref-h1 {
    font-family: 'Montserrat-Bold', sans-serif;
    font-size: clamp(40px, 6vw, 88px);
    line-height: 1.05;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    margin: 0;
}

.tnk-ref-h2 {
    font-family: 'Montserrat-Bold', sans-serif;
    font-size: clamp(28px, 4vw, 48px);
    line-height: 1.15;
    text-transform: uppercase;
    margin: 0 0 30px;
}

.tnk-ref-eyebrow {
    font-family: 'Montserrat-Medium', sans-serif;
    font-size: 13px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--tnk-ref-muted);
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.tnk-ref-eyebrow::before {
    content: '';
    width: 30px;
    height: 1.5px;
    background: var(--tnk-ref-color);
    display: inline-block;
}

.tnk-ref-fade-up {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}

.tnk-ref-fade-up.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.tnk-ref-wrap ::selection {
    background: var(--tnk-ref-color);
    color: #fff;
}

.tr-seal-card {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(120% 92% at 50% 8%, var(--tr-seal-bg-light, #1b3a5b) 0%, var(--tr-seal-bg, #0e2840) 64%);
}
.tr-seal {
    width: min(74%, 430px);
    height: auto;
    overflow: visible;
    color: rgba(239,244,248,.6);
}
.tr-seal-ring {
    fill: none;
    stroke: currentColor;
    stroke-width: 1;
    opacity: .55;
}
.tr-seal-text {
    font-family: var(--t-fb, 'DM Sans', sans-serif);
    font-size: 8.6px;
    font-weight: 500;
    letter-spacing: 2.6px;
    fill: currentColor;
    text-transform: uppercase;
    opacity: .85;
    dominant-baseline: central;
}
.tr-seal-rotor {
    transform-box: view-box;
    transform-origin: 100px 100px;
    animation: trSealSpin 55s linear infinite;
}
@keyframes trSealSpin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
.tr-seal-mark {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    transition: transform .5s cubic-bezier(.16,1,.3,1);
}
.tr-seal-mark-img,
.tr-seal-mark-svg {
    width: min(38%, 170px);
    height: auto;
    display: block;
    object-fit: contain;
}
.tr-seal-mark-svg svg {
    width: 100%;
    height: auto;
    display: block;
    color: rgba(239,244,248,.92);
    fill: currentColor;
}
.tr-seal-mark-initials {
    font-family: var(--t-fd, 'MB', sans-serif);
    font-size: clamp(28px, 7vw, 54px);
    letter-spacing: 2px;
    color: rgba(239,244,248,.92);
    line-height: 1;
}
@media (prefers-reduced-motion: reduce) {
    .tr-seal-rotor { animation: none !important; }
    .tr-seal-mark { transition: none !important; }
}

.tnk-ref-card__image--seal {
    background: var(--tr-seal-bg, #0e2840);
}
.tnk-ref-card__image--seal .tr-seal-card {
    aspect-ratio: auto;
    height: 100%;
    min-height: 100%;
}
.tnk-ref-card__image--seal .tr-seal {
    width: min(68%, 300px);
}

.tnk-ref-single .tr-seal-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 26px;
    min-width: 0;
}
.tnk-ref-single .tr-seal-card {
    width: min(100%, 460px);
    border-radius: 18px;
    box-shadow: 0 30px 70px -30px rgba(0,0,0,.65);
}
.tnk-ref-single .tr-seal-card:hover .tr-seal-rotor { animation-play-state: paused; }
.tnk-ref-single .tr-seal-caption {
    font-family: var(--t-fd, 'MB', sans-serif);
    font-size: 11px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(255,255,255,.45);
    margin: 0;
    text-align: center;
    overflow-wrap: anywhere;
}
@media (max-width: 560px) {
    .tnk-ref-single .tr-seal-card { width: 100%; border-radius: 14px; }
    .tnk-ref-single .tr-seal { width: 82%; }
}