/* Trabzon 112 V7 - all site styles */

            .mt20 {
                margin-top: 20px
            }

            :root {
                --navy: #102a43;
                --blue: #1f6f8b;
                --cyan: #61c0cf;
                --orange: #e87828;
                --purple: #8f6aa8;
                --ink: #183042;
                --muted: #607384;
                --paper: #f6f8fb;
                --white: #fff;
                --line: #dce4eb;
                --shadow: 0 18px 55px rgba(16,42,67,.14)
            }

            * {
                box-sizing: border-box
            }

            html,body {
                margin: 0;
                min-height: 100%;
                font-family: Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
                color: var(--ink);
                background: var(--paper);
                overflow-x: hidden
            }

            button,input {
                font: inherit
            }

            button {
                cursor: pointer
            }

            .hidden {
                display: none!important
            }

            body.welcome-active {
                height: 100vh;
                height: 100dvh;
                overflow: hidden
            }

            .app {
                min-height: 100vh
            }

            .topbar {
                height: 72px;
                padding: 0 clamp(18px,4vw,56px);
                display: flex;
                align-items: center;
                justify-content: space-between;
                background: rgba(255,255,255,.92);
                border-bottom: 1px solid var(--line);
                position: sticky;
                top: 0;
                z-index: 20;
                backdrop-filter: blur(14px)
            }

            .brand {
                display: flex;
                align-items: center;
                gap: 12px;
                font-weight: 820;
                letter-spacing: -.02em
            }

            .brand-logo {
                width: 46px;
                height: 46px;
                object-fit: contain
            }

            .brand small {
                display: block;
                font-weight: 600;
                color: var(--muted);
                letter-spacing: 0;
                font-size: 11px;
                margin-top: 2px
            }

            .top-actions {
                display: flex;
                gap: 9px
            }

            .ghost,.solid {
                border: 0;
                border-radius: 12px;
                padding: 10px 14px;
                font-weight: 750
            }

            .ghost {
                background: #eef3f7;
                color: var(--navy)
            }

            .solid {
                background: var(--navy);
                color: #fff
            }

            .welcome {
                min-height: calc(100vh - 72px);
                display: grid;
                place-items: center;
                padding: 36px 20px;
                position: relative;
                overflow: hidden;
                background: radial-gradient(circle at 18% 15%,rgba(97,192,207,.19),transparent 32%),radial-gradient(circle at 86% 78%,rgba(232,120,40,.14),transparent 31%),linear-gradient(145deg,#f9fbfd,#eef4f8)
            }

            .welcome:before {
                content: "";
                position: absolute;
                inset: auto -8vw -22vw auto;
                width: 55vw;
                height: 55vw;
                border: 1px solid rgba(31,111,139,.12);
                border-radius: 50%;
                box-shadow: 0 0 0 6vw rgba(31,111,139,.025),0 0 0 12vw rgba(31,111,139,.02)
            }

            .welcome-card {
                width: min(980px,100%);
                position: relative;
                z-index: 1;
                text-align: center
            }

            .eyebrow {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                padding: 8px 12px;
                border-radius: 999px;
                background: #e4f2f5;
                color: #17627a;
                font-size: 12px;
                font-weight: 800;
                letter-spacing: .08em;
                text-transform: uppercase
            }

            .pulse {
                width: 8px;
                height: 8px;
                border-radius: 50%;
                background: var(--orange);
                box-shadow: 0 0 0 5px rgba(232,120,40,.13)
            }

            h1 {
                font-size: clamp(36px,6vw,68px);
                letter-spacing: -.055em;
                line-height: 1.02;
                margin: 24px auto 16px;
                max-width: 980px;
                color: var(--navy)
            }

            .welcome-logo {
                width: clamp(92px,13vw,138px);
                height: clamp(92px,13vw,138px);
                object-fit: contain;
                filter: drop-shadow(0 10px 20px rgba(180,0,0,.12))
            }

            .welcome-prompt {
                font-size: 15px;
                font-weight: 800;
                color: var(--muted);
                text-transform: uppercase;
                letter-spacing: .08em;
                margin: 0 auto 25px
            }

            .audience-grid {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 18px;
                text-align: left
            }

            .audience-card {
                border: 1px solid rgba(16,42,67,.09);
                border-radius: 24px;
                padding: 26px;
                background: rgba(255,255,255,.92);
                box-shadow: var(--shadow);
                display: flex;
                align-items: center;
                gap: 20px;
                transition: .2s transform,.2s box-shadow
            }

            .audience-card:hover {
                transform: translateY(-4px);
                box-shadow: 0 24px 70px rgba(16,42,67,.19)
            }

            .audience-card.pediatric {
                border-top: 5px solid var(--orange)
            }

            .audience-card.adult {
                border-top: 5px solid var(--blue)
            }

            .audience-card.calculations {
                border-top: 5px solid var(--purple);
                grid-column: 1/-1
            }

            .audience-icon {
                width: 67px;
                height: 67px;
                flex: 0 0 auto;
                border-radius: 20px;
                display: grid;
                place-items: center;
                font-size: 31px
            }

            .adult .audience-icon {
                background: #e4f2f5
            }

            .pediatric .audience-icon {
                background: #fff0e6
            }

            .calculations .audience-icon {
                background: #f2ebf6
            }

            .audience-card h2 {
                margin: 0 0 6px;
                font-size: 25px;
                color: var(--navy)
            }

            .audience-card p {
                margin: 0;
                color: var(--muted);
                line-height: 1.45
            }

            .arrow {
                margin-left: auto;
                font-size: 25px;
                color: #7f94a5
            }

            .catalog {
                padding: 34px clamp(18px,4vw,56px) 70px
            }

            .catalog-head {
                max-width: 1300px;
                margin: 0 auto 25px;
                display: flex;
                gap: 22px;
                align-items: end;
                justify-content: space-between
            }

            .catalog h2 {
                font-size: clamp(30px,4vw,46px);
                letter-spacing: -.04em;
                margin: 0;
                color: var(--navy)
            }

            .catalog-sub {
                margin: 9px 0 0;
                color: var(--muted)
            }

            .search-wrap {
                min-width: min(410px,42vw);
                position: relative
            }

            .search {
                width: 100%;
                border: 1px solid var(--line);
                border-radius: 15px;
                padding: 14px 16px 14px 44px;
                background: #fff;
                outline: none;
                box-shadow: 0 8px 25px rgba(16,42,67,.06)
            }

            .search:focus {
                border-color: var(--cyan);
                box-shadow: 0 0 0 4px rgba(97,192,207,.18)
            }

            .search-icon {
                position: absolute;
                left: 16px;
                top: 50%;
                transform: translateY(-50%);
                color: #7b8c9a
            }

            .mobile-section-picker {
                display: none
            }

            .catalog-body {
                max-width: 1300px;
                margin: auto;
                display: grid;
                grid-template-columns: 235px 1fr;
                gap: 26px
            }

            .section-nav {
                position: sticky;
                top: 96px;
                align-self: start;
                display: grid;
                gap: 7px
            }

            .section-nav button {
                border: 0;
                background: transparent;
                border-radius: 12px;
                text-align: left;
                padding: 10px 12px;
                color: var(--muted);
                font-size: 13px;
                font-weight: 750
            }

            .section-nav button:hover,.section-nav button.active {
                background: #fff;
                color: var(--navy);
                box-shadow: 0 5px 18px rgba(16,42,67,.07)
            }

            .sections {
                display: grid;
                gap: 30px
            }

            .topic-section {
                scroll-margin-top: 100px
            }

            .topic-section h3 {
                display: flex;
                align-items: center;
                gap: 10px;
                font-size: 15px;
                letter-spacing: .04em;
                text-transform: uppercase;
                margin: 0 0 12px;
                color: var(--muted)
            }

            .topic-section h3:after {
                content: "";
                height: 1px;
                flex: 1;
                background: var(--line)
            }

            .topic-grid {
                display: grid;
                grid-template-columns: repeat(3,minmax(0,1fr));
                gap: 12px
            }

            .topic {
                border: 1px solid var(--line);
                background: #fff;
                border-radius: 17px;
                padding: 17px;
                text-align: left;
                min-height: 112px;
                display: flex;
                flex-direction: column;
                transition: .18s
            }

            .topic:hover {
                transform: translateY(-2px);
                border-color: #a8c4d0;
                box-shadow: 0 12px 30px rgba(16,42,67,.1)
            }

            .pediatric-theme .topic:hover {
                border-color: #efb083
            }

            .topic-title {
                font-weight: 790;
                line-height: 1.35;
                color: var(--navy)
            }

            .topic-meta {
                margin-top: auto;
                padding-top: 13px;
                color: var(--muted);
                font-size: 12px;
                display: flex;
                align-items: center;
                justify-content: space-between
            }

            .page-pill {
                border-radius: 999px;
                background: #edf4f7;
                padding: 5px 8px;
                font-weight: 750
            }

            .pediatric-theme .page-pill {
                background: #fff0e6;
                color: #a34b12
            }

            .empty {
                padding: 50px;
                border: 1px dashed #b8c6d0;
                border-radius: 18px;
                text-align: center;
                color: var(--muted)
            }

            .viewer {
                height: 100vh;
                background: #17222b;
                display: grid;
                grid-template-rows: 64px 1fr
            }

            .viewer-bar {
                display: flex;
                align-items: center;
                gap: 10px;
                padding: 8px 15px;
                color: #fff;
                background: #0d1820;
                border-bottom: 1px solid #263944
            }

            .viewer-title {
                min-width: 0;
                flex: 1
            }

            .viewer-title strong {
                display: block;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis
            }

            .viewer-title small {
                color: #9fb2c1
            }

            .viewer button {
                border: 0;
                color: #fff;
                background: #263944;
                border-radius: 10px;
                padding: 10px 12px;
                font-weight: 750
            }

            .viewer button:hover {
                background: #344c59
            }

            .viewer button:disabled {
                opacity: .38;
                cursor: not-allowed
            }

            .pdf-frame {
                width: 100%;
                height: 100%;
                border: 0;
                background: #e8edf1
            }

            .loading {
                position: absolute;
                inset: 64px 0 0;
                display: grid;
                place-items: center;
                color: #fff;
                background: #17222b;
                z-index: 3
            }

            .spinner {
                width: 38px;
                height: 38px;
                border: 3px solid #40525e;
                border-top-color: var(--cyan);
                border-radius: 50%;
                animation: spin .8s linear infinite;
                margin: auto auto 14px
            }

            @keyframes spin {
                to {
                    transform: rotate(360deg)
                }
            }

            .modal {
                position: fixed;
                inset: 0;
                z-index: 50;
                background: rgba(7,20,29,.67);
                backdrop-filter: blur(7px);
                display: grid;
                place-items: center;
                padding: 18px
            }

            .modal-card {
                width: min(680px,100%);
                max-height: 92vh;
                overflow: auto;
                background: #fff;
                border-radius: 24px;
                box-shadow: 0 30px 100px rgba(0,0,0,.35)
            }

            .modal-head {
                padding: 23px 25px 17px;
                border-bottom: 1px solid var(--line);
                display: flex;
                justify-content: space-between;
                gap: 16px
            }

            .modal-head h2 {
                margin: 0;
                color: var(--navy)
            }

            .close {
                border: 0;
                width: 36px;
                height: 36px;
                border-radius: 10px;
                background: #edf2f5;
                font-size: 20px
            }

            .modal-body {
                padding: 22px 25px 26px
            }

            .notice {
                padding: 13px 15px;
                border-radius: 13px;
                background: #fff4e9;
                color: #8b420f;
                font-size: 13px;
                line-height: 1.45;
                margin-bottom: 18px;
                border-left: 4px solid var(--orange)
            }

            .form-grid {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 14px
            }

            .field label {
                display: block;
                font-size: 12px;
                font-weight: 800;
                color: var(--muted);
                margin: 0 0 6px
            }

            .field input {
                width: 100%;
                border: 1px solid var(--line);
                border-radius: 12px;
                padding: 12px;
                outline: none
            }

            .field input:focus {
                border-color: var(--orange);
                box-shadow: 0 0 0 3px rgba(232,120,40,.13)
            }

            .calc-actions {
                display: flex;
                gap: 10px;
                margin: 18px 0
            }

            .result {
                border-radius: 16px;
                background: linear-gradient(145deg,#eff8fa,#f7fbfc);
                border: 1px solid #cbe3e8;
                padding: 18px
            }

            .result-grid {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 11px
            }

            .result-item {
                background: #fff;
                border-radius: 12px;
                padding: 13px
            }

            .result-item span {
                display: block;
                font-size: 11px;
                color: var(--muted);
                font-weight: 800;
                text-transform: uppercase;
                letter-spacing: .05em
            }

            .result-item strong {
                display: block;
                font-size: 24px;
                color: var(--navy);
                margin-top: 4px
            }

            .formula {
                font-size: 12px;
                color: var(--muted);
                margin: 12px 0 0;
                line-height: 1.5
            }

            .footer-note {
                text-align: center;
                color: #748695;
                font-size: 12px;
                margin-top: 34px
            }

            .calc-page {
                padding: 34px clamp(18px,4vw,56px) 70px;
                min-height: calc(100vh - 72px);
                background: radial-gradient(circle at 92% 8%,rgba(143,106,168,.13),transparent 28%),var(--paper)
            }

            .calc-shell {
                max-width: 1180px;
                margin: auto
            }

            .calc-hero h1 {
                font-size: clamp(34px,5vw,54px);
                margin: 0 0 9px
            }

            .calc-hero p {
                margin: 0;
                color: var(--muted);
                line-height: 1.55
            }

            .patient-card {
                margin: 24px 0 18px;
                background: #fff;
                border: 1px solid var(--line);
                border-radius: 20px;
                padding: 20px;
                box-shadow: 0 12px 35px rgba(16,42,67,.07)
            }

            .patient-grid {
                display: grid;
                grid-template-columns: 1fr 1.3fr;
                gap: 14px
            }

            .field select {
                width: 100%;
                border: 1px solid var(--line);
                border-radius: 12px;
                padding: 12px;
                background: #fff;
                outline: none
            }

            .field select:focus {
                border-color: var(--purple);
                box-shadow: 0 0 0 3px rgba(143,106,168,.13)
            }

            .calc-tabs {
                display: flex;
                gap: 8px;
                margin: 0 0 16px;
                overflow: auto;
                -webkit-overflow-scrolling: touch
            }

            .calc-tab {
                border: 1px solid var(--line);
                background: #fff;
                color: var(--muted);
                border-radius: 999px;
                padding: 10px 15px;
                font-weight: 800;
                white-space: nowrap
            }

            .calc-tab.active {
                background: var(--purple);
                border-color: var(--purple);
                color: #fff
            }

            .calc-panel {
                background: #fff;
                border: 1px solid var(--line);
                border-radius: 20px;
                padding: 22px;
                box-shadow: 0 12px 35px rgba(16,42,67,.07)
            }

            .calc-panel h2 {
                margin: 0 0 6px;
                color: var(--navy)
            }

            .panel-sub {
                color: var(--muted);
                font-size: 13px;
                margin-bottom: 18px
            }

            .drug-grid {
                display: grid;
                grid-template-columns: 2fr 1fr;
                gap: 14px;
                align-items: end
            }

            .clinical-result {
                margin-top: 18px;
                border: 1px solid #d8c9e2;
                background: linear-gradient(145deg,#faf7fc,#f2ebf6);
                border-radius: 18px;
                padding: 19px
            }

            .clinical-result h3 {
                margin: 0 0 13px;
                color: var(--navy)
            }

            .dose-big {
                font-size: clamp(28px,5vw,42px);
                font-weight: 860;
                letter-spacing: -.035em;
                color: #69447f
            }

            .result-details {
                display: grid;
                grid-template-columns: repeat(3,1fr);
                gap: 10px;
                margin-top: 14px
            }

            .detail {
                background: #fff;
                border-radius: 12px;
                padding: 12px
            }

            .detail span {
                display: block;
                color: var(--muted);
                font-size: 11px;
                font-weight: 800;
                text-transform: uppercase
            }

            .detail strong,.detail .source-links {
                display: block;
                margin-top: 4px;
                color: var(--navy)
            }

            .source-links {
                display: flex!important;
                flex-wrap: wrap;
                gap: 6px
            }

            .source-label {
                width: 100%;
                font-size: 12px;
                line-height: 1.35
            }

            .source-link {
                border: 1px solid #bca6cc;
                background: #f5eff8;
                color: #69447f;
                border-radius: 9px;
                padding: 7px 9px;
                font-size: 12px;
                font-weight: 850;
                cursor: pointer
            }

            .source-link:hover {
                background: #eadff0
            }

            .airway-grid {
                display: grid;
                grid-template-columns: repeat(2,1fr);
                gap: 14px
            }

            .airway-card {
                border: 1px solid var(--line);
                border-radius: 16px;
                padding: 17px;
                background: #fbfcfd
            }

            .airway-card h3 {
                margin: 0 0 12px;
                color: var(--navy)
            }

            .airway-value {
                font-size: 30px;
                font-weight: 850;
                color: #69447f
            }

            .mini-note {
                font-size: 12px;
                color: var(--muted);
                line-height: 1.5;
                margin-top: 9px
            }

            .source-note {
                font-size: 12px;
                color: var(--muted);
                line-height: 1.55;
                margin-top: 14px;
                padding-top: 13px;
                border-top: 1px solid rgba(143,106,168,.22)
            }

            .source-note .source-link {
                margin-top: 8px
            }

            .warning-result {
                color: #9a3412;
                background: #fff5ed;
                border: 1px solid #fdba74;
                border-radius: 12px;
                padding: 12px;
                margin-top: 12px;
                font-weight: 700
            }

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

            .vent-single {
                grid-template-columns: minmax(220px,420px)
            }

            .vent-result-grid {
                display: grid;
                grid-template-columns: repeat(4,1fr);
                gap: 11px
            }

            .vent-result-card {
                background: #fff;
                border: 1px solid rgba(143,106,168,.2);
                border-radius: 14px;
                padding: 14px
            }

            .vent-result-card span {
                display: block;
                color: var(--muted);
                font-size: 11px;
                font-weight: 800;
                text-transform: uppercase
            }

            .vent-result-card strong {
                display: block;
                color: #69447f;
                font-size: 24px;
                margin-top: 5px
            }

            @media(max-width: 960px) {
                .topic-grid {
                    grid-template-columns:repeat(2,minmax(0,1fr))
                }

                .catalog-body {
                    grid-template-columns: 1fr
                }

                .section-nav {
                    position: static;
                    display: flex;
                    overflow: auto;
                    padding-bottom: 5px
                }

                .section-nav button {
                    white-space: nowrap;
                    background: #fff;
                    border: 1px solid var(--line)
                }

                .catalog-head {
                    align-items: stretch;
                    flex-direction: column
                }

                .search-wrap {
                    min-width: 0;
                    width: 100%
                }

                .result-details,.vent-result-grid {
                    grid-template-columns: 1fr 1fr
                }

                .patient-grid {
                    grid-template-columns: 1fr 1fr
                }

                .patient-grid .weight-field {
                    grid-column: 1/-1
                }

                .vent-grid {
                    grid-template-columns: 1fr 1fr
                }
            }

            @media(max-width: 680px) {
                .topbar {
                    height:64px;
                    padding: 0 10px
                }

                .brand-logo {
                    width: 42px;
                    height: 42px
                }

                .brand-text {
                    font-size: 11px;
                    max-width: 155px;
                    line-height: 1.15
                }

                .brand small {
                    display: none
                }

                .welcome {
                    min-height: calc(100vh - 64px);
                    padding: 22px 12px
                }

                .welcome-card h1 {
                    font-size: clamp(29px,9vw,40px);
                    margin-top: 15px
                }

                .welcome-logo {
                    width: 88px;
                    height: 88px
                }

                .audience-grid {
                    grid-template-columns: 1fr
                }

                .audience-card,.audience-card.calculations {
                    padding: 17px;
                    grid-column: auto;
                    border-radius: 18px;
                    gap: 13px
                }

                .audience-icon {
                    width: 52px;
                    height: 52px;
                    border-radius: 15px;
                    font-size: 24px
                }

                .audience-card h2 {
                    font-size: 20px
                }

                .audience-card p {
                    font-size: 13px
                }

                .catalog,.calc-page {
                    padding: 22px 12px 50px
                }

                .topic-grid {
                    grid-template-columns: 1fr
                }

                .top-actions .download-label {
                    display: none
                }

                .top-actions {
                    gap: 5px
                }

                .ghost,.solid {
                    padding: 9px 10px;
                    font-size: 12px
                }

                .viewer {
                    grid-template-rows: 58px 1fr
                }

                .viewer-bar {
                    padding: 6px 8px
                }

                .viewer-title small {
                    display: none
                }

                .viewer button {
                    padding: 9px
                }

                .form-grid,.result-grid,.patient-grid,.drug-grid,.airway-grid,.vent-grid,.vent-result-grid {
                    grid-template-columns: 1fr
                }

                .patient-grid .weight-field {
                    grid-column: auto
                }

                .calc-panel {
                    padding: 16px;
                    border-radius: 16px
                }

                .modal-body,.modal-head {
                    padding-left: 18px;
                    padding-right: 18px
                }
            }

            @media(max-width: 680px) and (max-height:760px) {
                body.welcome-active .topbar {
                    height:56px
                }

                body.welcome-active .brand-logo {
                    width: 36px;
                    height: 36px
                }

                body.welcome-active .brand-text {
                    max-width: 145px
                }

                body.welcome-active .welcome {
                    height: calc(100dvh - 56px);
                    min-height: 0;
                    padding: 8px 10px
                }

                body.welcome-active .welcome-card {
                    display: flex;
                    min-height: 0;
                    height: 100%;
                    flex-direction: column;
                    justify-content: center
                }

                body.welcome-active .welcome-logo {
                    width: 54px;
                    height: 54px;
                    align-self: center
                }

                body.welcome-active .welcome-card h1 {
                    font-size: clamp(22px,7vw,28px);
                    line-height: 1.04;
                    margin: 6px auto 5px
                }

                body.welcome-active .welcome-prompt {
                    font-size: 10px;
                    margin: 0 auto 8px
                }

                body.welcome-active .audience-grid {
                    gap: 7px
                }

                body.welcome-active .audience-card,body.welcome-active .audience-card.calculations {
                    min-height: 0;
                    padding: 9px 11px;
                    border-radius: 14px;
                    gap: 10px;
                    border-top-width: 3px
                }

                body.welcome-active .audience-icon {
                    width: 42px;
                    height: 42px;
                    border-radius: 12px;
                    font-size: 20px
                }

                body.welcome-active .audience-card h2 {
                    font-size: 17px;
                    margin-bottom: 2px
                }

                body.welcome-active .audience-card p {
                    font-size: 11px;
                    line-height: 1.25
                }

                body.welcome-active .arrow {
                    font-size: 19px
                }
            }

            @media(min-width: 681px) and (max-height:760px) {
                body.welcome-active .topbar {
                    height:64px
                }

                body.welcome-active .brand-logo {
                    width: 42px;
                    height: 42px
                }

                body.welcome-active .welcome {
                    height: calc(100dvh - 64px);
                    min-height: 0;
                    padding: 10px 20px
                }

                body.welcome-active .welcome-logo {
                    width: 70px;
                    height: 70px
                }

                body.welcome-active .welcome-card h1 {
                    font-size: clamp(32px,4vw,46px);
                    margin: 8px auto 6px
                }

                body.welcome-active .welcome-prompt {
                    margin-bottom: 10px
                }

                body.welcome-active .audience-grid {
                    gap: 10px
                }

                body.welcome-active .audience-card,body.welcome-active .audience-card.calculations {
                    padding: 14px 18px;
                    border-radius: 18px;
                    gap: 14px
                }

                body.welcome-active .audience-icon {
                    width: 54px;
                    height: 54px;
                    border-radius: 16px;
                    font-size: 25px
                }

                body.welcome-active .audience-card h2 {
                    font-size: 21px
                }

                body.welcome-active .audience-card p {
                    font-size: 13px
                }
            }

            @media(max-width: 380px) {
                .brand-text {
                    display:none
                }

                .viewer-bar {
                    gap: 5px
                }

                .viewer button {
                    padding: 8px 7px;
                    font-size: 12px
                }

                .viewer-title strong {
                    font-size: 12px
                }

                .result-item strong,.detail strong {
                    overflow-wrap: anywhere
                }
            }

            @media(max-width: 960px) {
                .mobile-section-picker {
                    display:block;
                    max-width: 1300px;
                    margin: 0 auto 16px
                }

                .mobile-section-picker label {
                    display: block;
                    margin: 0 0 6px;
                    color: var(--muted);
                    font-size: 12px;
                    font-weight: 800
                }

                .mobile-section-picker select {
                    width: 100%;
                    appearance: none;
                    border: 1px solid var(--line);
                    border-radius: 14px;
                    padding: 13px 42px 13px 14px;
                    background: #fff;
                    color: var(--navy);
                    font-weight: 800;
                    box-shadow: 0 8px 24px rgba(16,42,67,.07);
                    background-image: linear-gradient(45deg,transparent 50%,var(--navy) 50%),linear-gradient(135deg,var(--navy) 50%,transparent 50%);
                    background-position: calc(100% - 19px) 52%,calc(100% - 13px) 52%;
                    background-size: 6px 6px,6px 6px;
                    background-repeat: no-repeat
                }

                .section-nav {
                    display: none
                }

                .patient-grid .weight-field {
                    grid-column: auto
                }
            }

            @media(max-width: 680px) {
                .calc-tabs {
                    display:grid;
                    grid-template-columns: repeat(3,1fr);
                    overflow: visible
                }

                .calc-tab {
                    white-space: normal;
                    min-height: 44px;
                    padding: 8px 6px;
                    font-size: 12px
                }

                .result-details {
                    grid-template-columns: 1fr
                }

                .viewer {
                    height: 100vh;
                    height: 100dvh;
                    grid-template-rows: 96px minmax(0,1fr)
                }

                .viewer-bar {
                    height: 96px;
                    padding: 6px 8px;
                    gap: 6px;
                    display: grid;
                    grid-template-columns: minmax(0,1fr) 44px 44px 44px;
                    grid-template-rows: 38px 44px;
                    grid-template-areas: "title title title title" "back prev next open"
                }

                .viewer-title {
                    grid-area: title;
                    text-align: center;
                    padding: 0 8px
                }

                .viewer-title strong {
                    font-size: 13px
                }

                .viewer-title small {
                    display: none
                }

                #backBtn {
                    grid-area: back;
                    text-align: left;
                    padding-left: 13px
                }

                #prevPage {
                    grid-area: prev
                }

                #nextPage {
                    grid-area: next
                }

                #openPdf {
                    grid-area: open
                }

                .viewer button {
                    min-width: 44px;
                    min-height: 44px;
                    padding: 0;
                    border: 1px solid #38505e;
                    background: #20343f;
                    border-radius: 12px;
                    font-size: 19px
                }

                .viewer #backBtn {
                    font-size: 13px
                }

                .loading {
                    inset: 96px 0 0
                }
            }
        
/* =========================================================
   TRABZON 112 — YENİ TASARIM
   İşlevsel yapı korunur, görsel kimlik tamamen yenilenmiştir.
   ========================================================= */

:root{
  --t-bg:#eef3f7;
  --t-surface:#ffffff;
  --t-surface-2:#f7fafc;
  --t-ink:#102331;
  --t-muted:#60717e;
  --t-line:#d9e3e9;
  --t-primary:#0b6574;
  --t-primary-dark:#084b57;
  --t-accent:#e29b35;
  --t-accent-soft:#fff4df;
  --t-shadow:0 12px 34px rgba(16,35,49,.09);
  --t-radius:18px;
}

/* Genel */
html{background:var(--t-bg)}
body{
  margin:0;
  background:
    radial-gradient(circle at 85% 0%, rgba(11,101,116,.10), transparent 28rem),
    var(--t-bg);
  color:var(--t-ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
button,input,select{font:inherit}
button{transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease}
button:active{transform:translateY(1px)}
.hidden{display:none!important}

/* Üst bar — eski tasarımdan farklı, ince ve yatay */
.topbar{
  position:sticky!important;
  top:0;
  z-index:50;
  min-height:72px!important;
  padding:0 28px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:20px!important;
  background:rgba(255,255,255,.94)!important;
  border-bottom:1px solid var(--t-line)!important;
  box-shadow:0 4px 18px rgba(16,35,49,.05)!important;
  backdrop-filter:blur(14px);
}
.brand{display:flex!important;align-items:center!important;gap:13px!important}
.brand-logo{
  width:43px!important;
  height:43px!important;
  object-fit:contain!important;
  padding:6px!important;
  box-sizing:border-box;
  border:1px solid var(--t-line);
  border-radius:12px!important;
  background:#fff!important;
}
.brand-text{
  color:var(--t-ink)!important;
  font-size:15px!important;
  font-weight:750!important;
  letter-spacing:-.01em;
}
.brand-text small{
  display:block!important;
  margin-top:2px!important;
  color:var(--t-muted)!important;
  font-size:11px!important;
  font-weight:500!important;
}
.top-actions{display:flex!important;gap:8px!important}
.top-actions button,
.ghost,.solid{
  border-radius:11px!important;
  min-height:40px;
  padding:9px 14px!important;
  font-weight:700!important;
}
.ghost{
  background:#fff!important;
  color:var(--t-primary)!important;
  border:1px solid var(--t-line)!important;
}
.solid{
  background:var(--t-primary)!important;
  color:#fff!important;
  border:1px solid var(--t-primary)!important;
  box-shadow:0 5px 14px rgba(11,101,116,.18)!important;
}
.solid:hover{background:var(--t-primary-dark)!important}
.ghost:hover{border-color:#b8cbd3!important;background:var(--t-surface-2)!important}

/* Ana ekran */
.welcome{
  min-height:calc(100svh - 72px)!important;
  padding:48px 28px 56px!important;
  box-sizing:border-box;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.welcome-card{
  width:min(1120px,100%)!important;
  margin:0 auto!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.hero-entry{
  display:grid!important;
  grid-template-columns:minmax(280px,.72fr) minmax(560px,1.28fr)!important;
  gap:42px!important;
  align-items:center!important;
}
.hero-entry:before{
  content:"TRABZON 112";
  display:block;
  grid-column:1;
  grid-row:1;
  align-self:end;
  width:max-content;
  padding:7px 11px;
  margin-bottom:-26px;
  border-radius:999px;
  background:var(--t-accent-soft);
  color:#9a641d;
  border:1px solid #f1d7a9;
  font-size:11px;
  font-weight:850;
  letter-spacing:.12em;
}
.local-chip{
  display:none!important;
}
.welcome-prompt{
  grid-column:1;
  grid-row:1;
  margin:0!important;
  padding-top:22px;
  color:var(--t-ink)!important;
  font-size:clamp(34px,4.3vw,60px)!important;
  line-height:1.02!important;
  letter-spacing:-.055em!important;
  font-weight:850!important;
  text-align:left!important;
}
.welcome-prompt:after{
  content:"112 acil sağlık algoritmalarına hızlı erişim";
  display:block;
  max-width:390px;
  margin-top:18px;
  color:var(--t-muted);
  font-size:15px;
  line-height:1.65;
  letter-spacing:0;
  font-weight:500;
}
.audience-grid{
  grid-column:2;
  grid-row:1;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:14px!important;
  margin:0!important;
}
.audience-card{
  position:relative!important;
  min-height:170px!important;
  padding:24px!important;
  display:flex!important;
  align-items:flex-start!important;
  gap:15px!important;
  text-align:left!important;
  border:1px solid var(--t-line)!important;
  border-radius:var(--t-radius)!important;
  background:var(--t-surface)!important;
  color:var(--t-ink)!important;
  box-shadow:var(--t-shadow)!important;
  overflow:hidden;
}
.audience-card:before{
  content:"";
  position:absolute;
  width:90px;height:90px;
  right:-28px;bottom:-32px;
  border-radius:50%;
  background:rgba(11,101,116,.07);
}
.audience-card:hover{
  transform:translateY(-4px);
  border-color:#b6ccd3!important;
  box-shadow:0 18px 42px rgba(16,35,49,.13)!important;
}
.audience-card.calculations{
  grid-column:1 / -1;
  min-height:125px!important;
  background:linear-gradient(135deg,#0b6574,#084b57)!important;
  color:#fff!important;
  border-color:#0b6574!important;
}
.audience-card.calculations:before{background:rgba(255,255,255,.10)}
.audience-icon{
  width:48px!important;height:48px!important;
  flex:0 0 48px;
  display:grid!important;
  place-items:center!important;
  border-radius:14px!important;
  background:#e9f3f5!important;
  color:var(--t-primary)!important;
}
.calculations .audience-icon{
  background:rgba(255,255,255,.13)!important;
  color:#fff!important;
}
.audience-card h2{
  margin:3px 0 6px!important;
  font-size:18px!important;
  line-height:1.15!important;
  letter-spacing:-.025em;
}
.audience-card p{
  margin:0!important;
  max-width:300px;
  color:var(--t-muted)!important;
  font-size:13px!important;
  line-height:1.55!important;
}
.calculations p{color:rgba(255,255,255,.76)!important}
.arrow{
  position:absolute!important;
  right:18px!important;
  top:20px!important;
  font-size:24px!important;
  color:#8ba0aa!important;
}
.calculations .arrow{color:rgba(255,255,255,.72)!important}
.source-disclaimer{
  grid-column:1;
  grid-row:1;
  align-self:end;
  max-width:390px;
  margin-top:255px!important;
  padding-top:18px!important;
  border-top:1px solid var(--t-line)!important;
  color:var(--t-muted)!important;
  font-size:11px!important;
  line-height:1.65!important;
  text-align:left!important;
}

/* Katalog */
.catalog{
  width:min(1180px,calc(100% - 56px))!important;
  margin:34px auto 60px!important;
  padding:0!important;
}
.catalog-head{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:24px!important;
  margin-bottom:22px!important;
  padding-bottom:20px!important;
  border-bottom:1px solid var(--t-line)!important;
}
.catalog-head h2{
  margin:0!important;
  color:var(--t-ink)!important;
  font-size:30px!important;
  letter-spacing:-.04em!important;
}
.catalog-sub{margin:7px 0 0!important;color:var(--t-muted)!important}
.search-wrap{
  width:min(360px,100%)!important;
  border:1px solid var(--t-line)!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:none!important;
}
.search{
  height:44px!important;
  color:var(--t-ink)!important;
  background:transparent!important;
}
.catalog-body{
  display:grid!important;
  grid-template-columns:220px 1fr!important;
  gap:22px!important;
}
.section-nav{
  position:sticky;
  top:96px;
  align-self:start;
  padding:10px!important;
  background:#fff!important;
  border:1px solid var(--t-line)!important;
  border-radius:16px!important;
  box-shadow:0 6px 22px rgba(16,35,49,.05)!important;
}
.section-nav button{
  width:100%;
  margin:2px 0!important;
  padding:10px 11px!important;
  border-radius:9px!important;
  border:0!important;
  background:transparent!important;
  color:var(--t-muted)!important;
  text-align:left!important;
  font-size:12px!important;
  font-weight:650!important;
}
.section-nav button:hover,
.section-nav button.active{
  background:#eaf3f5!important;
  color:var(--t-primary)!important;
}
.sections{
  min-width:0;
}
.section-block,
.topic-group,
.catalog-section{
  background:#fff!important;
  border:1px solid var(--t-line)!important;
  border-radius:16px!important;
  box-shadow:0 6px 22px rgba(16,35,49,.05)!important;
}
.topic-grid{
  gap:10px!important;
}
.topic-card{
  border:1px solid var(--t-line)!important;
  border-radius:12px!important;
  background:#fbfcfd!important;
  box-shadow:none!important;
}
.topic-card:hover{
  background:#fff!important;
  border-color:#aac4cc!important;
  box-shadow:0 8px 20px rgba(16,35,49,.07)!important;
}
.mobile-section-picker{
  margin-bottom:15px!important;
}
.mobile-section-picker select{
  border:1px solid var(--t-line)!important;
  border-radius:11px!important;
  background:#fff!important;
}

/* PDF görüntüleyici — tamamen koyu çalışma alanı */
.viewer{
  position:fixed!important;
  inset:0!important;
  z-index:100!important;
  display:flex!important;
  flex-direction:column!important;
  background:#101a21!important;
}
.viewer-bar{
  min-height:64px!important;
  padding:8px 14px!important;
  box-sizing:border-box;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  background:#17242c!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  color:#fff!important;
}
.viewer-bar button{
  min-width:42px!important;
  min-height:42px!important;
  border-radius:10px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:#21323c!important;
  color:#fff!important;
}
.viewer-bar button:hover{background:#29404b!important}
.viewer-title{
  flex:1!important;
  min-width:0;
  padding:0 8px!important;
}
.viewer-title strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:14px!important;
}
.viewer-title small{color:#91a5af!important}
.pdf-stage{
  flex:1!important;
  background:#0d151a!important;
}
.pdf-frame{
  box-shadow:0 18px 50px rgba(0,0,0,.35)!important;
}
.loading{color:#fff!important}

/* Hesaplama ekranı */
.calc-page{
  min-height:calc(100svh - 72px);
  padding:40px 24px 60px!important;
  box-sizing:border-box;
}
.calc-shell{
  width:min(900px,100%)!important;
  margin:0 auto!important;
}
.calc-hero{
  padding:30px!important;
  border-radius:20px!important;
  background:linear-gradient(135deg,#0b6574,#084b57)!important;
  color:#fff!important;
  box-shadow:var(--t-shadow)!important;
}
.calc-hero h1{
  margin:10px 0 0!important;
  font-size:clamp(28px,4vw,42px)!important;
  letter-spacing:-.045em!important;
}
.eyebrow{color:#d6edf0!important}
.notice{
  border:1px solid #f0d6a6!important;
  border-radius:13px!important;
  background:var(--t-accent-soft)!important;
  color:#80561e!important;
}
.patient-card,.calc-panel,.clinical-result{
  border:1px solid var(--t-line)!important;
  border-radius:17px!important;
  background:#fff!important;
  box-shadow:0 7px 24px rgba(16,35,49,.06)!important;
}
.field label{color:var(--t-muted)!important;font-weight:700!important}
.field input,.field select{
  border:1px solid var(--t-line)!important;
  border-radius:11px!important;
  background:#fbfcfd!important;
  color:var(--t-ink)!important;
}
.field input:focus,.field select:focus{
  outline:none!important;
  border-color:#72aab4!important;
  box-shadow:0 0 0 3px rgba(11,101,116,.10)!important;
}
.calc-tabs{
  padding:5px!important;
  border-radius:13px!important;
  background:#dfe9ed!important;
}
.calc-tab{
  border:0!important;
  border-radius:9px!important;
  color:var(--t-muted)!important;
}
.calc-tab.active{
  background:#fff!important;
  color:var(--t-primary)!important;
  box-shadow:0 2px 8px rgba(16,35,49,.08)!important;
}
.airway-card,.detail{
  border:1px solid var(--t-line)!important;
  border-radius:13px!important;
  background:var(--t-surface-2)!important;
}
.dose-big,.airway-value{color:var(--t-primary)!important}
.warning-result{
  border:1px solid #edc6c6!important;
  border-radius:12px!important;
  background:#fff2f2!important;
}
.footer-note,.source-note,.panel-sub,.mini-note{color:var(--t-muted)!important}

/* Alt indirme */
.site-footer{
  padding:22px 28px 32px!important;
  background:transparent!important;
}
.footer-download{
  width:min(1180px,100%)!important;
  min-height:48px!important;
  margin:auto!important;
  border-radius:12px!important;
  background:#172f3b!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 7px 18px rgba(16,35,49,.10)!important;
}

/* Küçük ekranlar */
@media (max-width:900px){
  .hero-entry{
    grid-template-columns:1fr!important;
    gap:20px!important;
  }
  .welcome-prompt,.audience-grid,.source-disclaimer{
    grid-column:1!important;
    grid-row:auto!important;
  }
  .welcome-prompt{padding-top:0!important}
  .source-disclaimer{margin-top:0!important}
  .audience-grid{grid-template-columns:1fr 1fr!important}
  .catalog-body{grid-template-columns:1fr!important}
  .section-nav{display:none!important}
}
@media (max-width:680px){
  .topbar{
    min-height:62px!important;
    padding:0 14px!important;
  }
  .brand-text{font-size:12px!important}
  .brand-logo{width:38px!important;height:38px!important}
  .top-actions .solid{font-size:11px!important;padding:8px 9px!important}
  .welcome{
    min-height:calc(100svh - 62px)!important;
    padding:30px 16px 34px!important;
  }
  .welcome-prompt{font-size:38px!important}
  .audience-grid{grid-template-columns:1fr!important}
  .audience-card,.audience-card.calculations{min-height:125px!important}
  .catalog{
    width:calc(100% - 28px)!important;
    margin-top:20px!important;
  }
  .catalog-head{
    align-items:stretch!important;
    flex-direction:column!important;
  }
  .search-wrap{width:100%!important}
  .calc-page{padding:22px 14px 40px!important}
  .calc-hero{padding:22px!important}
  .viewer-bar{gap:4px!important;padding:6px!important}
  .viewer-bar button{min-width:38px!important;min-height:38px!important}
}



/* ===== V7 SEPARATED STYLE BLOCK ===== */

            .pdf-stage {
                min-height: 0;
                overflow: auto;
                background: #e8edf1;
                padding: 10px;
                -webkit-overflow-scrolling: touch
            }

            .pdf-frame {
                display: block;
                width: 100%;
                height: auto;
                max-width: 1200px;
                margin: 0 auto;
                border: 0;
                background: #fff;
                box-shadow: 0 2px 12px rgba(0,0,0,.12)
            }

            @media(max-width: 680px) {
                html {
                    font-size:16px
                }

                body {
                    overflow-x: hidden
                }

                body.welcome-active .topbar {
                    height: auto;
                    min-height: 64px
                }

                body.welcome-active .brand-logo {
                    width: 46px;
                    height: 46px
                }

                body.welcome-active .brand-text {
                    max-width: none
                }

                body.welcome-active .welcome {
                    height: auto!important;
                    min-height: calc(100dvh - 64px)!important;
                    padding: 18px 14px 34px!important;
                    overflow: visible!important
                }

                body.welcome-active .welcome-card {
                    display: block!important;
                    height: auto!important;
                    min-height: 0!important
                }

                body.welcome-active .welcome-logo {
                    width: 76px!important;
                    height: 76px!important;
                    margin: 0 auto 10px
                }

                body.welcome-active .welcome-card h1 {
                    font-size: 30px!important;
                    line-height: 1.12!important;
                    margin: 8px auto 8px!important
                }

                body.welcome-active .welcome-prompt {
                    font-size: 14px!important;
                    line-height: 1.45!important;
                    margin: 0 auto 16px!important
                }

                body.welcome-active .audience-grid {
                    gap: 12px!important
                }

                body.welcome-active .audience-card,body.welcome-active .audience-card.calculations {
                    min-height: 96px!important;
                    padding: 18px 16px!important;
                    border-radius: 18px!important;
                    gap: 14px!important;
                    border-top-width: 4px!important
                }

                body.welcome-active .audience-icon {
                    width: 56px!important;
                    height: 56px!important;
                    border-radius: 15px!important;
                    font-size: 26px!important;
                    flex: 0 0 56px
                }

                body.welcome-active .audience-icon svg {
                    width: 34px;
                    height: 34px
                }

                body.welcome-active .audience-card h2 {
                    font-size: 21px!important;
                    line-height: 1.2!important;
                    margin: 0!important
                }

                body.welcome-active .arrow {
                    font-size: 24px!important
                }

                .catalog {
                    padding: 22px 14px 44px!important
                }

                .catalog-head h1 {
                    font-size: 30px!important;
                    line-height: 1.15
                }

                .catalog-head p {
                    font-size: 15px!important;
                    line-height: 1.5
                }

                .search input {
                    font-size: 16px!important;
                    min-height: 50px
                }

                .mobile-section-picker label {
                    font-size: 14px!important
                }

                .mobile-section-picker select {
                    font-size: 16px!important;
                    min-height: 50px
                }

                .topic-grid {
                    grid-template-columns: 1fr!important;
                    gap: 12px!important
                }

                .topic {
                    min-height: 92px!important;
                    padding: 17px 16px!important;
                    border-radius: 16px!important
                }

                .topic-title {
                    font-size: 18px!important;
                    line-height: 1.35!important
                }

                .topic-meta {
                    font-size: 13px!important;
                    line-height: 1.35!important;
                    gap: 8px!important;
                    margin-top: 10px!important;
                    flex-wrap: wrap
                }

                .page-pill {
                    font-size: 12px!important;
                    padding: 6px 9px!important
                }

                .topic-section h3 {
                    font-size: 20px!important;
                    margin: 24px 0 12px!important
                }

                .viewer {
                    grid-template-rows: auto 1fr;
                    height: 100dvh;
                    min-height: 100dvh;
                    overflow: hidden
                }

                .viewer-bar {
                    min-height: 68px!important;
                    padding: 8px!important;
                    gap: 7px!important;
                    flex-wrap: nowrap
                }

                .viewer-title strong {
                    font-size: 14px!important
                }

                .viewer-title small {
                    display: block!important;
                    font-size: 11px!important
                }

                .viewer button {
                    min-width: 44px;
                    min-height: 46px;
                    padding: 10px!important;
                    font-size: 16px!important;
                    border-radius: 11px
                }

                #backBtn {
                    min-width: 105px;
                    font-size: 14px!important
                }

                .pdf-stage {
                    padding: 6px;
                    overscroll-behavior: contain
                }

                .pdf-frame {
                    width: 100%;
                    max-width: none;
                    height: auto
                }

                .loading {
                    inset: 68px 0 0
                }

                .calc-page {
                    padding: 22px 14px 48px!important
                }

                .calc-hero h1 {
                    font-size: 30px!important
                }

                .calc-hero p,.panel-sub,.source-note,.formula {
                    font-size: 14px!important;
                    line-height: 1.5!important
                }

                .calc-panel,.patient-card {
                    padding: 18px!important;
                    border-radius: 17px!important
                }

                .field label {
                    font-size: 13px!important
                }

                .field input,.field select {
                    font-size: 16px!important;
                    min-height: 48px
                }

                .solid,.ghost,.calc-actions button {
                    font-size: 15px!important;
                    min-height: 48px;
                    padding: 12px 15px!important
                }
            }
        

/* ===== V7 SEPARATED STYLE BLOCK ===== */

            @media(max-width: 960px) {
                .mobile-section-picker {
                    background:#fff1f2;
                    border: 2px solid #dc2626;
                    border-radius: 16px;
                    padding: 12px;
                    box-shadow: 0 8px 24px rgba(220,38,38,.14);
                    margin-bottom: 20px;
                }

                .mobile-section-picker label {
                    color: #b91c1c !important;
                    font-size: 15px !important;
                    font-weight: 900 !important;
                    margin: 0 0 8px !important;
                    letter-spacing: .01em;
                }

                .mobile-section-picker select {
                    border: 2px solid #ef4444 !important;
                    background-color: #fff !important;
                    color: #7f1d1d !important;
                    font-size: 17px !important;
                    font-weight: 850 !important;
                    min-height: 54px !important;
                    box-shadow: none !important;
                }

                .mobile-section-picker select:focus {
                    outline: none;
                    border-color: #b91c1c !important;
                    box-shadow: 0 0 0 4px rgba(220,38,38,.15) !important;
                }
            }
        

/* ===== V7 SEPARATED STYLE BLOCK ===== */

            body.welcome-active .topbar {
                background: rgba(7,18,45,.78);
                border-bottom: 1px solid rgba(255,255,255,.16);
                color: #fff;
            }

            body.welcome-active .brand small {
                color: rgba(255,255,255,.68)
            }

            body.welcome-active .top-actions .ghost {
                background: rgba(255,255,255,.12);
                color: #fff
            }

            body.welcome-active .top-actions .solid {
                background: #fff;
                color: #102a43
            }

            body.welcome-active .welcome {
                min-height: calc(100vh - 72px);
                background: #0b1838;
                isolation: isolate;
            }

            body.welcome-active .welcome:before {
                content: "";
                position: absolute;
                inset: -12px;
                width: auto;
                height: auto;
                border: 0;
                border-radius: 0;
                box-shadow: none;
                background: url('pdf-pages/page-001.jpg') center 8%/cover no-repeat;
                filter: none;
                transform: none;
                z-index: -2;
            }

            body.welcome-active .welcome:after {
                content: "";
                position: absolute;
                inset: 0;
                background: linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,0) 65%,rgba(0,0,0,.16) 100%);
                z-index: -1;
            }

            body.welcome-active .hero-entry {
                width: min(1040px,100%);
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: flex-end;
                min-height: min(720px,calc(100vh - 120px));
                padding-top: clamp(220px,36vh,390px);
            }

            body.welcome-active .local-chip {
                display: inline-flex;
                align-items: center;
                padding: 7px 12px;
                border: 1px solid rgba(255,255,255,.32);
                border-radius: 999px;
                background: rgba(8,24,58,.48);
                color: rgba(255,255,255,.9);
                backdrop-filter: blur(10px);
                font-size: 12px;
                font-weight: 800;
                letter-spacing: .04em;
                margin-bottom: 10px;
            }

            body.welcome-active .hero-prompt {
                color: #fff;
                text-shadow: 0 2px 18px rgba(0,0,0,.35);
                margin: 0 0 14px;
                font-size: 13px;
            }

            body.welcome-active .hero-actions {
                width: 100%;
                grid-template-columns: repeat(3,minmax(0,1fr));
                gap: 12px;
            }

            body.welcome-active .hero-actions .audience-card, body.welcome-active .hero-actions .audience-card.calculations {
                grid-column: auto;
                min-height: 122px;
                padding: 18px;
                border: 1px solid rgba(15,23,42,.14);
                border-top: 1px solid rgba(15,23,42,.10);
                border-radius: 18px;
                background: rgba(255,255,255,.96);
                color: #fff;
                box-shadow: 0 14px 42px rgba(0,0,0,.24);
                backdrop-filter: blur(13px);
            }

            body.welcome-active .hero-actions .audience-card:hover {
                transform: translateY(-3px);
                background: rgba(255,255,255,1);
                border-color: rgba(255,255,255,.55);
            }

            body.welcome-active .hero-actions .audience-icon {
                width: 54px;
                height: 54px;
                border-radius: 16px;
                background: #e8eefc!important;
                color: #0f172a;
            }

            body.welcome-active .hero-actions h2 {
                color: #0f172a;
                font-size: 21px;
                margin: 0 0 4px;
                font-weight: 800
            }

            body.welcome-active .hero-actions p {
                color: rgba(15,23,42,.72);
                font-size: 12px;
                margin: 0;
                line-height: 1.35
            }

            body.welcome-active .hero-actions .arrow {
                color: #0f172a
            }

            body.welcome-active .source-disclaimer {
                max-width: 850px;
                margin: 14px auto 0;
                color: rgba(255,255,255,.68);
                font-size: 11px;
                line-height: 1.45;
                text-shadow: 0 1px 8px rgba(0,0,0,.35);
            }

            @media(max-width: 800px) {
                body.welcome-active .hero-entry {
                    padding-top:clamp(180px,31vh,300px);
                    min-height: 0
                }

                body.welcome-active .hero-actions {
                    grid-template-columns: 1fr 1fr
                }

                body.welcome-active .hero-actions .calculations {
                    grid-column: 1/-1
                }
            }

            @media(max-width: 680px) {
                body.welcome-active .welcome {
                    padding:16px 12px 26px!important;
                    background: #0b1838!important
                }

                body.welcome-active .welcome:before {
                    background-position: center 8%;
                    filter: none
                }

                body.welcome-active .hero-entry {
                    display: flex!important;
                    justify-content: flex-end!important;
                    padding-top: 43vh!important;
                    min-height: calc(100dvh - 64px)!important
                }

                body.welcome-active .hero-actions {
                    grid-template-columns: 1fr;
                    gap: 9px!important
                }

                body.welcome-active .hero-actions .audience-card, body.welcome-active .hero-actions .audience-card.calculations {
                    grid-column: auto!important;
                    min-height: 82px!important;
                    padding: 13px 14px!important;
                    border-radius: 15px!important;
                    gap: 11px!important
                }

                body.welcome-active .hero-actions .audience-icon {
                    width: 46px!important;
                    height: 46px!important;
                    flex-basis: 46px!important
                }

                body.welcome-active .hero-actions h2 {
                    font-size: 18px!important;
                    margin-bottom: 2px!important
                }

                body.welcome-active .hero-actions p {
                    font-size: 11px!important
                }

                body.welcome-active .local-chip {
                    font-size: 11px;
                    margin-bottom: 7px
                }

                body.welcome-active .hero-prompt {
                    font-size: 11px!important;
                    margin-bottom: 9px!important
                }

                body.welcome-active .source-disclaimer {
                    font-size: 10px;
                    margin-top: 10px
                }
            }
        

/* ===== V7 SEPARATED STYLE BLOCK ===== */

            body.welcome-active .topbar {
                min-height: 72px;
                height: 72px;
                padding-left: clamp(14px,3vw,48px);
                padding-right: clamp(14px,3vw,48px);
                gap: 18px
            }

            body.welcome-active .brand {
                min-width: 0;
                flex: 1 1 auto;
                gap: 12px
            }

            body.welcome-active .brand-logo {
                width: 48px;
                height: 48px;
                flex: 0 0 48px
            }

            body.welcome-active .brand-text {
                min-width: 0;
                max-width: none;
                font-size: 16px;
                line-height: 1.13;
                font-weight: 850;
                letter-spacing: -.015em
            }

            body.welcome-active .brand small {
                display: block;
                margin-top: 3px;
                font-size: 11px;
                line-height: 1.2;
                white-space: normal
            }

            body.welcome-active .top-actions {
                flex: 0 0 auto
            }

            @media (min-width: 1100px) {
                body.welcome-active .hero-entry {
                    width:min(1120px,calc(100% - 40px));
                    padding-top: clamp(250px,37vh,410px)
                }

                body.welcome-active .hero-actions {
                    grid-template-columns: repeat(3,minmax(0,1fr));
                    gap: 14px
                }

                body.welcome-active .hero-actions .audience-card,body.welcome-active .hero-actions .audience-card.calculations {
                    grid-column: auto!important;
                    min-height: 118px
                }
            }

            @media (min-width: 681px) and (max-width:1099px) {
                body.welcome-active {
                    overflow:auto;
                    height: auto;
                    min-height: 100vh
                }

                body.welcome-active .topbar {
                    min-height: 68px;
                    height: 68px;
                    padding: 0 18px
                }

                body.welcome-active .brand-logo {
                    width: 44px;
                    height: 44px;
                    flex-basis: 44px
                }

                body.welcome-active .brand-text {
                    font-size: 14px;
                    line-height: 1.12
                }

                body.welcome-active .brand small {
                    font-size: 10px
                }

                body.welcome-active .welcome {
                    min-height: calc(100vh - 68px);
                    height: auto!important;
                    padding: 18px 18px 28px!important
                }

                body.welcome-active .hero-entry {
                    width: min(920px,100%);
                    min-height: calc(100vh - 110px);
                    padding-top: clamp(250px,39vh,390px);
                    justify-content: flex-end
                }

                body.welcome-active .hero-actions {
                    display: grid;
                    grid-template-columns: repeat(3,minmax(0,1fr))!important;
                    gap: 10px!important
                }

                body.welcome-active .hero-actions .audience-card,body.welcome-active .hero-actions .audience-card.calculations {
                    grid-column: auto!important;
                    min-width: 0;
                    min-height: 104px!important;
                    padding: 14px 13px!important;
                    gap: 10px!important
                }

                body.welcome-active .hero-actions .audience-icon {
                    width: 48px!important;
                    height: 48px!important;
                    flex: 0 0 48px!important
                }

                body.welcome-active .hero-actions .audience-icon svg {
                    width: 29px;
                    height: 29px
                }

                body.welcome-active .hero-actions h2 {
                    font-size: 17px!important;
                    line-height: 1.12!important
                }

                body.welcome-active .hero-actions p {
                    font-size: 10.5px!important;
                    line-height: 1.3
                }

                body.welcome-active .hero-actions .arrow {
                    font-size: 20px
                }

                body.welcome-active .source-disclaimer {
                    max-width: 760px;
                    font-size: 10px
                }
            }

            @media (max-width: 680px) {
                body.welcome-active {
                    height:auto!important;
                    min-height: 100%;
                    overflow: auto!important
                }

                body.welcome-active .topbar {
                    position: sticky;
                    top: 0;
                    min-height: 68px!important;
                    height: auto!important;
                    padding: 8px 10px!important;
                    gap: 8px
                }

                body.welcome-active .brand {
                    gap: 8px
                }

                body.welcome-active .brand-logo {
                    width: 42px!important;
                    height: 42px!important;
                    flex: 0 0 42px!important
                }

                body.welcome-active .brand-text {
                    display: block!important;
                    max-width: min(230px,calc(100vw - 115px))!important;
                    font-size: 13px!important;
                    line-height: 1.12!important;
                    font-weight: 850
                }

                body.welcome-active .brand small {
                    display: block!important;
                    font-size: 9px!important;
                    line-height: 1.15!important;
                    margin-top: 2px
                }

                body.welcome-active .top-actions .ghost,body.welcome-active .top-actions .solid {
                    min-width: 42px;
                    min-height: 42px;
                    padding: 8px!important
                }

                body.welcome-active .download-label {
                    display: none!important
                }

                body.welcome-active .welcome {
                    height: auto!important;
                    min-height: calc(100svh - 68px)!important;
                    padding: 12px 10px 22px!important;
                    overflow: visible!important
                }

                body.welcome-active .welcome:before {
                    background-position: center top!important;
                    filter: none!important
                }

                body.welcome-active .hero-entry {
                    display: flex!important;
                    flex-direction: column;
                    justify-content: flex-end!important;
                    width: 100%;
                    min-height: calc(100svh - 92px)!important;
                    padding-top: clamp(260px,49svh,440px)!important
                }

                body.welcome-active .local-chip {
                    font-size: 10px!important;
                    padding: 6px 10px;
                    margin-bottom: 6px
                }

                body.welcome-active .hero-prompt {
                    font-size: 10px!important;
                    margin-bottom: 8px!important
                }

                body.welcome-active .hero-actions {
                    display: grid!important;
                    grid-template-columns: 1fr!important;
                    gap: 8px!important;
                    width: 100%
                }

                body.welcome-active .hero-actions .audience-card,body.welcome-active .hero-actions .audience-card.calculations {
                    grid-column: auto!important;
                    width: 100%;
                    min-width: 0;
                    min-height: 74px!important;
                    padding: 10px 12px!important;
                    border-radius: 14px!important;
                    gap: 10px!important
                }

                body.welcome-active .hero-actions .audience-icon {
                    width: 44px!important;
                    height: 44px!important;
                    flex: 0 0 44px!important;
                    border-radius: 12px!important
                }

                body.welcome-active .hero-actions .audience-icon svg {
                    width: 27px!important;
                    height: 27px!important
                }

                body.welcome-active .hero-actions h2 {
                    font-size: 17px!important;
                    line-height: 1.12!important;
                    margin: 0 0 2px!important
                }

                body.welcome-active .hero-actions p {
                    font-size: 10px!important;
                    line-height: 1.25!important;
                    margin: 0!important
                }

                body.welcome-active .hero-actions .arrow {
                    font-size: 20px!important;
                    margin-left: auto
                }

                body.welcome-active .source-disclaimer {
                    font-size: 9px!important;
                    line-height: 1.3;
                    margin-top: 8px!important;
                    padding: 0 4px
                }
            }

            @media (max-width: 390px) {
                body.welcome-active .topbar {
                    min-height:64px!important
                }

                body.welcome-active .brand-logo {
                    width: 38px!important;
                    height: 38px!important;
                    flex-basis: 38px!important
                }

                body.welcome-active .brand-text {
                    display: block!important;
                    max-width: 215px!important;
                    font-size: 11.5px!important
                }

                body.welcome-active .brand small {
                    font-size: 8.5px!important
                }

                body.welcome-active .hero-entry {
                    padding-top: clamp(230px,47svh,360px)!important
                }

                body.welcome-active .hero-actions .audience-card,body.welcome-active .hero-actions .audience-card.calculations {
                    min-height: 68px!important;
                    padding: 9px 10px!important
                }

                body.welcome-active .hero-actions h2 {
                    font-size: 15.5px!important
                }

                body.welcome-active .hero-actions p {
                    font-size: 9px!important
                }
            }
        

/* ===== V7 SEPARATED STYLE BLOCK ===== */

            .site-footer {
                display: flex;
                justify-content: center;
                padding: 18px 14px 28px;
                background: #f8fafc;
                border-top: 1px solid #e2e8f0
            }

            .footer-download {
                appearance: none;
                border: 0;
                border-radius: 14px;
                background: #0f2742;
                color: #fff;
                font-weight: 800;
                font-size: 15px;
                line-height: 1;
                padding: 15px 22px;
                min-height: 48px;
                box-shadow: 0 6px 18px rgba(15,39,66,.16);
                cursor: pointer
            }

            .footer-download:hover {
                background: #163b63
            }

            body.welcome-active .site-footer {
                background: transparent;
                border-top: 0;
                position: relative;
                z-index: 3;
                padding-top: 10px
            }

            body.welcome-active .top-actions #doseBtn {
                display: none!important
            }

            @media (max-width: 680px) {
                body.welcome-active .topbar {
                    position:sticky;
                    top: 0;
                    min-height: 64px!important;
                    padding: 8px 10px!important
                }

                body.welcome-active .top-actions {
                    gap: 6px
                }

                body.welcome-active .top-actions .ghost {
                    min-width: 44px!important;
                    min-height: 44px!important;
                    border-radius: 12px!important;
                    padding: 0 10px!important;
                    font-size: 12px!important
                }

                body.welcome-active .top-actions #homeBtn.hidden {
                    display: none!important
                }

                body.welcome-active .welcome:before {
                    background-image: url('hero-mobile.jpg')!important;
                    background-size: cover!important;
                    background-position: center center!important;
                    background-repeat: no-repeat!important;
                    filter: none!important;
                    transform: none!important
                }

                body.welcome-active .welcome:after {
                    background: linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,0) 72%,rgba(3,12,28,.18) 100%)!important
                }

                body.welcome-active .hero-entry {
                    padding-top: clamp(340px,58svh,610px)!important;
                    min-height: calc(100svh - 64px)!important
                }

                body.welcome-active .site-footer {
                    padding: 12px 12px 22px
                }

                body.welcome-active .footer-download {
                    width: 100%;
                    max-width: 420px;
                    font-size: 14px
                }
            }

            @media (min-width: 681px) {
                body.welcome-active .site-footer {
                    padding-top:12px
                }
            }
        

/* ===== V7 SEPARATED STYLE BLOCK ===== */

            /* Ana sayfada header kesinlikle yok; katalog ve hesaplama ekranlarında korunur. */
            body.welcome-active #topbar {
                display: none!important
            }

            body.welcome-active .welcome {
                min-height: 100vh!important;
                min-height: 100svh!important;
                height: auto!important;
            }

            /* Footer ana sayfanın gerçek alt bölümü */
            body.welcome-active .site-footer {
                position: relative!important;
                z-index: 4;
                background: #f8fafc!important;
                border-top: 1px solid #e2e8f0!important;
                padding: 16px 12px 24px!important;
            }

            body.welcome-active .footer-download {
                width: min(100%,440px);
                min-height: 50px;
                border-radius: 14px;
                font-size: 14px;
            }

            @media (max-width: 680px) {
                body.welcome-active .welcome {
                    padding:0 10px 18px!important;
                    min-height: 100svh!important;
                }

                /* Mobilde kapak yazısının merkezi ekranın merkezinde kalır. */
                body.welcome-active .welcome:before {
                    background-image: url('pdf-pages/page-001.jpg')!important;
                    background-size: auto 96%!important;
                    background-position: center top!important;
                    background-repeat: no-repeat!important;
                    background-color: #073b92!important;
                    filter: none!important;
                    transform: none!important;
                    inset: 0!important;
                }

                body.welcome-active .welcome:after {
                    background: linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,0) 68%,rgba(2,11,28,.10) 82%,rgba(2,11,28,.25) 100%)!important;
                }

                body.welcome-active .hero-entry {
                    width: 100%!important;
                    min-height: 100svh!important;
                    padding-top: clamp(390px,62svh,620px)!important;
                    padding-bottom: 14px!important;
                    justify-content: flex-end!important;
                }

                body.welcome-active .local-chip, body.welcome-active .hero-prompt {
                    text-align: center!important;
                    align-self: center!important;
                }

                body.welcome-active .hero-actions {
                    width: 100%!important;
                    grid-template-columns: 1fr!important;
                    gap: 8px!important;
                }

                body.welcome-active .hero-actions .audience-card, body.welcome-active .hero-actions .audience-card.calculations {
                    width: 100%!important;
                    grid-column: auto!important;
                    min-height: 72px!important;
                }

                body.welcome-active .source-disclaimer {
                    text-align: center!important;
                    max-width: 360px!important;
                }
            }

            @media (max-width: 390px) {
                body.welcome-active .hero-entry {
                    padding-top:clamp(350px,60svh,540px)!important;
                }
            }
        

/* ===== V7 SEPARATED STYLE BLOCK ===== */

            body.welcome-active #topbar {
                display: flex!important
            }

            body.welcome-active .site-footer {
                display: none!important
            }

            body.welcome-active #downloadBtn,body.welcome-active .download-label {
                display: none!important
            }

            body.welcome-active .topbar {
                position: relative!important
            }

            body.welcome-active .welcome {
                min-height: calc(100vh - 72px)!important;
                min-height: calc(100svh - 72px)!important
            }

            @media (max-width: 680px) {
                body.welcome-active .topbar {
                    display:flex!important;
                    min-height: 64px!important;
                    height: auto!important;
                    padding: 8px 10px!important
                }

                body.welcome-active .welcome {
                    min-height: calc(100svh - 64px)!important
                }

                body.welcome-active .hero-entry {
                    min-height: calc(100svh - 64px)!important
                }
            }
        

/* ===== V7 SEPARATED STYLE BLOCK ===== */

            @media (max-width: 680px) {
                body.welcome-active {
                    height:100svh!important;
                    min-height: 100svh!important;
                    overflow: hidden!important
                }

                body.welcome-active .app {
                    height: 100svh!important;
                    overflow: hidden!important
                }

                body.welcome-active .topbar {
                    height: 64px!important;
                    min-height: 64px!important;
                    flex: 0 0 64px!important
                }

                body.welcome-active .welcome {
                    height: calc(100svh - 64px)!important;
                    min-height: 0!important;
                    max-height: calc(100svh - 64px)!important;
                    overflow: hidden!important;
                    padding: 0 10px 8px!important
                }

                body.welcome-active .hero-entry {
                    height: 100%!important;
                    min-height: 0!important;
                    max-height: 100%!important;
                    padding: 0 0 24px!important;
                    display: flex!important;
                    flex-direction: column!important;
                    justify-content: flex-end!important
                }

                body.welcome-active .local-chip {
                    font-size: 11px!important;
                    line-height: 1.2!important;
                    padding: 6px 11px!important;
                    margin-bottom: 7px!important
                }

                body.welcome-active .hero-prompt {
                    font-size: 12px!important;
                    line-height: 1.25!important;
                    font-weight: 700!important;
                    margin-bottom: 9px!important
                }

                body.welcome-active .hero-actions {
                    gap: 8px!important
                }

                body.welcome-active .hero-actions .audience-card,body.welcome-active .hero-actions .audience-card.calculations {
                    min-height: 78px!important;
                    height: auto!important;
                    padding: 10px 13px!important;
                    gap: 11px!important
                }

                body.welcome-active .hero-actions .audience-icon {
                    width: 46px!important;
                    height: 46px!important;
                    flex: 0 0 46px!important
                }

                body.welcome-active .hero-actions h2 {
                    font-size: 18px!important;
                    line-height: 1.12!important;
                    font-weight: 850!important;
                    margin: 0 0 3px!important
                }

                body.welcome-active .hero-actions p {
                    font-size: 11.5px!important;
                    line-height: 1.25!important;
                    margin: 0!important
                }

                body.welcome-active .hero-actions .arrow {
                    font-size: 22px!important
                }

                body.welcome-active .source-disclaimer {
                    font-size: 9.5px!important;
                    line-height: 1.25!important;
                    margin-top: 7px!important
                }
            }

            @media (max-width: 390px) and (max-height:740px) {
                body.welcome-active .hero-entry {
                    padding-bottom:10px!important
                }

                body.welcome-active .hero-actions {
                    gap: 6px!important
                }

                body.welcome-active .hero-actions .audience-card,body.welcome-active .hero-actions .audience-card.calculations {
                    min-height: 68px!important;
                    padding: 8px 10px!important
                }

                body.welcome-active .hero-actions h2 {
                    font-size: 16.5px!important
                }

                body.welcome-active .hero-actions p {
                    font-size: 10.5px!important
                }

                body.welcome-active .source-disclaimer {
                    font-size: 8.5px!important;
                    margin-top: 5px!important
                }
            }
        

/* ===== V7 SEPARATED STYLE BLOCK ===== */

            @media (max-width: 680px) {
                body.welcome-active .brand-text {
                    max-width:calc(100vw - 74px) !important;
                    font-size: 16px !important;
                    line-height: 1.08 !important;
                    font-weight: 850 !important;
                    letter-spacing: -.02em !important;
                }

                body.welcome-active .brand small {
                    font-size: 10.5px !important;
                    line-height: 1.15 !important;
                    margin-top: 3px !important;
                }
            }

            @media (max-width: 390px) {
                body.welcome-active .brand-text {
                    max-width:calc(100vw - 68px) !important;
                    font-size: 14.5px !important;
                    line-height: 1.08 !important;
                }

                body.welcome-active .brand small {
                    font-size: 10px !important;
                }
            }
        

/* ===== V7 SEPARATED STYLE BLOCK ===== */

            @media (max-width: 680px) {
                .pdf-stage {
                    position:relative;
                    overflow: hidden!important;
                    touch-action: none;
                    overscroll-behavior: none;
                    background: #17222b
                }

                .pdf-frame {
                    display: block;
                    width: 100%;
                    height: auto!important;
                    max-width: none!important;
                    margin: 0 auto;
                    transform-origin: 0 0;
                    will-change: transform;
                    backface-visibility: hidden;
                    -webkit-user-drag: none;
                    user-select: none;
                    -webkit-user-select: none;
                    touch-action: none
                }

                .pdf-frame.zoom-animating {
                    transition: transform .22s cubic-bezier(.2,.8,.2,1)
                }
            }
        

/* ===== V7 SEPARATED STYLE BLOCK ===== */

/* İlk açılışta PDF görüntüleyiciyi gizle. */
.viewer.hidden {
    display: none !important;
}


/* ===== V7 SEPARATED STYLE BLOCK ===== */

/* =========================================================
   TRABZON 112 — tamamen yeni arayüz
   İçerik, algoritma verisi ve hesaplama mantığı değiştirilmez.
   ========================================================= */
:root{
  --tr-bg:#f4f7f9;
  --tr-surface:#ffffff;
  --tr-ink:#10212b;
  --tr-muted:#667984;
  --tr-line:#dbe5e9;
  --tr-navy:#123746;
  --tr-blue:#1769aa;
  --tr-cyan:#1597a8;
  --tr-teal:#087f78;
  --tr-gold:#d39b2a;
  --tr-shadow:0 18px 50px rgba(16,33,43,.10);
}

html,body{background:var(--tr-bg)!important;color:var(--tr-ink)!important}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}

/* TOP BAR */
body.welcome-active .topbar,
.topbar{
  position:sticky!important;top:0!important;z-index:50!important;
  height:74px!important;min-height:74px!important;
  padding:0 34px!important;
  background:rgba(255,255,255,.96)!important;
  border-bottom:1px solid var(--tr-line)!important;
  box-shadow:0 4px 20px rgba(16,33,43,.05)!important;
  color:var(--tr-ink)!important;
  backdrop-filter:blur(14px)!important;
}
.brand{gap:13px!important}
.brand-logo{
  width:43px!important;height:43px!important;object-fit:contain!important;
  padding:7px!important;border:1px solid var(--tr-line)!important;
  border-radius:12px!important;background:#fff!important;
}
.brand-text{font-size:14px!important;font-weight:850!important;color:var(--tr-ink)!important}
.brand-text small{display:block!important;margin-top:3px!important;font-size:11px!important;color:var(--tr-muted)!important;font-weight:600!important}
.top-actions{gap:9px!important}
.top-actions button{border-radius:11px!important;font-weight:800!important}
.top-actions .ghost{background:#f1f5f6!important;border:1px solid var(--tr-line)!important;color:var(--tr-navy)!important}
.top-actions .solid{background:var(--tr-navy)!important;color:#fff!important;border:1px solid var(--tr-navy)!important}

/* HOME — no PDF image, no copied hero */
body.welcome-active .welcome{
  position:relative!important;min-height:calc(100vh - 74px)!important;
  padding:58px 28px 44px!important;
  background:
    radial-gradient(circle at 85% 12%,rgba(21,151,168,.10),transparent 26%),
    radial-gradient(circle at 10% 90%,rgba(23,105,170,.08),transparent 30%),
    var(--tr-bg)!important;
  overflow:hidden!important;
}
body.welcome-active .welcome:before{
  content:""!important;position:absolute!important;inset:auto -120px -150px auto!important;
  width:520px!important;height:520px!important;border-radius:50%!important;
  border:70px solid rgba(21,151,168,.045)!important;
  background:none!important;filter:none!important;transform:none!important;z-index:0!important;
}
body.welcome-active .welcome:after{
  content:"112"!important;position:absolute!important;right:42px!important;top:115px!important;
  font-size:150px!important;line-height:1!important;font-weight:950!important;
  letter-spacing:-.08em!important;color:rgba(18,55,70,.035)!important;
  z-index:0!important;pointer-events:none!important;background:none!important;
}
body.welcome-active .hero-entry{
  position:relative!important;z-index:2!important;
  width:min(1180px,100%)!important;min-height:0!important;
  margin:0 auto!important;padding:0!important;
  display:grid!important;grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr)!important;
  gap:54px!important;align-items:center!important;
  background:transparent!important;border:0!important;box-shadow:none!important;
}
body.welcome-active .local-chip{
  display:inline-flex!important;width:max-content!important;
  padding:8px 12px!important;margin:0 0 18px!important;
  border:1px solid #cfe0e4!important;border-radius:999px!important;
  background:#fff!important;color:var(--tr-teal)!important;
  font-size:12px!important;font-weight:850!important;letter-spacing:.05em!important;
  box-shadow:0 5px 18px rgba(16,33,43,.05)!important;
}
body.welcome-active .hero-prompt{
  margin:0!important;max-width:700px!important;
  font-size:clamp(42px,5.2vw,76px)!important;
  line-height:.98!important;letter-spacing:-.055em!important;
  font-weight:950!important;color:var(--tr-navy)!important;
}
body.welcome-active .hero-prompt:before{
  content:"TRABZON 112"!important;display:block!important;
  margin-bottom:15px!important;font-size:13px!important;line-height:1!important;
  letter-spacing:.18em!important;font-weight:900!important;color:var(--tr-gold)!important;
}
body.welcome-active .hero-prompt:after{
  content:"Acil sağlık ekipleri için hızlı, sade ve erişilebilir."!important;
  display:block!important;margin-top:23px!important;max-width:590px!important;
  font-size:17px!important;line-height:1.55!important;letter-spacing:0!important;
  font-weight:550!important;color:var(--tr-muted)!important;
}
body.welcome-active .hero-actions{
  display:grid!important;grid-template-columns:1fr!important;gap:13px!important;
  width:100%!important;margin:0!important;align-self:center!important;
}
body.welcome-active .audience-card{
  position:relative!important;display:grid!important;grid-template-columns:58px 1fr 34px!important;
  align-items:center!important;gap:15px!important;
  min-height:118px!important;padding:20px 22px!important;
  border:1px solid var(--tr-line)!important;border-radius:20px!important;
  background:#fff!important;color:var(--tr-ink)!important;text-align:left!important;
  box-shadow:0 12px 30px rgba(16,33,43,.07)!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease!important;
  overflow:hidden!important;
}
body.welcome-active .audience-card:before{
  content:""!important;position:absolute!important;left:0!important;top:0!important;bottom:0!important;width:5px!important;
  background:var(--tr-blue)!important;
}
body.welcome-active .audience-card.pediatric:before{background:#7c5ce6!important}
body.welcome-active .audience-card.calculations:before{background:var(--tr-teal)!important}
body.welcome-active .audience-card:hover{
  transform:translateY(-3px)!important;box-shadow:0 18px 40px rgba(16,33,43,.12)!important;border-color:#c5d7dc!important;
}
body.welcome-active .audience-icon{
  width:58px!important;height:58px!important;border-radius:16px!important;
  display:grid!important;place-items:center!important;background:#edf6fb!important;color:var(--tr-blue)!important;
}
body.welcome-active .pediatric .audience-icon{background:#f1edff!important;color:#7252d8!important}
body.welcome-active .calculations .audience-icon{background:#e8f7f4!important;color:var(--tr-teal)!important}
body.welcome-active .audience-icon svg{width:30px!important;height:30px!important}
body.welcome-active .audience-card h2{
  margin:0 0 5px!important;font-size:18px!important;font-weight:900!important;color:var(--tr-navy)!important;
}
body.welcome-active .audience-card p{
  margin:0!important;font-size:12px!important;line-height:1.45!important;color:var(--tr-muted)!important;
}
body.welcome-active .audience-card .arrow{
  width:34px!important;height:34px!important;border-radius:50%!important;display:grid!important;place-items:center!important;
  background:#f2f6f7!important;color:var(--tr-navy)!important;font-size:20px!important;font-weight:800!important;
}
body.welcome-active .source-disclaimer{
  grid-column:1!important;margin:34px 0 0!important;max-width:640px!important;
  color:#7a8b93!important;font-size:11px!important;line-height:1.6!important;
}

/* CATALOG */
.catalog{background:var(--tr-bg)!important;min-height:calc(100vh - 74px)!important;padding:32px!important}
.catalog-head{max-width:1180px!important;margin:0 auto 24px!important;padding:0!important}
.catalog-head h2{font-size:32px!important;color:var(--tr-navy)!important;font-weight:950!important;letter-spacing:-.03em!important}
.catalog-sub{color:var(--tr-muted)!important}
.search-wrap{background:#fff!important;border:1px solid var(--tr-line)!important;border-radius:13px!important;box-shadow:none!important}
.search{background:transparent!important;color:var(--tr-ink)!important}
.catalog-body{max-width:1180px!important;margin:0 auto!important;gap:22px!important}
.section-nav{background:#fff!important;border:1px solid var(--tr-line)!important;border-radius:18px!important;padding:10px!important;box-shadow:0 8px 24px rgba(16,33,43,.05)!important}
.section-nav button{border-radius:10px!important;color:var(--tr-muted)!important}
.section-nav button.active{background:#e9f5f6!important;color:var(--tr-teal)!important}
.sections{background:transparent!important}
.topic-section{background:#fff!important;border:1px solid var(--tr-line)!important;border-radius:18px!important;padding:22px!important;margin-bottom:16px!important;box-shadow:0 8px 24px rgba(16,33,43,.05)!important}
.topic-card{border:1px solid #e3ebee!important;border-radius:13px!important;background:#fbfcfd!important}
.topic-card:hover{border-color:#a9c9cf!important;background:#fff!important}
.page-pill{background:#eaf5f6!important;color:var(--tr-teal)!important;border:0!important}

/* CALCULATOR */
.calc-page{background:var(--tr-bg)!important;min-height:calc(100vh - 74px)!important;padding:42px 24px 60px!important}
.calc-shell{max-width:980px!important;margin:auto!important}
.calc-hero{background:var(--tr-navy)!important;border-radius:22px!important;padding:30px!important;box-shadow:var(--tr-shadow)!important}
.calc-hero h1{color:#fff!important;font-size:36px!important}
.calc-hero .eyebrow{color:#b9e2e2!important}
.notice{border-radius:14px!important;background:#fff8e7!important;border:1px solid #f1d99c!important;color:#735415!important}
.patient-card,.calc-panel,.clinical-result{background:#fff!important;border:1px solid var(--tr-line)!important;border-radius:18px!important;box-shadow:0 8px 24px rgba(16,33,43,.05)!important}
.field input,.field select{background:#fbfcfd!important;border:1px solid var(--tr-line)!important;border-radius:11px!important}
.calc-tabs{gap:8px!important}
.calc-tabs button{border-radius:11px!important}
.calc-tabs button.active{background:var(--tr-teal)!important;color:#fff!important}

/* VIEWER */
.viewer{background:#0c151a!important}
.viewer-bar{background:#12242d!important;border-bottom:1px solid #27414d!important}
.viewer-bar button{border-radius:10px!important;background:#1c3641!important;color:#fff!important;border:1px solid #2d4c59!important}
.pdf-stage{background:#0a1115!important}

/* Prevent any old hero cover styles from reappearing */
body.welcome-active .welcome:before,body.welcome-active .welcome:after{pointer-events:none!important}

@media(max-width:900px){
  body.welcome-active .welcome{padding:42px 20px 34px!important}
  body.welcome-active .hero-entry{grid-template-columns:1fr!important;gap:32px!important}
  body.welcome-active .hero-prompt{font-size:clamp(40px,9vw,62px)!important}
  body.welcome-active .source-disclaimer{grid-column:auto!important;margin-top:22px!important}
}
@media(max-width:680px){
  .topbar{height:66px!important;min-height:66px!important;padding:0 12px!important}
  .brand-logo{width:38px!important;height:38px!important}
  .brand-text{font-size:12px!important;max-width:210px!important}
  .brand-text small{font-size:9px!important}
  body.welcome-active .welcome{min-height:calc(100svh - 66px)!important;padding:30px 14px 28px!important}
  body.welcome-active .hero-entry{gap:26px!important}
  body.welcome-active .hero-prompt{font-size:42px!important}
  body.welcome-active .hero-prompt:after{font-size:14px!important;margin-top:17px!important}
  body.welcome-active .audience-card{min-height:96px!important;padding:15px!important;grid-template-columns:48px 1fr 28px!important}
  body.welcome-active .audience-icon{width:48px!important;height:48px!important}
  body.welcome-active .audience-card h2{font-size:16px!important}
  body.welcome-active .audience-card p{font-size:11px!important}
  body.welcome-active .audience-card .arrow{width:28px!important;height:28px!important;font-size:16px!important}
  .catalog{padding:20px 12px!important}
  .catalog-head h2{font-size:27px!important}
  .calc-page{padding:25px 12px 45px!important}
  .calc-hero h1{font-size:28px!important}
}


/* ===== V7 SEPARATED STYLE BLOCK ===== */

/* =========================================================
   TRABZON 112 — özgün arayüz v3
   Bu katman eski görsel yapıyı tamamen bastırır.
   ========================================================= */
:root{
  --v3-bg:#f4f2ec;
  --v3-ink:#14252d;
  --v3-muted:#68767a;
  --v3-line:#d9dedb;
  --v3-dark:#10252c;
  --v3-teal:#0c7c78;
  --v3-gold:#d29a42;
  --v3-white:#fff;
}
html{scroll-behavior:auto!important}
body{margin:0!important;background:var(--v3-bg)!important;color:var(--v3-ink)!important;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif!important}
body.welcome-active .welcome:before,body.welcome-active .welcome:after{content:none!important;display:none!important;background:none!important}
/* HEADER */
#topbar.topbar{
  height:76px!important;box-sizing:border-box!important;padding:0 34px!important;
  background:#10252c!important;border:0!important;color:#fff!important;
  position:sticky!important;top:0!important;z-index:50!important;
  box-shadow:0 8px 24px rgba(16,37,44,.10)!important
}
#topbar .brand{gap:14px!important}
#topbar .brand-logo{width:42px!important;height:42px!important;padding:7px!important;background:#fff!important;border-radius:10px!important;object-fit:contain!important}
#topbar .brand-text{font-size:14px!important;font-weight:800!important;letter-spacing:.01em!important;color:#fff!important}
#topbar .brand-text small{display:block!important;margin-top:3px!important;font-size:11px!important;font-weight:500!important;color:#aebdc0!important}
#topbar .top-actions button{border-radius:6px!important;font-weight:800!important;box-shadow:none!important}
#topbar .ghost{background:transparent!important;border:1px solid #52676c!important;color:#fff!important}
#topbar .solid{background:var(--v3-gold)!important;color:#17262b!important;border:0!important}
/* HOME: no cards, no hero image, no copied layout */
body.welcome-active{background:var(--v3-bg)!important;overflow-x:hidden!important}
body.welcome-active #welcome.welcome{
  display:block!important;min-height:calc(100svh - 76px)!important;padding:0!important;background:var(--v3-bg)!important
}
body.welcome-active .welcome-card{
  width:100%!important;max-width:none!important;min-height:calc(100svh - 76px)!important;
  margin:0!important;padding:clamp(34px,6vw,82px) clamp(24px,7vw,110px)!important;
  box-sizing:border-box!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;
  display:grid!important;grid-template-columns:minmax(280px,.85fr) minmax(430px,1.15fr)!important;
  grid-template-rows:auto 1fr auto!important;column-gap:clamp(35px,7vw,110px)!important;align-content:center!important
}
body.welcome-active .local-chip{
  grid-column:1!important;grid-row:1!important;width:max-content!important;margin:0 0 22px!important;
  padding:8px 12px!important;border-radius:4px!important;background:var(--v3-dark)!important;color:#fff!important;
  font-size:10px!important;font-weight:900!important;letter-spacing:.16em!important;text-transform:uppercase!important
}
body.welcome-active .welcome-prompt{
  grid-column:1!important;grid-row:2!important;align-self:center!important;margin:0!important;
  max-width:570px!important;color:var(--v3-ink)!important;font-size:clamp(42px,6vw,82px)!important;line-height:.94!important;
  letter-spacing:-.065em!important;font-weight:900!important;text-transform:none!important
}
body.welcome-active .welcome-prompt:before{content:"TRABZON 112 / ";display:block;color:var(--v3-teal)!important;font-size:.25em!important;letter-spacing:.16em!important;line-height:1.4!important;margin-bottom:18px!important}
body.welcome-active .audience-grid{
  grid-column:2!important;grid-row:1 / 4!important;align-self:center!important;
  display:flex!important;flex-direction:column!important;gap:12px!important;margin:0!important;padding:0!important
}
body.welcome-active .audience-card{
  width:100%!important;min-height:145px!important;box-sizing:border-box!important;
  display:grid!important;grid-template-columns:62px 1fr 34px!important;align-items:center!important;gap:22px!important;
  padding:24px 28px!important;margin:0!important;border:1px solid var(--v3-line)!important;border-radius:6px!important;
  background:#fff!important;box-shadow:none!important;text-align:left!important;position:relative!important;overflow:hidden!important;
  transition:transform .18s ease,border-color .18s ease,background .18s ease!important
}
body.welcome-active .audience-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--v3-teal)!important}
body.welcome-active .audience-card.pediatric:before{background:var(--v3-gold)!important}
body.welcome-active .audience-card.calculations:before{background:#6a5a9b!important}
body.welcome-active .audience-card:hover{transform:translateX(8px)!important;box-shadow:none!important;border-color:#aab6b5!important}
body.welcome-active .audience-icon{width:62px!important;height:62px!important;border-radius:50%!important;background:#edf3f2!important;color:var(--v3-teal)!important;display:grid!important;place-items:center!important}
body.welcome-active .pediatric .audience-icon{background:#f8f0e2!important;color:#b87925!important}
body.welcome-active .calculations .audience-icon{background:#efecf5!important;color:#6a5a9b!important}
body.welcome-active .audience-card h2{margin:0 0 5px!important;font-size:22px!important;line-height:1.05!important;color:var(--v3-ink)!important;letter-spacing:-.025em!important}
body.welcome-active .audience-card p{margin:0!important;font-size:12px!important;line-height:1.5!important;color:var(--v3-muted)!important}
body.welcome-active .arrow{width:34px!important;height:34px!important;border:1px solid var(--v3-line)!important;border-radius:50%!important;display:grid!important;place-items:center!important;font-size:17px!important;color:var(--v3-ink)!important;background:#fff!important}
body.welcome-active .source-disclaimer{grid-column:1!important;grid-row:3!important;align-self:end!important;margin:35px 0 0!important;max-width:560px!important;padding-top:16px!important;border-top:1px solid var(--v3-line)!important;color:#7c8789!important;font-size:10px!important;line-height:1.6!important}
/* CATALOG: top-first, no sidebar/card imitation */
#catalog.catalog{padding:0!important;background:var(--v3-bg)!important;min-height:calc(100svh - 76px)!important}
#catalog .catalog-head{
  position:relative!important;max-width:none!important;margin:0!important;padding:55px clamp(24px,7vw,110px) 30px!important;
  display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:30px!important;
  background:#fff!important;border-bottom:1px solid var(--v3-line)!important
}
#catalog .catalog-head:before{content:"TRABZON 112  /  KONU İNDEKSİ";position:absolute;top:20px;left:clamp(24px,7vw,110px);font-size:9px;font-weight:900;letter-spacing:.18em;color:var(--v3-teal)!important}
#catalog .catalog-head h2{font-size:clamp(38px,5vw,66px)!important;line-height:.95!important;letter-spacing:-.055em!important;color:var(--v3-ink)!important;margin:0!important}
#catalog .catalog-sub{font-size:12px!important;color:var(--v3-muted)!important;margin:12px 0 0!important}
#catalog .search-wrap{min-width:280px!important}
#catalog .search{height:48px!important;border:1px solid var(--v3-line)!important;border-radius:4px!important;background:#f8f8f5!important;box-shadow:none!important;padding-left:16px!important}
#catalog .search:focus{border-color:var(--v3-teal)!important;outline:0!important;box-shadow:0 0 0 3px rgba(12,124,120,.08)!important}
#catalog .mobile-section-picker{display:none!important}
#catalog .catalog-body{max-width:none!important;margin:0!important;padding:30px clamp(24px,7vw,110px) 70px!important;display:block!important}
#catalog .section-nav{position:sticky!important;top:76px!important;z-index:20!important;display:flex!important;gap:0!important;overflow-x:auto!important;padding:0!important;margin:0 0 30px!important;border-bottom:1px solid var(--v3-line)!important;background:var(--v3-bg)!important}
#catalog .section-nav button{flex:0 0 auto!important;border:0!important;border-bottom:3px solid transparent!important;border-radius:0!important;background:transparent!important;padding:13px 17px!important;color:#788386!important;font-size:11px!important;font-weight:850!important;text-transform:uppercase!important;letter-spacing:.04em!important;box-shadow:none!important}
#catalog .section-nav button:hover,#catalog .section-nav button.active{background:transparent!important;color:var(--v3-teal)!important;border-bottom-color:var(--v3-teal)!important;box-shadow:none!important}
#catalog .sections{display:block!important;max-width:1180px!important;margin:0 auto!important}
#catalog .topic-section{margin:0 0 44px!important;padding:0!important;background:transparent!important;border:0!important}
#catalog .topic-section h3{display:flex!important;align-items:center!important;gap:12px!important;margin:0 0 12px!important;padding:0 0 10px!important;border-bottom:2px solid var(--v3-ink)!important;font-size:15px!important;letter-spacing:.02em!important;text-transform:uppercase!important;color:var(--v3-ink)!important}
#catalog .topic-section h3:before{content:"";width:9px;height:9px;background:var(--v3-gold)!important;display:block!important;transform:rotate(45deg)!important}
#catalog .topic-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:0!important;border-top:0!important}
#catalog .topic{
  min-height:70px!important;padding:14px 8px!important;border:0!important;border-bottom:1px solid var(--v3-line)!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:15px!important;text-align:left!important
}
#catalog .topic:before{content:"→";order:2;color:#aab4b4!important;font-size:18px!important;transition:transform .15s ease,color .15s ease!important}
#catalog .topic:hover{background:#fff!important;box-shadow:none!important;padding-left:17px!important}
#catalog .topic:hover:before{color:var(--v3-teal)!important;transform:translateX(3px)!important}
#catalog .topic-title{font-size:13px!important;font-weight:750!important;color:var(--v3-ink)!important}
#catalog .topic-meta{margin-left:auto!important}
#catalog .page-pill{font-size:9px!important;font-weight:800!important;color:#8b9697!important;background:transparent!important;border:0!important;padding:0!important}
/* CALCULATOR */
#calcScreen.calc-page{padding:55px clamp(24px,7vw,110px) 70px!important;background:var(--v3-bg)!important;min-height:calc(100svh - 76px)!important}
#calcScreen .calc-shell{max-width:900px!important;margin:0 auto!important}
#calcScreen .calc-hero{padding:0 0 25px!important;border-radius:0!important;background:transparent!important;color:var(--v3-ink)!important;box-shadow:none!important;border-bottom:2px solid var(--v3-ink)!important}
#calcScreen .calc-hero h1{font-size:clamp(40px,5vw,64px)!important;letter-spacing:-.06em!important;color:var(--v3-ink)!important}
#calcScreen .eyebrow{color:var(--v3-teal)!important;font-size:10px!important;font-weight:900!important;letter-spacing:.13em!important;text-transform:uppercase!important}
#calcScreen .notice{border-radius:4px!important;background:#fff!important;border:1px solid var(--v3-line)!important;box-shadow:none!important}
#calcScreen .patient-card,#calcScreen .calc-panel{border-radius:5px!important;border:1px solid var(--v3-line)!important;box-shadow:none!important;background:#fff!important}
#calcScreen .solid{border-radius:4px!important;background:var(--v3-teal)!important;color:#fff!important}
/* viewer remains functional but gets distinct framing */
#viewer.viewer{background:#0c171b!important}
#viewer .viewer-bar{background:#10252c!important;border-bottom:1px solid #294046!important}
#viewer .viewer-bar button{border-radius:4px!important;background:#1b353b!important}
#viewer .pdf-stage{background:#0c171b!important}
/* FOOTER */
#siteFooter.site-footer{background:#10252c!important;border:0!important;color:#d8e1e2!important;padding:18px 24px!important}
#siteFooter .footer-download{border-radius:4px!important;background:var(--v3-gold)!important;color:#16252a!important}
@media(max-width:800px){
  #topbar.topbar{height:68px!important;padding:0 16px!important}
  #topbar .brand-text{font-size:12px!important}
  #topbar .brand-text small{display:none!important}
  body.welcome-active .welcome-card{min-height:calc(100svh - 68px)!important;padding:34px 18px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;gap:28px!important}
  body.welcome-active .local-chip,.welcome-prompt,.audience-grid,.source-disclaimer{grid-column:auto!important;grid-row:auto!important}
  body.welcome-active .welcome-prompt{font-size:clamp(43px,14vw,70px)!important}
  body.welcome-active .audience-grid{display:flex!important;gap:9px!important}
  body.welcome-active .audience-card{min-height:108px!important;padding:17px!important;grid-template-columns:48px 1fr 28px!important;gap:13px!important}
  body.welcome-active .audience-icon{width:48px!important;height:48px!important}
  body.welcome-active .audience-card h2{font-size:17px!important}
  body.welcome-active .audience-card p{font-size:10px!important}
  #catalog .catalog-head{padding:48px 18px 20px!important;display:block!important}
  #catalog .catalog-head:before{left:18px!important}
  #catalog .search-wrap{min-width:0!important;margin-top:20px!important}
  #catalog .catalog-body{padding:15px 18px 50px!important}
  #catalog .section-nav{top:68px!important}
  #catalog .topic-grid{grid-template-columns:1fr!important}
  #catalog .topic{min-height:64px!important}
}


/* ===== V7 SEPARATED STYLE BLOCK ===== */

/* TRABZON 112 V5 — konu ekranı: sol dikey navigasyon + temiz liste */
:root{
 --v5-bg:#f3f5f4; --v5-panel:#ffffff; --v5-ink:#14262d; --v5-muted:#6d7b80;
 --v5-line:#dfe5e3; --v5-teal:#087f78; --v5-teal-soft:#e8f4f2; --v5-gold:#c89532;
}

/* KATALOG GENEL */
#catalog.catalog{
 background:var(--v5-bg)!important; min-height:calc(100svh - 76px)!important; padding:0!important;
}
#catalog .catalog-head{
 max-width:none!important; margin:0!important; padding:42px clamp(24px,6vw,92px) 28px!important;
 background:#fff!important; border-bottom:1px solid var(--v5-line)!important;
 display:flex!important; align-items:flex-end!important; justify-content:space-between!important; gap:40px!important;
}
#catalog .catalog-head h2{
 margin:0!important; font-size:clamp(38px,5vw,64px)!important; line-height:.95!important;
 letter-spacing:-.055em!important; font-weight:950!important; color:var(--v5-ink)!important;
}
#catalog .catalog-head h2:before{
 content:"TRABZON 112  /  KONU İNDEKSİ"; display:block; margin-bottom:13px;
 font-size:10px; line-height:1; letter-spacing:.19em; font-weight:900; color:var(--v5-teal);
}
#catalog .catalog-sub{margin:14px 0 0!important; color:var(--v5-muted)!important; font-size:13px!important}
#catalog .search-wrap{
 width:320px!important; min-width:260px!important; background:#f7f9f8!important;
 border:1px solid var(--v5-line)!important; border-radius:3px!important; box-shadow:none!important;
}
#catalog .search{height:48px!important; background:transparent!important; border:0!important; color:var(--v5-ink)!important}
#catalog .search:focus{outline:0!important;box-shadow:inset 0 -2px 0 var(--v5-teal)!important}

/* SOL MENÜ */
#catalog .catalog-body{
 max-width:1320px!important; margin:0 auto!important; padding:30px clamp(18px,4vw,58px) 80px!important;
 display:grid!important; grid-template-columns:245px minmax(0,1fr)!important; align-items:start!important; gap:38px!important;
}
#catalog .section-nav{
 position:sticky!important; top:92px!important; z-index:10!important;
 display:flex!important; flex-direction:column!important; gap:3px!important; overflow:visible!important;
 padding:8px!important; margin:0!important; border:1px solid var(--v5-line)!important;
 border-radius:8px!important; background:#fff!important; box-shadow:0 12px 28px rgba(20,38,45,.06)!important;
}
#catalog .section-nav:before{
 content:"KONU GRUPLARI"; display:block; padding:11px 12px 10px;
 font-size:9px; font-weight:900; letter-spacing:.16em; color:#8a9799;
 border-bottom:1px solid var(--v5-line); margin-bottom:4px;
}
#catalog .section-nav button{
 width:100%!important; flex:none!important; display:flex!important; align-items:center!important; justify-content:space-between!important;
 min-height:44px!important; padding:9px 11px!important; border:0!important; border-left:3px solid transparent!important;
 border-radius:4px!important; background:transparent!important; color:#6f7d80!important; text-align:left!important;
 font-size:10px!important; line-height:1.3!important; font-weight:850!important; letter-spacing:.02em!important;
 text-transform:none!important; box-shadow:none!important;
}
#catalog .section-nav button:after{content:"›";font-size:17px;color:#a5b0b1;line-height:1;margin-left:8px}
#catalog .section-nav button:hover{background:#f5f8f7!important;color:var(--v5-ink)!important}
#catalog .section-nav button.active{
 background:var(--v5-teal-soft)!important; color:var(--v5-teal)!important; border-left-color:var(--v5-teal)!important;
 box-shadow:none!important;
}
#catalog .section-nav button.active:after{color:var(--v5-teal)}

/* İÇERİK */
#catalog .sections{max-width:none!important; margin:0!important; min-width:0!important}
#catalog .topic-section{
 margin:0 0 34px!important; padding:0!important; background:#fff!important;
 border:1px solid var(--v5-line)!important; border-radius:8px!important; overflow:hidden!important;
 box-shadow:0 10px 28px rgba(20,38,45,.045)!important;
}
#catalog .topic-section h3{
 margin:0!important; padding:17px 20px!important; border:0!important; border-bottom:1px solid var(--v5-line)!important;
 display:flex!important; align-items:center!important; gap:10px!important; background:#fff!important;
 color:var(--v5-ink)!important; font-size:13px!important; line-height:1.2!important; font-weight:900!important;
 letter-spacing:.05em!important; text-transform:uppercase!important;
}
#catalog .topic-section h3:before{
 content:""!important; width:7px!important; height:22px!important; display:block!important; flex:0 0 7px;
 background:var(--v5-gold)!important; transform:none!important;
}
#catalog .topic-grid{
 display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:0!important;
}
#catalog .topic{
 min-height:78px!important; width:100%!important; box-sizing:border-box!important;
 margin:0!important; padding:16px 20px!important; border:0!important; border-bottom:1px solid var(--v5-line)!important;
 border-right:1px solid var(--v5-line)!important; border-radius:0!important; background:#fff!important;
 display:flex!important; align-items:center!important; justify-content:space-between!important; gap:18px!important;
 text-align:left!important; box-shadow:none!important; position:relative!important;
}
#catalog .topic:nth-child(even){border-right:0!important}
#catalog .topic:hover{background:#f7faf9!important;transform:none!important}
#catalog .topic:before{content:""!important;display:block!important;order:2;width:26px;height:26px;flex:0 0 26px;border:1px solid #d9e2e0;border-radius:50%;background:#fff!important}
#catalog .topic:after{content:"→"!important;position:absolute!important;right:27px!important;color:var(--v5-teal)!important;font-size:14px!important;font-weight:900!important;order:3}
#catalog .topic-title{
 display:block!important; font-size:13px!important; line-height:1.4!important; color:var(--v5-ink)!important;
 font-weight:800!important; margin:0!important; max-width:calc(100% - 48px)!important;
}
#catalog .topic-meta,#catalog .page-pill{display:none!important}
#catalog .topic:last-child,#catalog .topic:nth-last-child(2){border-bottom:0!important}
#catalog .empty{background:#fff!important;border:1px solid var(--v5-line)!important;padding:30px!important;border-radius:8px!important;color:var(--v5-muted)!important}

/* Mobilde dikey menü dropdown olarak kalabilir; masaüstünde sol menü */
@media(max-width:900px){
 #catalog .catalog-head{padding:32px 20px 24px!important;align-items:flex-start!important;flex-direction:column!important;gap:20px!important}
 #catalog .search-wrap{width:100%!important;min-width:0!important}
 #catalog .catalog-body{grid-template-columns:1fr!important;padding:20px!important;gap:18px!important}
 #catalog .section-nav{position:sticky!important;top:66px!important;display:flex!important;overflow-x:auto!important;flex-direction:row!important;padding:6px!important;border-radius:6px!important;white-space:nowrap!important}
 #catalog .section-nav:before{display:none!important}
 #catalog .section-nav button{width:auto!important;min-height:38px!important;border-left:0!important;border-bottom:3px solid transparent!important;flex:0 0 auto!important}
 #catalog .section-nav button.active{border-left:0!important;border-bottom-color:var(--v5-teal)!important}
}
@media(max-width:680px){
 #catalog .catalog-head h2{font-size:38px!important}
 #catalog .catalog-sub{font-size:11px!important}
 #catalog .catalog-body{padding:14px 10px 50px!important}
 #catalog .topic-grid{grid-template-columns:1fr!important}
 #catalog .topic{min-height:65px!important;border-right:0!important;padding:14px 15px!important}
 #catalog .topic:last-child,#catalog .topic:nth-last-child(2){border-bottom:1px solid var(--v5-line)!important}
 #catalog .topic:last-child{border-bottom:0!important}
 #catalog .topic-title{font-size:12px!important}
}