/*
==========================================
NRCube Resources Center
==========================================
*/

.resources-main {
    min-height: 100vh;
    padding-top: var(--header-height);
    color: #173337;
    background: #f3f8f7;
}

.resources-hero {
    position: relative;
    padding: 92px 0 72px;
    text-align: center;
    overflow: hidden;
    background: linear-gradient(135deg, #071417, #0b3438 68%, #14565a);
}

.resources-hero h1 {
    max-width: 980px;
    margin: 0 auto;
    color: var(--color-white);
    font-family: var(--font-heading);
    font-size: clamp(2.6rem, 7vw, 5rem);
    line-height: 1;
}

.resources-hero p {
    max-width: 780px;
    margin: 18px auto 0;
    color: rgba(255, 255, 255, 0.76);
    font-size: 1.05rem;
    line-height: 1.8;
}

.resources-knowledge-hero {
    min-height: 610px;
    display: flex;
    align-items: center;
    text-align: left;
    background-image: url('../../../assets/branding/resources/resources-knowledge-hero.png');
    background-size: cover;
    background-position: center;
}

.resources-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(4, 20, 23, .96) 0%, rgba(5, 26, 29, .86) 38%, rgba(5, 26, 29, .25) 72%, rgba(5, 26, 29, .12) 100%);
}

.resources-hero-copy { position: relative; z-index: 1; }
.resources-knowledge-hero h1,
.resources-knowledge-hero p { max-width: 680px; margin-left: 0; }
.resources-knowledge-hero h1 { font-size: clamp(3rem, 6vw, 5.7rem); line-height: .98; }
.resources-knowledge-hero p { font-size: 1.1rem; }
.resources-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

.resources-main .section { padding: 84px 0; }
.resources-main .section-kicker { color: #0f6f73; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }
.resources-main h2 { margin: 8px 0 0; color: #102f33; font-family: var(--font-heading); font-size: clamp(2rem, 4vw, 3.25rem); }
.resource-section-intro { max-width: 820px; color: #527075; line-height: 1.75; }

.resource-question-section { background: #fff; }
.resource-question-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 34px; }
.resource-question-grid a { display: grid; grid-template-columns: 46px 1fr; gap: 6px 14px; min-height: 156px; padding: 22px; border: 1px solid #d7e6e4; border-radius: 16px; color: #14383c; background: #f8fbfa; text-decoration: none; transition: .2s ease; }
.resource-question-grid a:hover { border-color: #d79b32; transform: translateY(-3px); box-shadow: 0 16px 34px rgba(11, 57, 61, .10); }
.resource-question-grid span { grid-row: 1 / 3; color: #d79b32; font: 900 1rem var(--font-heading); }
.resource-question-grid strong { font: 800 1.15rem var(--font-heading); }
.resource-question-grid small { color: #60797d; line-height: 1.55; }

.resource-featured-section { background: linear-gradient(145deg, #08272b, #0c3d41); }
.resource-featured-section .section-kicker { color: #e2ae51; }
.resource-featured-section h2 { color: #fff; }
.resource-feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 34px; }
.resource-feature-card { position: relative; display: flex; flex-direction: column; min-height: 330px; padding: 28px; border: 1px solid rgba(255,255,255,.13); border-radius: 20px; color: #fff; background: linear-gradient(160deg, rgba(255,255,255,.10), rgba(255,255,255,.035)); text-decoration: none; overflow: hidden; }
.resource-feature-card:hover { border-color: rgba(215,155,50,.65); transform: translateY(-4px); }
.resource-feature-number { position: absolute; top: 16px; right: 20px; color: rgba(255,255,255,.12); font: 900 4rem var(--font-heading); }
.resource-feature-card h3 { position: relative; margin: 36px 0 12px; max-width: 300px; color: #fff; font: 800 1.65rem var(--font-heading); }
.resource-feature-card p { color: rgba(255,255,255,.7); line-height: 1.7; }
.resource-card-link { margin-top: auto; padding-top: 20px; color: #e2ae51; font-weight: 850; }

.resource-directory { background: #edf5f3; }
.resource-directory-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 34px; }
.resource-section-card { padding: 30px; border: 1px solid #d3e4e1; border-radius: 20px; background: #fff; box-shadow: 0 14px 34px rgba(13,63,67,.07); }
.resource-section-heading { display: flex; gap: 16px; align-items: flex-start; }
.resource-section-heading > span { color: #d79b32; font: 900 1.2rem var(--font-heading); }
.resource-section-heading p { margin: 0 0 4px; color: #0f6f73; font-size: .72rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.resource-section-card h3 { margin: 0; color: #14363a; font: 850 1.55rem var(--font-heading); }
.resource-section-card > p, .resource-section-card li { color: #60797d; line-height: 1.65; }
.resource-section-card ul { padding-left: 20px; }
.resource-section-card > a { color: #0f6f73; font-weight: 850; text-decoration: none; }

.resource-decision-chain { background: #fff; }
.resource-chain-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; align-items: center; }
.resource-chain-layout > div > p:last-child { color: #60797d; line-height: 1.75; }
.resource-chain { margin: 0; padding: 0; list-style: none; }
.resource-chain li { position: relative; display: grid; grid-template-columns: 56px 1fr; gap: 16px; padding: 18px 0; }
.resource-chain li:not(:last-child)::after { content: ''; position: absolute; left: 27px; top: 65px; bottom: -6px; width: 2px; background: #dce9e7; }
.resource-chain li > span { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; color: #fff; background: #0f6f73; font: 850 .82rem var(--font-heading); }
.resource-chain strong, .resource-chain small { display: block; }
.resource-chain strong { color: #163b3f; font: 850 1.15rem var(--font-heading); }
.resource-chain small { margin-top: 5px; color: #627d81; line-height: 1.5; }

.resource-closing { color: #fff; background: linear-gradient(125deg, #0b3438, #0f6f73); }
.resource-closing-inner { display: grid; grid-template-columns: 1fr auto; gap: 48px; align-items: center; }
.resource-closing h2 { color: #fff; }
.resource-closing p { max-width: 760px; color: rgba(255,255,255,.74); line-height: 1.7; }
.resource-closing .section-kicker { color: #e2ae51; }


.resources-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 34px;
}

/* Unlisted owner market-notes workspace. This is a visual gate, not server authentication. */
.owner-notes-main { min-height: 100vh; background: #edf5f3; }
.owner-notes-main [hidden] { display: none !important; }
.owner-login { min-height: calc(100vh - var(--header-height)); display: grid; place-items: center; padding: 72px 20px; background: radial-gradient(circle at 80% 10%, rgba(215,155,50,.2), transparent 28%), linear-gradient(135deg, #071b1e, #0d464a); }
.owner-login-card { width: min(100%, 520px); padding: 42px; border: 1px solid rgba(255,255,255,.15); border-radius: 24px; color: #fff; background: rgba(4,25,28,.88); box-shadow: 0 28px 70px rgba(0,0,0,.3); }
.owner-login-card h1 { margin: 8px 0 12px; font: 850 clamp(2.4rem, 7vw, 4rem)/1 var(--font-heading); }
.owner-login-card > p:not(.section-kicker) { color: rgba(255,255,255,.72); line-height: 1.65; }
.owner-login-card form { display: grid; gap: 16px; margin-top: 26px; }
.owner-login-card label { display: grid; gap: 7px; font-weight: 800; }
.owner-login-card input { min-height: 50px; padding: 0 14px; border: 1px solid rgba(255,255,255,.24); border-radius: 10px; color: #fff; background: rgba(255,255,255,.08); font: inherit; }
.owner-login-error { margin: 0; color: #ffd28b !important; font-weight: 800; }
.owner-security-note { margin: 24px 0 0; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.12); font-size: .82rem; }
.owner-notes-hero { padding: 82px 0 72px; color: #fff; background: linear-gradient(130deg, #09272b, #0e5559); }
.owner-notes-hero-inner { display: grid; grid-template-columns: 1fr auto; gap: 42px; align-items: end; }
.owner-notes-hero h1 { max-width: 900px; margin: 8px 0 14px; font: 850 clamp(2.6rem, 6vw, 5rem)/1 var(--font-heading); }
.owner-notes-hero p:not(.section-kicker) { max-width: 760px; color: rgba(255,255,255,.72); line-height: 1.7; }
.owner-compliance-section { background: #f7fbfa; }
.owner-compliance-intro { display: grid; grid-template-columns: minmax(0, .85fr) minmax(320px, 1.15fr); gap: clamp(30px, 6vw, 84px); align-items: end; }
.owner-compliance-intro h2 { max-width: 720px; margin: 8px 0 0; color: #17383b; font: 850 clamp(2rem, 4vw, 3.35rem)/1.08 var(--font-heading); }
.owner-compliance-intro > p { margin: 0; color: #587276; line-height: 1.75; }
.owner-compliance-status { margin-top: 34px; padding: 24px 28px; border: 1px solid rgba(15,111,115,.2); border-left: 5px solid #0f6f73; border-radius: 16px; background: #e8f5f3; }
.owner-compliance-status strong { display: block; margin-bottom: 7px; color: #0f6468; font: 850 .82rem var(--font-heading); letter-spacing: .09em; text-transform: uppercase; }
.owner-compliance-status p { margin: 0; color: #36595c; line-height: 1.7; }
.owner-compliance-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 22px; }
.owner-compliance-card { padding: 28px; border: 1px solid #d5e5e2; border-radius: 19px; background: #fff; box-shadow: 0 14px 34px rgba(13,63,67,.07); }
.owner-compliance-card > span { color: #b87316; font: 850 .75rem var(--font-heading); letter-spacing: .09em; text-transform: uppercase; }
.owner-compliance-card h3 { margin: 14px 0 9px; color: #17383b; font: 850 1.3rem var(--font-heading); }
.owner-compliance-card p { margin: 0 0 18px; color: #5b7477; line-height: 1.7; }
.owner-compliance-card a { color: #0f6f73; font-weight: 850; text-decoration: none; }
.owner-compliance-card a:hover { color: #a9650c; }
.owner-compliance-card--required { border-top: 4px solid #0f6f73; }
.owner-compliance-card--review { border-top: 4px solid #d79b32; }
.owner-compliance-card--confirm { border-top: 4px solid #69898c; }
.owner-compliance-links { display: flex; flex-wrap: wrap; gap: 18px; }
.owner-compliance-documents { display: grid; grid-template-columns: minmax(240px, .72fr) minmax(0, 1.28fr); gap: 38px; margin-top: 22px; padding: 30px; border-radius: 20px; color: #fff; background: linear-gradient(135deg, #123f44, #0f6f73); box-shadow: 0 18px 42px rgba(6,43,47,.16); }
.owner-compliance-documents h3 { margin: 8px 0 0; color: #fff; font: 850 1.55rem var(--font-heading); }
.owner-compliance-documents ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 22px; margin: 0; padding: 0; list-style: none; }
.owner-compliance-documents li { position: relative; padding-left: 22px; color: rgba(255,255,255,.82); line-height: 1.55; }
.owner-compliance-documents li::before { content: "✓"; position: absolute; left: 0; color: #f0c36c; font-weight: 900; }
.owner-compliance-note { margin: 20px 0 0; color: #60797d; font-size: .86rem; line-height: 1.65; }
.owner-company-section { background: #edf5f3; }
.owner-section-heading { display: grid; grid-template-columns: 1fr minmax(240px, 420px); gap: 30px; align-items: end; }
.owner-section-heading > p { color: #60797d; line-height: 1.65; }
.owner-company-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 34px; }
.owner-company-card { display: grid; grid-template-columns: 48px 1fr auto; gap: 18px; align-items: center; min-height: 126px; padding: 24px; border: 1px solid #d3e4e1; border-radius: 18px; color: #173337; background: #fff; text-decoration: none; box-shadow: 0 14px 34px rgba(13,63,67,.07); }
.owner-company-card:hover { border-color: #d79b32; transform: translateY(-3px); }
.owner-company-card > span { color: #d79b32; font: 900 1rem var(--font-heading); }
.owner-company-card h3 { margin: 0; color: #14363a; font: 850 1.25rem var(--font-heading); }
.owner-company-card p { margin: 6px 0 0; color: #60797d; font-size: .9rem; }
.owner-company-card > strong { color: #0f6f73; font-size: .8rem; white-space: nowrap; }
.owner-access-section { padding-top: 10px !important; background: #edf5f3; }
.owner-access-table-wrap { margin-top: 30px; border: 1px solid #d3e4e1; border-radius: 18px; background: #fff; box-shadow: 0 14px 34px rgba(13,63,67,.07); overflow-x: auto; }
.owner-access-table { width: 100%; border-collapse: collapse; text-align: left; }
.owner-access-table th, .owner-access-table td { padding: 17px 22px; border-bottom: 1px solid #e1ecea; }
.owner-access-table th { color: #fff; background: #0d4d51; font: 800 .78rem var(--font-heading); letter-spacing: .08em; text-transform: uppercase; }
.owner-access-table tbody tr:last-child td { border-bottom: 0; }
.owner-access-table td:first-child { color: #c48220; font-weight: 900; }
.owner-access-table td { color: #526f73; }

@media (max-width: 760px) {
    .owner-login-card { padding: 28px 22px; }
    .owner-notes-hero-inner, .owner-section-heading, .owner-company-grid, .owner-compliance-intro, .owner-compliance-grid, .owner-compliance-documents { grid-template-columns: 1fr; }
    .owner-compliance-documents ul { grid-template-columns: 1fr; }
    .owner-company-card { grid-template-columns: 38px 1fr; }
    .owner-company-card > strong { grid-column: 2; }
    .owner-access-table th, .owner-access-table td { padding: 14px 16px; }
}

.resource-topic-card,
.resource-article-card,
.article-panel {
    border: 1px solid #d5e4e2;
    border-radius: var(--radius-lg);
    background: #fff;
    box-shadow: 0 14px 34px rgba(11, 57, 61, .07);
}

.resource-topic-card,
.resource-article-card {
    display: grid;
    gap: 12px;
    min-height: 218px;
    padding: 24px;
    color: #173337;
    text-decoration: none;
}

.resource-topic-card:hover,
.resource-article-card:hover {
    border-color: rgba(215, 155, 50, 0.72);
    transform: translateY(-3px);
}

.resource-topic-card h2,
.resource-article-card h2,
.resource-article-card h3,
.article-panel h2 {
    margin: 0;
    color: #15383c;
    font-family: var(--font-heading);
}

.resource-topic-card p,
.resource-article-card p,
.article-panel p,
.article-panel li {
    color: #60797d;
    line-height: 1.75;
}

.resource-tag {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 30px;
    padding: 0 10px;
    border-radius: var(--radius-sm);
    color: var(--color-charcoal);
    background: rgba(215, 155, 50, 0.92);
    font: 800 0.72rem var(--font-heading);
    text-transform: uppercase;
}

.article-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.35fr);
    gap: 24px;
}

.article-panel {
    padding: 26px;
}

.article-panel + .article-panel {
    margin-top: 18px;
}

.article-panel ul {
    margin: 18px 0 0;
    padding-left: 20px;
}

.article-side {
    position: sticky;
    top: calc(var(--header-height) + 24px);
    align-self: start;
}

.resource-back-row { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 40px; }
.resource-back-row a { color: #e2ae51; font-weight: 800; text-decoration: none; }
.resource-hub-hero, .resource-article-hero { padding-top: 52px; }
.resource-article-section { background: #edf5f3; }
.resource-article-number { color: #d79b32; font: 900 .86rem var(--font-heading); }
.article-review-panel { border-left: 4px solid #d79b32; }
.article-panel a { color: #0f6f73; font-weight: 750; }

.catalog-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 22px;
}

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

.resource-stat {
    padding: 18px;
    border-radius: var(--radius-md);
    background: rgba(0, 0, 0, 0.18);
}

.resource-stat strong {
    display: block;
    color: var(--color-gold);
    font: 800 1.7rem var(--font-heading);
}

.resource-stat span {
    display: block;
    margin-top: 6px;
    color: var(--color-text-muted);
}

/* Long-form optical transceiver selection guide */
.selection-guide-main { background: #eef6f5; }
.selection-guide-hero { min-height: 570px; display: flex; align-items: center; text-align: left; background: radial-gradient(circle at 78% 28%, rgba(33,157,158,.28), transparent 24%), linear-gradient(120deg,#06171a,#0a3a3e 68%,#11656a); }
.selection-guide-hero h1, .selection-guide-hero p { margin-left: 0; }
.selection-guide-hero h1 { max-width: 940px; font-size: clamp(3.2rem,7vw,6.4rem); }
.selection-guide-hero p { max-width: 800px; }
.selection-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.selection-introduction { background: #fff; }
.selection-intro-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: start; }
.selection-intro-grid p { color: #567276; font-size: 1.05rem; line-height: 1.85; }
.selection-section-heading { max-width: 900px; margin-bottom: 38px; }
.selection-section-heading > p:last-child { color: #60797d; line-height: 1.7; }
.selection-steps { display: grid; gap: 22px; }
.selection-step { border: 1px solid #d3e4e1; border-radius: 22px; background: #fff; box-shadow: 0 16px 38px rgba(10,55,60,.07); overflow: hidden; }
.selection-step > header { display: grid; grid-template-columns: 72px 1fr; gap: 22px; padding: 28px 32px; color: #fff; background: linear-gradient(120deg,#0b363a,#0d5b60); }
.selection-step > header > span { color: #e2ae51; font: 900 1.3rem var(--font-heading); }
.selection-step h2 { margin: 0; color: #fff; font-size: clamp(1.5rem,3vw,2.25rem); }
.selection-step header p { margin: 8px 0 0; color: rgba(255,255,255,.68); }
.selection-step-body { padding: 30px 34px; color: #567276; line-height: 1.75; }
.selection-detail-grid, .selection-distance-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin: 22px 0; }
.selection-detail-grid > div, .selection-distance-grid > div { padding: 18px; border-radius: 13px; background: #eff6f5; }
.selection-detail-grid strong, .selection-detail-grid span, .selection-distance-grid strong, .selection-distance-grid span { display: block; }
.selection-detail-grid strong, .selection-distance-grid strong { color: #163e42; }
.selection-detail-grid span, .selection-distance-grid span { margin-top: 5px; font-size: .9rem; }
.selection-emphasis { padding: 15px 18px; border-left: 4px solid #d79b32; color: #214a4e !important; background: #fff8e9; }
.selection-speed-row { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 24px; }
.selection-speed-row span { padding: 8px 13px; border-radius: 999px; color: #fff; background: #0f6f73; font-weight: 850; }
.selection-mode-grid, .selection-two-column { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin: 20px 0; }
.selection-mode-grid > div, .selection-two-column > div { padding: 22px; border: 1px solid #d9e7e5; border-radius: 15px; }
.selection-mode-grid b, .selection-mode-grid span { display: block; }
.selection-mode-grid b { margin-bottom: 10px; color: #173f43; }
.selection-mode-grid span { padding: 4px 0; }
.selection-two-column h3 { margin: 12px 0 4px; color: #173f43; font: 850 1.8rem var(--font-heading); }
.selection-connector-grid, .selection-tech-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; margin: 22px 0; }
.selection-connector-grid > div, .selection-tech-grid > div { padding: 18px; border-radius: 13px; background: #eff6f5; }
.selection-connector-grid b, .selection-connector-grid span, .selection-tech-grid b, .selection-tech-grid span { display: block; }
.selection-connector-grid b, .selection-tech-grid b { color: #0f6f73; font: 900 1.15rem var(--font-heading); }
.selection-connector-grid span, .selection-tech-grid span { margin-top: 6px; font-size: .86rem; line-height: 1.45; }
.selection-warning { margin-top: 24px; padding: 22px; border: 1px solid #e4be72; border-radius: 15px; background: #fff8e9; }
.selection-warning strong { color: #8b5a05; font: 900 1rem var(--font-heading); text-transform: uppercase; letter-spacing: .08em; }
.selection-warning p { margin-bottom: 0; }
.selection-check-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; padding: 0; list-style: none; }
.selection-check-list li, .selection-review-card li { position: relative; padding-left: 26px; }
.selection-check-list li::before, .selection-review-card li::before { content: '✓'; position: absolute; left: 0; color: #0f8787; font-weight: 900; }
.selection-question-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.selection-question-list p { margin: 0; padding: 16px 18px; border-radius: 12px; background: #eff6f5; }
.selection-mistakes { background: #fff; }
.selection-mistake-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.selection-mistake-grid article { padding: 27px; border: 1px solid #d5e4e2; border-radius: 18px; background: #f8fbfa; }
.selection-mistake-grid article > span { color: #c5821e; font: 850 .76rem var(--font-heading); letter-spacing: .1em; text-transform: uppercase; }
.selection-mistake-grid h3 { color: #173f43; font: 850 1.35rem var(--font-heading); }
.selection-mistake-grid p { color: #60797d; line-height: 1.65; }
.selection-bad, .selection-good { margin-top: 16px; padding: 14px; border-radius: 11px; }
.selection-bad { color: #8d3434; background: #fff0ef; text-decoration: line-through; }
.selection-good { color: #225a4c; background: #e8f6ef; }
.selection-good p { margin-bottom: 0; color: #3f6b60; }
.selection-review { color: #fff; background: linear-gradient(130deg,#08272b,#0d5055); }
.selection-review-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 60px; align-items: start; }
.selection-review h2 { color: #fff; }
.selection-review p { color: rgba(255,255,255,.72); line-height: 1.75; }
.selection-review blockquote { margin: 28px 0 0; padding-left: 20px; border-left: 4px solid #d79b32; color: #fff; font: 800 1.35rem/1.5 var(--font-heading); }
.selection-review-card { padding: 28px; border: 1px solid rgba(255,255,255,.13); border-radius: 20px; background: rgba(255,255,255,.08); }
.selection-review-card h3 { margin-top: 0; color: #fff; font: 850 1.6rem var(--font-heading); }
.selection-review-card ul { padding: 0; list-style: none; color: rgba(255,255,255,.78); line-height: 1.9; }
.selection-summary { text-align: center; background: #fff; }
.selection-summary h2, .selection-summary > .container > p { max-width: 900px; margin-left: auto; margin-right: auto; }
.selection-equation { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; align-items: center; margin: 34px auto; }
.selection-equation span, .selection-equation strong { padding: 12px 16px; border-radius: 12px; }
.selection-equation span { color: #164247; background: #e9f4f2; font-weight: 800; }
.selection-equation i { color: #c5821e; font-style: normal; font-weight: 900; }
.selection-equation strong { color: #fff; background: #0f6f73; }
.selection-summary .catalog-actions { justify-content: center; }

/* QSFP112 technology library */
.qsfp112-main { background: #eef6f5; }
.qsfp112-hero { min-height: 590px; display: flex; align-items: center; text-align: left; background: radial-gradient(circle at 78% 22%, rgba(33,157,158,.28), transparent 24%), radial-gradient(circle at 66% 76%, rgba(215,155,50,.14), transparent 25%), linear-gradient(120deg,#06171a,#0a3a3e 68%,#11656a); }
.qsfp112-hero h1, .qsfp112-hero p { margin-left: 0; }
.qsfp112-hero h1 { max-width: 1080px; font-size: clamp(3.3rem,7vw,6.5rem); }
.qsfp112-hero p { max-width: 850px; }
.qsfp112-architecture { background: #fff; }
.qsfp112-architecture-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 58px; align-items: center; }
.qsfp112-architecture p, .qsfp112-deployments p, .qsfp112-families p, .qsfp112-breakout p, .qsfp112-infrastructure p, .qsfp112-migration p, .qsfp112-summary p { color: #60797d; line-height: 1.7; }
.qsfp112-lane-table { display: grid; gap: 9px; margin-top: 24px; }
.qsfp112-lane-table > div { display: grid; grid-template-columns: 1fr 1.4fr .7fr; gap: 14px; align-items: center; padding: 16px 18px; border-radius: 12px; background: #eef6f5; }
.qsfp112-lane-table span { color: #173f43; font-weight: 850; }
.qsfp112-lane-table b { color: #60797d; }
.qsfp112-lane-table strong { color: #0f6f73; text-align: right; }
.qsfp112-lane-table .is-current { color: #fff; background: #0f6f73; }
.qsfp112-lane-table .is-current span, .qsfp112-lane-table .is-current b, .qsfp112-lane-table .is-current strong { color: #fff; }
.qsfp112-principle { display: grid; gap: 10px; padding: 29px; border-radius: 19px; color: #fff; background: linear-gradient(140deg,#0b3539,#0e6468); }
.qsfp112-principle span { color: #e8b85d; font: 850 .75rem var(--font-heading); letter-spacing: .09em; text-transform: uppercase; }
.qsfp112-principle strong { font: 800 1.18rem/1.5 var(--font-heading); }
.qsfp112-principle i { display: grid; min-height: 38px; place-items: center; color: #ffd36f; font: 950 1.8rem var(--font-heading); }
.qsfp112-deployment-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-bottom: 24px; }
.qsfp112-deployment-grid article { padding: 25px; border: 1px solid #d3e4e1; border-radius: 17px; background: #fff; }
.qsfp112-deployment-grid span, .qsfp112-infra-grid span { color: #c5821e; font: 850 .74rem var(--font-heading); letter-spacing: .09em; text-transform: uppercase; }
.qsfp112-deployment-grid h3, .qsfp112-infra-grid h3 { color: #173f43; font: 850 1.3rem var(--font-heading); }
.qsfp112-families { background: #fff; }
.qsfp112-family-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }
.qsfp112-family-grid article { display: grid; grid-template-columns: 76px 1fr; gap: 20px; padding: 23px; border: 1px solid #d3e4e1; border-radius: 16px; background: #f7faf9; }
.qsfp112-family-grid strong { display: grid; width: 66px; height: 66px; place-items: center; border-radius: 14px; color: #fff; background: #0f6f73; font: 900 1.08rem var(--font-heading); }
.qsfp112-family-grid h3 { margin: 2px 0 6px; color: #173f43; font: 850 1.2rem var(--font-heading); }
.qsfp112-family-grid p { margin: 0; line-height: 1.58; }
.qsfp112-breakout { color: #fff; background: linear-gradient(125deg,#08272b,#0d5055); }
.qsfp112-breakout-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 55px; align-items: center; }
.qsfp112-breakout h2 { color: #fff; }
.qsfp112-breakout p { color: rgba(255,255,255,.72); }
.qsfp112-breakout-flows { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; margin-top: 23px; }
.qsfp112-breakout-flows > div { display: grid; grid-template-columns: 1fr auto 1.25fr; gap: 10px; align-items: center; padding: 18px; border: 1px solid rgba(255,255,255,.14); border-radius: 13px; background: rgba(255,255,255,.07); }
.qsfp112-breakout-flows i { color: #ffd36f; font-style: normal; font-weight: 900; }
.qsfp112-check-card { padding: 27px; border: 1px solid rgba(255,255,255,.14); border-radius: 18px; background: rgba(255,255,255,.08); }
.qsfp112-check-card h3 { margin-top: 0; color: #e8b85d; font: 850 1.35rem var(--font-heading); }
.qsfp112-check-card ul { padding: 0; list-style: none; color: rgba(255,255,255,.8); line-height: 1.85; }
.qsfp112-check-card li { position: relative; padding-left: 24px; }
.qsfp112-check-card li::before { content: '✓'; position: absolute; left: 0; color: #55c5bd; font-weight: 900; }
.qsfp112-infrastructure { background: #fff; }
.qsfp112-infra-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.qsfp112-infra-grid article { padding: 25px; border-top: 4px solid #0f6f73; background: #f2f8f7; }
.qsfp112-mistake-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 15px; }
.qsfp112-mistake-grid article { padding: 24px; border: 1px solid #d4e4e2; border-radius: 16px; background: #fff; }
.qsfp112-mistake-grid span { color: #c5821e; font: 850 .74rem var(--font-heading); letter-spacing: .09em; text-transform: uppercase; }
.qsfp112-mistake-grid h3 { color: #173f43; font: 850 1.2rem var(--font-heading); }
.qsfp112-mistake-grid p { color: #60797d; line-height: 1.6; }
.qsfp112-migration { background: #fff; }
.qsfp112-migration-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 55px; align-items: center; }
.qsfp112-speed-path { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; align-items: center; }
.qsfp112-speed-path span, .qsfp112-speed-path strong { padding: 13px 16px; border-radius: 11px; }
.qsfp112-speed-path span { color: #164247; background: #e9f4f2; font-weight: 800; }
.qsfp112-speed-path strong { color: #fff; background: #0f6f73; }
.qsfp112-speed-path i { color: #c5821e; font-style: normal; font-weight: 900; }
.qsfp112-summary { text-align: center; background: #fff; }
.qsfp112-summary > .container > p { max-width: 830px; margin-inline: auto; }
.qsfp112-summary .catalog-actions { justify-content: center; }

/* Link troubleshooting guide */
.troubleshoot-main { background: #eef6f5; }
.troubleshoot-hero { min-height: 610px; display: flex; align-items: center; text-align: left; background: radial-gradient(circle at 78% 23%, rgba(215,155,50,.18), transparent 24%), radial-gradient(circle at 68% 74%, rgba(33,157,158,.25), transparent 28%), linear-gradient(120deg,#06171a,#0a3a3e 68%,#11656a); }
.troubleshoot-hero h1, .troubleshoot-hero p { margin-left: 0; }
.troubleshoot-hero h1 { max-width: 1120px; font-size: clamp(3rem,6.5vw,6rem); }
.troubleshoot-hero p { max-width: 870px; }
.troubleshoot-phase-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 15px; }
.troubleshoot-phase-grid article { padding: 25px; border: 1px solid #d3e4e1; border-radius: 17px; background: #fff; }
.troubleshoot-phase-grid span { color: #c5821e; font: 850 .74rem var(--font-heading); letter-spacing: .09em; text-transform: uppercase; }
.troubleshoot-phase-grid h3 { color: #173f43; font: 850 1.3rem var(--font-heading); }
.troubleshoot-phase-grid p { color: #60797d; line-height: 1.6; }
.troubleshoot-phase-grid b { color: #0f6f73; font-size: .84rem; }
.troubleshoot-process { background: #fff; }
.troubleshoot-step-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.troubleshoot-step { overflow: hidden; border: 1px solid #d2e3e0; border-radius: 19px; background: #fff; box-shadow: 0 12px 32px rgba(10,55,60,.06); }
.troubleshoot-step > header { display: grid; grid-template-columns: 48px 1fr; gap: 16px; padding: 23px 25px; color: #fff; background: linear-gradient(120deg,#0b3539,#0e6267); }
.troubleshoot-step > header > span { color: #e8b85d; font: 900 1.05rem var(--font-heading); }
.troubleshoot-step header p { margin: 0; color: rgba(255,255,255,.62); font-size: .72rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.troubleshoot-step h2 { margin: 5px 0 0; color: #fff; font-size: 1.4rem; }
.troubleshoot-step-content { padding: 24px 25px; }
.troubleshoot-step-content > p { color: #60797d; line-height: 1.65; }
.troubleshoot-step-content ul { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 12px; padding: 0; list-style: none; }
.troubleshoot-step-content li { position: relative; padding-left: 23px; color: #567175; line-height: 1.5; }
.troubleshoot-step-content li::before { content: '✓'; position: absolute; left: 0; color: #0f7a6b; font-weight: 900; }
.troubleshoot-step-content aside { display: grid; gap: 5px; margin-top: 18px; padding: 15px 17px; border-left: 4px solid #d79b32; background: #fff8e9; }
.troubleshoot-step-content aside b { color: #8b5c0d; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.troubleshoot-step-content aside span { color: #566f72; line-height: 1.5; }
.troubleshoot-power-examples { background: #eef6f5; }
.power-example-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.power-example-grid article { display: grid; grid-template-columns: 1fr auto 1fr; gap: 14px; align-items: center; padding: 25px; border: 1px solid #cfe2df; border-radius: 17px; background: #fff; }
.power-example-grid article > span, .power-example-grid article > p { grid-column: 1 / -1; }
.power-example-grid article > span { color: #0f776c; font: 850 .75rem var(--font-heading); letter-spacing: .08em; text-transform: uppercase; }
.power-example-grid .is-warning > span { color: #a66a13; }
.power-example-grid div b, .power-example-grid div strong { display: block; text-align: center; }
.power-example-grid div b { color: #718689; font-size: .75rem; }
.power-example-grid div strong { margin-top: 6px; color: #173f43; font: 900 1.35rem var(--font-heading); }
.power-example-grid i { color: #c5821e; font-style: normal; font-weight: 900; }
.power-example-grid p { margin-bottom: 0; color: #60797d; line-height: 1.6; }
.troubleshoot-substitution { color: #fff; background: linear-gradient(125deg,#08272b,#0d5055); }
.troubleshoot-substitution-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 55px; align-items: center; }
.troubleshoot-substitution h2 { color: #fff; }
.troubleshoot-substitution p { color: rgba(255,255,255,.72); line-height: 1.7; }
.substitution-flow { display: grid; gap: 7px; justify-items: center; margin-top: 23px; }
.substitution-flow span { width: min(100%,420px); padding: 12px 18px; border: 1px solid rgba(255,255,255,.14); border-radius: 11px; text-align: center; background: rgba(255,255,255,.08); font-weight: 800; }
.substitution-flow i { color: #ffd36f; font: 950 1.35rem var(--font-heading); text-shadow: 0 0 10px rgba(255,211,111,.4); }
.substitution-warning { padding: 28px; border: 1px solid rgba(255,211,111,.32); border-radius: 18px; background: rgba(215,155,50,.1); }
.substitution-warning strong { color: #ffd36f; font: 850 1.3rem var(--font-heading); }
.troubleshoot-flow { background: #fff; }
.troubleshoot-flow-line { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; }
.troubleshoot-flow-line span { padding: 10px 13px; border-radius: 10px; color: #164247; background: #e9f4f2; font-weight: 800; }
.troubleshoot-flow-line i { color: #c5821e; font-style: normal; font-weight: 900; }
.troubleshoot-summary { text-align: center; background: #fff; }
.troubleshoot-summary-flow { display: grid; gap: 7px; justify-items: center; margin: 28px auto; }
.troubleshoot-summary-flow span { width: min(100%,430px); padding: 12px 18px; border-radius: 11px; color: #164247; background: #e9f4f2; font-weight: 800; }
.troubleshoot-summary-flow i { color: #c5821e; font-style: normal; font-weight: 950; }
.troubleshoot-summary > .container > p { max-width: 820px; margin-inline: auto; color: #60797d; line-height: 1.7; }
.troubleshoot-summary .catalog-actions { justify-content: center; }

/* DOM and DDM technology library */
.dom-library-main { background: #eef6f5; }
.dom-library-hero { min-height: 590px; display: flex; align-items: center; text-align: left; background: radial-gradient(circle at 78% 24%, rgba(78,201,192,.24), transparent 24%), radial-gradient(circle at 68% 76%, rgba(215,155,50,.14), transparent 25%), linear-gradient(120deg,#06171a,#0a3a3e 68%,#11656a); }
.dom-library-hero h1, .dom-library-hero p { margin-left: 0; }
.dom-library-hero h1 { max-width: 1080px; font-size: clamp(3.2rem,7vw,6.4rem); }
.dom-library-hero p { max-width: 850px; }
.dom-principle { background: #fff; }
.dom-principle-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 60px; align-items: center; }
.dom-principle p, .dom-origin p, .dom-trends p, .dom-troubleshooting p, .dom-limits p, .dom-scale p, .dom-summary p { color: #60797d; line-height: 1.7; }
.dom-principle-card { display: grid; gap: 10px; padding: 30px; border-radius: 19px; color: #fff; background: linear-gradient(140deg,#0b3539,#0e6468); }
.dom-principle-card span { color: #e8b85d; font: 850 .76rem var(--font-heading); letter-spacing: .09em; text-transform: uppercase; }
.dom-principle-card strong { font: 800 1.18rem/1.5 var(--font-heading); }
.dom-principle-card i { display: grid; min-height: 38px; place-items: center; color: #ffd36f; font: 950 1.8rem var(--font-heading); text-shadow: 0 0 12px rgba(255,211,111,.45); }
.dom-benefit-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 13px; }
.dom-benefit-grid div { padding: 19px; border: 1px solid #d3e4e1; border-radius: 13px; color: #164247; background: #fff; font-weight: 800; }
.dom-metrics { background: #fff; }
.dom-metric-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 14px; }
.dom-metric-grid article { overflow: hidden; border: 1px solid #d3e4e1; border-radius: 17px; background: #f7faf9; }
.dom-metric-grid header { min-height: 158px; padding: 21px; color: #fff; background: linear-gradient(135deg,#0b3539,#0e6468); }
.dom-metric-grid header > div { display: flex; gap: 8px; justify-content: space-between; align-items: start; }
.dom-metric-grid h3 { margin: 0; color: #fff; font: 850 1.15rem var(--font-heading); }
.dom-metric-grid header span { color: #e8b85d; font-weight: 900; }
.dom-metric-grid header p { color: rgba(255,255,255,.7); line-height: 1.5; }
.dom-metric-grid article > p { padding: 0 21px 21px; color: #60797d; line-height: 1.6; }
.dom-trend-layout { display: grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items: start; }
.dom-trend-comparison { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-top: 24px; }
.dom-trend-comparison article { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; align-items: center; padding: 19px; border: 1px solid #cfe3df; border-radius: 15px; background: #fff; }
.dom-trend-comparison article > span, .dom-trend-comparison article > p { grid-column: 1 / -1; }
.dom-trend-comparison article > span { color: #0f786d; font: 850 .73rem var(--font-heading); letter-spacing: .08em; text-transform: uppercase; }
.dom-trend-comparison .is-alert > span { color: #a36312; }
.dom-trend-comparison div b, .dom-trend-comparison div strong { display: block; }
.dom-trend-comparison div b { color: #6a8083; font-size: .72rem; }
.dom-trend-comparison div strong { margin-top: 4px; color: #173f43; }
.dom-trend-comparison i { color: #c5821e; font-style: normal; font-weight: 900; }
.dom-trend-comparison article > p { margin: 5px 0 0; font-size: .86rem; }
.dom-baseline-card { padding: 27px; border-radius: 18px; color: #fff; background: #0d5055; }
.dom-baseline-card h3 { margin-top: 0; color: #e8b85d; font: 850 1.35rem var(--font-heading); }
.dom-baseline-card ul { padding-left: 20px; color: rgba(255,255,255,.78); line-height: 1.85; }
.dom-troubleshooting { background: #fff; }
.dom-case-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.dom-case-grid article { padding: 25px; border-top: 4px solid #0f6f73; background: #f2f8f7; }
.dom-case-grid span { color: #c5821e; font: 850 .74rem var(--font-heading); letter-spacing: .08em; text-transform: uppercase; }
.dom-case-grid h3 { color: #173f43; font: 850 1.25rem var(--font-heading); }
.dom-limits { color: #fff; background: linear-gradient(125deg,#08272b,#0d5055); }
.dom-limits-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 55px; align-items: center; }
.dom-limits h2 { color: #fff; }
.dom-limits p { color: rgba(255,255,255,.72); }
.dom-not-proof { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.dom-not-proof span { padding: 8px 12px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; color: rgba(255,255,255,.8); background: rgba(255,255,255,.06); }
.dom-myths { display: grid; gap: 11px; }
.dom-myths article { padding: 18px; border: 1px solid rgba(255,255,255,.14); border-radius: 13px; background: rgba(255,255,255,.08); }
.dom-myths b { color: #e8b85d; }
.dom-myths p { margin-bottom: 0; }
.dom-scale { background: #fff; text-align: center; }
.dom-scale > .container { max-width: 980px; }
.dom-scale-tags { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 24px; }
.dom-scale-tags span { padding: 11px 15px; border-radius: 999px; color: #164247; background: #e9f4f2; font-weight: 800; }
.dom-summary { text-align: center; background: #fff; }
.dom-summary-flow { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; align-items: center; margin: 30px 0; }
.dom-summary-flow span { padding: 12px 15px; border-radius: 11px; color: #164247; background: #e9f4f2; font-weight: 800; }
.dom-summary-flow i { color: #c5821e; font-style: normal; font-weight: 900; }
.dom-summary > .container > p { max-width: 850px; margin-inline: auto; }
.dom-summary .catalog-actions { justify-content: center; }

/* SFP, SFP28 and QSFP28 technology library */
.sfp-library-main { background: #eef6f5; }
.sfp-library-hero { min-height: 590px; display: flex; align-items: center; text-align: left; background: radial-gradient(circle at 77% 24%, rgba(33,157,158,.27), transparent 24%), radial-gradient(circle at 63% 75%, rgba(215,155,50,.16), transparent 26%), linear-gradient(120deg,#06171a,#0a3a3e 68%,#11656a); }
.sfp-library-hero h1, .sfp-library-hero p { margin-left: 0; }
.sfp-library-hero h1 { max-width: 1100px; font-size: clamp(3.2rem,7vw,6.4rem); }
.sfp-library-hero p { max-width: 850px; }
.sfp-overview { background: #fff; }
.sfp-comparison-wrap { overflow-x: auto; border: 1px solid #d3e4e1; border-radius: 18px; box-shadow: 0 12px 34px rgba(10,55,60,.06); }
.sfp-comparison-table { width: 100%; min-width: 760px; border-collapse: collapse; }
.sfp-comparison-table th, .sfp-comparison-table td { padding: 18px 20px; border-bottom: 1px solid #dfeae8; color: #506d71; text-align: left; vertical-align: top; line-height: 1.5; }
.sfp-comparison-table thead th { color: #fff; background: #0d5055; font-family: var(--font-heading); }
.sfp-comparison-table tbody th { color: #0f6f73; background: #f1f7f6; font: 900 1.1rem var(--font-heading); }
.sfp-comparison-table tbody tr:last-child > * { border-bottom: 0; }
.sfp-table-note { margin: 15px 0 0; color: #667e81; font-size: .88rem; }
.sfp-media-comparison { background: linear-gradient(180deg,#edf7f6 0%,#f8fbfa 100%); }
.sfp-media-comparison .selection-section-heading { max-width: 980px; }
.sfp-media-comparison .selection-section-heading > p:last-child { max-width: 900px; color: #5d777a; line-height: 1.75; }
.sfp-media-table-wrap { overflow-x: auto; margin-top: 30px; border: 1px solid #cde1de; border-radius: 20px; background: #fff; box-shadow: 0 16px 40px rgba(10,55,60,.08); }
.sfp-media-table { width: 100%; min-width: 860px; border-collapse: collapse; }
.sfp-media-table th, .sfp-media-table td { padding: 19px 21px; border-right: 1px solid #dce9e7; border-bottom: 1px solid #dce9e7; color: #506d71; text-align: left; vertical-align: top; line-height: 1.58; }
.sfp-media-table tr > *:last-child { border-right: 0; }
.sfp-media-table tbody tr:last-child > * { border-bottom: 0; }
.sfp-media-table thead th { color: #fff; background: linear-gradient(135deg,#0d5055,#0f7376); font: 850 1rem var(--font-heading); }
.sfp-media-table thead th:first-child { width: 24%; }
.sfp-media-table tbody th { color: #173f43; background: #eef6f5; font: 850 .96rem var(--font-heading); }
.sfp-media-table tbody tr:nth-child(even) td { background: #fbfdfc; }
.sfp-media-guidance { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 24px; padding: 20px; border-radius: 16px; background: #0d5055; }
.sfp-media-guidance strong { width: 100%; color: #e8b85d; font: 850 .78rem var(--font-heading); letter-spacing: .09em; text-transform: uppercase; }
.sfp-media-guidance span { padding: 9px 12px; border-radius: 10px; color: #e8f4f3; background: rgba(255,255,255,.09); font-weight: 750; }
.sfp-media-guidance i { color: #e8b85d; font-style: normal; font-weight: 900; }
.sfp-form-factor-list { display: grid; gap: 22px; }
.sfp-form-factor-card { display: grid; grid-template-columns: .7fr 1.3fr; overflow: hidden; border: 1px solid #d2e3e0; border-radius: 21px; background: #fff; box-shadow: 0 15px 36px rgba(10,55,60,.06); }
.sfp-form-factor-card > header { display: grid; grid-template-columns: 48px 1fr; gap: 18px; padding: 30px; color: #fff; background: linear-gradient(135deg,#0b3539,#0e6468); }
.sfp-form-factor-card > header > span { color: #e6b45a; font: 900 1rem var(--font-heading); }
.sfp-form-factor-card header p { margin: 0; color: rgba(255,255,255,.66); font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.sfp-form-factor-card h2 { margin: 8px 0; color: #fff; font-size: clamp(2rem,4vw,3rem); }
.sfp-form-factor-card header strong { color: rgba(255,255,255,.82); line-height: 1.5; }
.sfp-form-factor-copy { padding: 30px; }
.sfp-form-factor-copy > p { margin-top: 0; color: #587377; line-height: 1.7; }
.sfp-detail-columns { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-top: 22px; }
.sfp-detail-columns > div { padding: 18px; border-radius: 14px; background: #eff6f5; }
.sfp-detail-columns h3 { margin: 0 0 10px; color: #173f43; font: 850 1rem var(--font-heading); }
.sfp-detail-columns ul { margin: 0; padding-left: 18px; color: #5b7478; line-height: 1.7; }
.sfp-evolution { background: #fff; }
.sfp-evolution-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 60px; align-items: center; }
.sfp-evolution p { color: #60797d; line-height: 1.7; }
.sfp-lane-equation { display: flex; gap: 15px; align-items: center; margin: 26px 0; }
.sfp-lane-equation strong, .sfp-lane-equation b { padding: 14px 20px; border-radius: 12px; font: 900 1.3rem var(--font-heading); }
.sfp-lane-equation strong { color: #164247; background: #e9f4f2; }
.sfp-lane-equation span { color: #c5821e; font-weight: 900; }
.sfp-lane-equation b { color: #fff; background: #0f6f73; }
.sfp-migration-card { padding: 28px; border-radius: 18px; color: #fff; background: linear-gradient(140deg,#0b3539,#0e6468); }
.sfp-migration-card h3 { margin-top: 0; color: #e8b85d; font: 850 1.4rem var(--font-heading); }
.sfp-migration-card ul { padding-left: 20px; color: rgba(255,255,255,.78); line-height: 1.85; }
.sfp-connectors { background: #eef6f5; }
.sfp-connector-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-bottom: 24px; }
.sfp-connector-grid article { padding: 25px; border: 1px solid #d3e4e1; border-radius: 17px; background: #fff; }
.sfp-connector-grid strong { color: #0f6f73; font: 900 1.35rem var(--font-heading); }
.sfp-connector-grid p { color: #60797d; line-height: 1.65; }
.sfp-breakout { color: #fff; background: linear-gradient(125deg,#08272b,#0d5055); }
.sfp-breakout-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 60px; align-items: center; }
.sfp-breakout h2, .sfp-breakout h3 { color: #fff; }
.sfp-breakout h3 { font: 850 1.35rem var(--font-heading); }
.sfp-breakout .selection-check-list { color: rgba(255,255,255,.8); }
.sfp-breakout-flow { display: grid; grid-template-columns: 1fr auto 1.15fr; gap: 16px; align-items: center; margin-top: 25px; padding: 22px; border: 1px solid rgba(255,255,255,.15); border-radius: 15px; background: rgba(255,255,255,.08); }
.sfp-breakout-flow strong, .sfp-breakout-flow b { font: 850 1.2rem var(--font-heading); }
.sfp-breakout-flow i { color: #e8b85d; font-style: normal; font-weight: 900; }
.sfp-mistake-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; }
.sfp-mistake-grid article { padding: 23px; border: 1px solid #d4e4e2; border-radius: 16px; background: #fff; }
.sfp-mistake-grid span { color: #c5821e; font: 850 .75rem var(--font-heading); letter-spacing: .09em; text-transform: uppercase; }
.sfp-mistake-grid p { color: #5d777a; line-height: 1.6; }
.sfp-summary { text-align: center; background: #fff; }
.sfp-summary-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; margin: 30px 0; text-align: left; }
.sfp-summary-grid > div { padding: 24px; border: 1px solid #d3e4e1; border-radius: 16px; background: #f2f8f7; }
.sfp-summary-grid strong, .sfp-summary-grid span { display: block; }
.sfp-summary-grid strong { color: #0f6f73; font: 900 1.35rem var(--font-heading); }
.sfp-summary-grid span { margin-top: 8px; color: #5f787b; line-height: 1.5; }
.sfp-summary .catalog-actions { justify-content: center; }

/* Selecting optical transceivers by speed and reach */
.speed-reach-main { background: #eef6f5; }
.speed-reach-hero { min-height: 590px; display: flex; align-items: center; text-align: left; background: radial-gradient(circle at 80% 25%, rgba(29,152,154,.28), transparent 24%), radial-gradient(circle at 66% 75%, rgba(215,155,50,.14), transparent 25%), linear-gradient(120deg,#06171a,#0a3a3e 68%,#11656a); }
.speed-reach-hero h1, .speed-reach-hero p { margin-left: 0; }
.speed-reach-hero h1 { max-width: 1120px; font-size: clamp(3rem,6.5vw,6rem); }
.speed-reach-hero p { max-width: 820px; }
.speed-reach-example { display: grid; grid-template-columns: auto 1fr auto 1fr; gap: 12px; align-items: center; margin: 20px 0; padding: 18px; border-radius: 14px; background: #eff6f5; }
.speed-reach-example strong { color: #0f6f73; }
.speed-reach-example span { color: #4c686c; }
.speed-reach-example i { color: #c5821e; font-style: normal; font-weight: 900; }
.speed-review { background: #fff; }
.speed-review-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 60px; align-items: start; }
.speed-review p, .reach-review p, .media-lane-section p, .compatibility-section p, .scalability-strip p { color: #60797d; line-height: 1.7; }
.speed-method-card { padding: 28px; border-radius: 20px; color: #fff; background: linear-gradient(140deg,#0b3539,#0e6468); }
.speed-method-card > span { color: #e8b85d; font: 850 .75rem var(--font-heading); letter-spacing: .1em; text-transform: uppercase; }
.method-wrong, .method-right { margin-top: 18px; padding: 17px; border-radius: 13px; }
.method-wrong { background: rgba(143,50,50,.26); }
.method-right {
    display: grid;
    justify-items: center;
    background: rgba(255,255,255,.09);
}
.speed-method-card b { display: block; margin-bottom: 8px; color: #fff; }
.speed-method-card p { margin: 0; color: rgba(255,255,255,.78); }
.method-right b,
.method-right p {
    width: 100%;
    text-align: center;
}
.method-right i {
    display: grid;
    width: 100%;
    min-height: 30px;
    padding: 4px 0;
    place-items: center;
    color: #ffd36f;
    font-size: 1.65rem;
    font-style: normal;
    font-weight: 950;
    line-height: 1;
    text-align: center;
    text-shadow: 0 0 12px rgba(255, 211, 111, .55);
}
.reach-layout { display: grid; grid-template-columns: 1.05fr .95fr; gap: 22px; }
.reach-distance-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.reach-distance-list > div { padding: 21px; border: 1px solid #d3e4e1; border-radius: 14px; background: #fff; }
.reach-distance-list strong, .reach-distance-list span { display: block; }
.reach-distance-list strong { color: #153f43; }
.reach-distance-list span { margin-top: 7px; color: #617b7e; }
.reach-path-card { padding: 25px; border-radius: 17px; color: #fff; background: #0d5055; }
.reach-path-card h3 { margin-top: 0; color: #fff; font: 850 1.3rem var(--font-heading); }
.reach-path-card ul { columns: 2; padding-left: 20px; color: rgba(255,255,255,.78); line-height: 1.9; }
.reach-budget-warning { display: grid; grid-template-columns: 1fr auto 1.35fr; gap: 16px; align-items: center; margin-top: 22px; padding: 24px; border: 1px solid #e4be72; border-radius: 16px; background: #fff8e9; }
.reach-budget-warning div span, .reach-budget-warning div b { display: block; }
.reach-budget-warning div span { color: #9a6816; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.reach-budget-warning div b { margin-top: 5px; color: #534623; }
.reach-budget-warning > i { color: #b5781c; font-style: normal; font-size: 1.5rem; font-weight: 900; }
.reach-budget-warning > p { grid-column: 1 / -1; margin: 0; }
.optical-family-section { background: #fff; }
.optical-family-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.optical-family-grid article { display: grid; grid-template-columns: 76px 1fr; gap: 20px; align-items: start; padding: 22px; border: 1px solid #d5e4e2; border-radius: 16px; background: #f7faf9; }
.optical-family-grid strong { display: grid; width: 66px; height: 66px; place-items: center; border-radius: 14px; color: #fff; background: #0f6f73; font: 900 1.15rem var(--font-heading); }
.optical-family-grid h3 { margin: 2px 0 6px; color: #173f43; font: 850 1.2rem var(--font-heading); }
.optical-family-grid p { margin: 0; color: #60797d; line-height: 1.55; }
.media-lane-section { background: #eef6f5; }
.media-lane-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 60px; }
.media-choice-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin: 22px 0; }
.media-choice-grid article { padding: 20px; border: 1px solid #d3e4e1; border-radius: 14px; background: #fff; }
.media-choice-grid b, .media-choice-grid span { display: block; }
.media-choice-grid b { color: #0f6f73; font: 900 1.3rem var(--font-heading); }
.media-choice-grid span { margin-top: 7px; color: #60797d; line-height: 1.5; }
.compact-breakout-list { display: grid; gap: 9px; margin: 20px 0; }
.compact-breakout-list > div { display: grid; grid-template-columns: 1fr 40px 1.35fr; align-items: center; padding: 15px 18px; border-radius: 12px; background: #fff; }
.compact-breakout-list strong, .compact-breakout-list b { color: #164247; font: 850 1.05rem var(--font-heading); }
.compact-breakout-list i { color: #c5821e; font-style: normal; font-weight: 900; text-align: center; }
.compatibility-section { color: #fff; background: linear-gradient(125deg,#08272b,#0d5055); }
.compatibility-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 60px; align-items: center; }
.compatibility-section h2 { color: #fff; }
.compatibility-section p { color: rgba(255,255,255,.72); }
.compatibility-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.compatibility-tags span { padding: 8px 12px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; color: rgba(255,255,255,.78); background: rgba(255,255,255,.06); }
.compatibility-card { padding: 28px; border: 1px solid rgba(255,255,255,.15); border-radius: 18px; background: rgba(255,255,255,.08); }
.compatibility-card h3 { margin-top: 0; color: #e6b45a; font: 850 1.4rem var(--font-heading); }
.compatibility-card ul { padding: 0; list-style: none; color: rgba(255,255,255,.8); line-height: 1.9; }
.compatibility-card li { position: relative; padding-left: 25px; }
.compatibility-card li::before { content: '✓'; position: absolute; left: 0; color: #55c5bd; font-weight: 900; }
.scalability-strip { text-align: center; background: #fff; }
.scalability-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px; margin: 28px 0; }
.scalability-grid div { padding: 19px 14px; border-radius: 13px; color: #164247; background: #e9f4f2; font-weight: 800; }
.speed-mistake-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.speed-mistake-grid article { padding: 25px; border: 1px solid #d5e4e2; border-radius: 17px; background: #fff; }
.speed-mistake-grid article > span { color: #c5821e; font: 850 .75rem var(--font-heading); letter-spacing: .1em; text-transform: uppercase; }
.speed-mistake-grid h3 { color: #173f43; font: 850 1.25rem var(--font-heading); }
.speed-mistake-grid p { color: #60797d; line-height: 1.6; }

/* Optical quote information guide */
.quote-guide-main { background: #eef6f5; }
.quote-guide-hero { min-height: 570px; display: flex; align-items: center; text-align: left; background: radial-gradient(circle at 78% 22%, rgba(215,155,50,.22), transparent 24%), linear-gradient(120deg,#06171a,#0a3a3e 66%,#11656a); }
.quote-guide-hero h1, .quote-guide-hero p { margin-left: 0; }
.quote-guide-hero h1 { max-width: 1080px; font-size: clamp(3.05rem,6.7vw,6.1rem); }
.quote-guide-hero p { max-width: 830px; }
.quote-requirement-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.quote-requirement-card { overflow: hidden; border: 1px solid #d2e3e0; border-radius: 20px; background: #fff; box-shadow: 0 15px 35px rgba(10,55,60,.06); }
.quote-requirement-card > header { display: grid; grid-template-columns: 54px 1fr; gap: 18px; padding: 24px 26px; color: #fff; background: linear-gradient(120deg,#0b363a,#0d5b60); }
.quote-requirement-card > header > span { color: #e2ae51; font: 900 1.05rem var(--font-heading); }
.quote-requirement-card h2 { margin: 0; color: #fff; font-size: 1.45rem; }
.quote-requirement-card header p { margin: 7px 0 0; color: rgba(255,255,255,.68); line-height: 1.5; }
.quote-requirement-body { padding: 24px 26px; }
.quote-requirement-body ul { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 14px; margin: 0; padding: 0; list-style: none; }
.quote-requirement-body li { position: relative; padding-left: 22px; color: #587377; line-height: 1.5; }
.quote-requirement-body li::before { content: '✓'; position: absolute; left: 0; color: #0f7a6b; font-weight: 900; }
.quote-example { display: grid; gap: 5px; margin-top: 20px; padding: 15px 17px; border-left: 4px solid #d79b32; background: #fff8e9; }
.quote-example b { color: #8a5b0d; font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; }
.quote-example span { color: #4d676a; line-height: 1.5; }
.quote-supporting { background: #fff; }
.quote-supporting-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.quote-supporting-grid article { padding: 28px; border: 1px solid #d3e4e1; border-radius: 18px; background: #f5f9f8; }
.quote-supporting-grid article > span { color: #c5821e; font: 850 .76rem var(--font-heading); letter-spacing: .1em; }
.quote-supporting-grid h3, .quote-help-grid h3 { color: #173f43; font: 850 1.3rem var(--font-heading); }
.quote-supporting-grid p, .quote-help-grid p { color: #60797d; line-height: 1.65; }
.quote-help-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 14px; }
.quote-help-grid article { padding: 23px; border-top: 4px solid #0f6f73; background: #fff; box-shadow: 0 12px 30px rgba(10,55,60,.05); }
.quote-help-grid h3 { font-size: 1.12rem; }
.quote-scope { color: #fff; background: linear-gradient(125deg,#08272b,#0d5055); }
.quote-scope-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 64px; align-items: center; }
.quote-scope h2 { color: #fff; }
.quote-scope p { color: rgba(255,255,255,.73); line-height: 1.75; }
.quote-scope-card { padding: 30px; border: 1px solid rgba(255,255,255,.16); border-radius: 19px; background: rgba(255,255,255,.08); }
.quote-scope-card h3 { margin-top: 0; color: #e7b75d; font: 850 1.45rem var(--font-heading); }
.quote-checklist-section { background: #fff; }
.quote-checklist-layout { display: grid; grid-template-columns: minmax(0,1fr) 320px; gap: 48px; align-items: start; }
.quote-checklist-layout > div > p { color: #60797d; line-height: 1.65; }
.quote-checklist { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-top: 26px; }
.quote-checklist label { display: flex; gap: 12px; align-items: center; padding: 14px 16px; border: 1px solid #d9e7e5; border-radius: 12px; color: #49666a; background: #f7faf9; cursor: pointer; }
.quote-checklist input { width: 19px; height: 19px; accent-color: #0f6f73; }
.quote-readiness { position: sticky; top: calc(var(--header-height) + 20px); display: grid; gap: 16px; padding: 28px; border-radius: 19px; color: #fff; background: linear-gradient(140deg,#0b3539,#0e6468); box-shadow: 0 18px 38px rgba(10,55,60,.16); }
.quote-readiness > span { color: #e7b75d; font: 850 .76rem var(--font-heading); letter-spacing: .1em; text-transform: uppercase; }
.quote-readiness strong { font: 900 2.5rem var(--font-heading); }
.quote-readiness p { margin: 0; color: rgba(255,255,255,.72); line-height: 1.6; }
.quote-progress-track { height: 9px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.16); }
.quote-progress-track i { display: block; width: 0; height: 100%; border-radius: inherit; background: #e5ad4b; transition: width 180ms ease; }
.quote-summary .catalog-actions { justify-content: center; }

/* DAC, AOC and pluggable optics comparison guide */
.cable-choice-main { background: #eef6f5; }
.cable-choice-hero { min-height: 570px; display: flex; align-items: center; text-align: left; background: radial-gradient(circle at 80% 22%, rgba(215,155,50,.20), transparent 24%), radial-gradient(circle at 68% 68%, rgba(33,157,158,.22), transparent 28%), linear-gradient(120deg,#06171a,#0a3a3e 68%,#11656a); }
.cable-choice-hero h1, .cable-choice-hero p { margin-left: 0; }
.cable-choice-hero h1 { max-width: 1050px; font-size: clamp(3.1rem,7vw,6.25rem); }
.cable-choice-hero p { max-width: 820px; }
.cable-option-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.cable-option-card { overflow: hidden; border: 1px solid #d2e3e0; border-radius: 22px; background: #fff; box-shadow: 0 16px 38px rgba(10,55,60,.07); }
.cable-option-card > header { min-height: 215px; padding: 28px; color: #fff; background: linear-gradient(135deg,#0a3337,#0e656a); }
.cable-option-aoc > header { background: linear-gradient(135deg,#123c41,#157d80); }
.cable-option-optics > header { background: linear-gradient(135deg,#18373b,#76571f); }
.cable-option-card header > span { display: inline-block; padding: 6px 10px; border: 1px solid rgba(255,255,255,.25); border-radius: 999px; color: #f0bd61; font: 900 .74rem var(--font-heading); letter-spacing: .1em; }
.cable-option-card h2 { margin: 18px 0 8px; color: #fff; font-size: 1.65rem; }
.cable-option-card header p { margin: 0; color: rgba(255,255,255,.7); line-height: 1.55; }
.cable-option-body { display: grid; gap: 22px; padding: 28px; }
.cable-fact-list, .cable-decision-grid ul { margin: 0; padding: 0; list-style: none; }
.cable-fact-list li { padding: 9px 0 9px 23px; border-bottom: 1px solid #e4eeec; color: #49666a; position: relative; }
.cable-fact-list li::before { content: '•'; position: absolute; left: 5px; color: #d09530; font-weight: 900; }
.cable-use { padding: 16px; border-radius: 13px; background: #eff6f5; }
.cable-use b, .cable-pro-con b { display: block; margin-bottom: 8px; color: #153f43; }
.cable-use p { margin: 0; color: #587377; line-height: 1.55; }
.cable-pro-con { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cable-pro-con > div { padding: 14px; border: 1px solid #dce9e7; border-radius: 12px; }
.cable-pro-con span { display: block; position: relative; padding: 5px 0 5px 20px; color: #5d777a; font-size: .82rem; line-height: 1.45; }
.cable-pro-con span::before { position: absolute; left: 0; font-weight: 900; }
.cable-pro-con .is-positive::before { content: '✓'; color: #0f7a6b; }
.cable-pro-con .is-caution::before { content: '–'; color: #ba7c1c; }
.cable-comparison-section { background: #fff; }
.cable-comparison-wrap { overflow-x: auto; border: 1px solid #d3e4e1; border-radius: 18px; box-shadow: 0 12px 34px rgba(10,55,60,.06); }
.cable-comparison-table { width: 100%; min-width: 760px; border-collapse: collapse; background: #fff; }
.cable-comparison-table th, .cable-comparison-table td { padding: 17px 20px; border-bottom: 1px solid #dfeae8; text-align: left; vertical-align: top; color: #506d71; line-height: 1.5; }
.cable-comparison-table thead th { color: #fff; background: #0d5055; font-family: var(--font-heading); }
.cable-comparison-table tbody th { width: 22%; color: #173f43; background: #f4f8f7; }
.cable-comparison-table tbody tr:last-child > * { border-bottom: 0; }
.cable-criteria-grid, .cable-mistake-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
.cable-criteria-grid article, .cable-mistake-grid article { padding: 25px; border: 1px solid #d3e4e1; border-radius: 18px; background: #fff; }
.cable-criteria-grid article > span, .cable-mistake-grid article > span { color: #c5821e; font: 850 .76rem var(--font-heading); letter-spacing: .1em; text-transform: uppercase; }
.cable-criteria-grid h3, .cable-mistake-grid h3 { color: #173f43; font: 850 1.3rem var(--font-heading); }
.cable-criteria-grid p, .cable-mistake-grid p { color: #60797d; line-height: 1.65; }
.cable-criteria-grid strong { color: #0f6f73; line-height: 1.5; }
.cable-breakout { color: #fff; background: linear-gradient(125deg,#0b3034,#0e6267); }
.cable-breakout-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 70px; align-items: center; }
.cable-breakout h2 { color: #fff; }
.cable-breakout p { color: rgba(255,255,255,.72); line-height: 1.7; }
.cable-breakout .selection-check-list { color: rgba(255,255,255,.85); }
.breakout-flow-list { display: grid; gap: 12px; }
.breakout-flow-list > div { display: grid; grid-template-columns: 1fr 44px 1.4fr; align-items: center; padding: 20px 22px; border: 1px solid rgba(255,255,255,.15); border-radius: 14px; background: rgba(255,255,255,.08); }
.breakout-flow-list strong, .breakout-flow-list b { font: 850 1.25rem var(--font-heading); }
.breakout-flow-list span { color: #e2ae51; font-weight: 900; text-align: center; }
.cable-decision { background: #fff; }
.cable-decision-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.cable-decision-grid article { padding: 28px; border-top: 4px solid #d79b32; border-radius: 0 0 18px 18px; background: #eef6f5; }
.cable-decision-grid b { display: block; margin-bottom: 16px; color: #123f43; font: 850 1.3rem var(--font-heading); }
.cable-decision-grid li { position: relative; padding: 8px 0 8px 26px; color: #557175; }
.cable-decision-grid li::before { content: '✓'; position: absolute; left: 0; color: #0f7a6b; font-weight: 900; }
.cable-summary { text-align: center; background: #fff; }
.cable-summary h2 { color: #173f43; }
.cable-summary-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin: 32px 0; text-align: left; }
.cable-summary-grid > div { padding: 26px; border: 1px solid #d2e4e1; border-radius: 17px; background: #f2f8f7; }
.cable-summary-grid strong, .cable-summary-grid span { display: block; }
.cable-summary-grid strong { margin-bottom: 13px; color: #0f6f73; font: 900 1.45rem var(--font-heading); }
.cable-summary-grid span { padding: 4px 0; color: #587377; }
.cable-summary > .container > p:last-child { max-width: 820px; margin-inline: auto; color: #60797d; line-height: 1.7; }

@media (max-width: 800px) {
    .selection-intro-grid, .selection-review-grid, .selection-mistake-grid, .cable-option-grid, .cable-breakout-grid, .cable-decision-grid, .quote-requirement-grid, .quote-scope-grid, .quote-checklist-layout, .speed-review-grid, .reach-layout, .media-lane-grid, .compatibility-grid, .sfp-form-factor-card, .sfp-evolution-grid, .sfp-breakout-grid, .dom-principle-grid, .dom-trend-layout, .dom-limits-grid, .troubleshoot-substitution-grid, .qsfp112-architecture-grid, .qsfp112-breakout-grid, .qsfp112-migration-grid { grid-template-columns: 1fr; gap: 28px; }
    .selection-connector-grid, .selection-tech-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .cable-criteria-grid, .cable-mistake-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .cable-summary-grid { grid-template-columns: 1fr; }
    .quote-help-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .quote-readiness { position: static; }
    .scalability-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .speed-mistake-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .sfp-connector-grid, .sfp-mistake-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .sfp-summary-grid { grid-template-columns: 1fr; }
    .dom-metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .troubleshoot-phase-grid, .troubleshoot-step-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .qsfp112-mistake-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 560px) {
    .selection-step > header { grid-template-columns: 44px 1fr; padding: 22px 20px; }
    .selection-step-body { padding: 24px 20px; }
    .selection-detail-grid, .selection-distance-grid, .selection-mode-grid, .selection-two-column, .selection-check-list, .selection-question-list { grid-template-columns: 1fr; }
    .cable-criteria-grid, .cable-mistake-grid, .cable-pro-con { grid-template-columns: 1fr; }
    .quote-requirement-body ul, .quote-supporting-grid, .quote-help-grid, .quote-checklist { grid-template-columns: 1fr; }
    .speed-reach-example, .optical-family-grid, .speed-mistake-grid, .scalability-grid { grid-template-columns: 1fr; }
    .speed-reach-example i { transform: rotate(90deg); }
    .reach-distance-list { grid-template-columns: 1fr; }
    .sfp-detail-columns, .sfp-connector-grid, .sfp-mistake-grid { grid-template-columns: 1fr; }
    .sfp-breakout-flow { grid-template-columns: 1fr; text-align: center; }
    .sfp-breakout-flow i { transform: rotate(90deg); }
    .sfp-media-guidance { flex-direction: column; align-items: stretch; text-align: center; }
    .sfp-media-guidance i { transform: rotate(90deg); }
    .dom-benefit-grid, .dom-metric-grid, .dom-trend-comparison, .dom-case-grid { grid-template-columns: 1fr; }
    .dom-summary-flow { flex-direction: column; }
    .dom-summary-flow i { transform: rotate(90deg); }
    .troubleshoot-phase-grid, .troubleshoot-step-list, .power-example-grid { grid-template-columns: 1fr; }
    .troubleshoot-step-content ul { grid-template-columns: 1fr; }
    .troubleshoot-flow-line { flex-direction: column; }
    .troubleshoot-flow-line i { transform: rotate(90deg); }
    .qsfp112-deployment-grid, .qsfp112-family-grid, .qsfp112-infra-grid, .qsfp112-mistake-grid { grid-template-columns: 1fr; }
    .qsfp112-breakout-flows { grid-template-columns: 1fr; }
    .qsfp112-speed-path { flex-direction: column; }
    .qsfp112-speed-path i { transform: rotate(90deg); }
}

@media (max-width: 980px) {
    .resources-grid,
    .article-layout,
    .resource-question-grid,
    .resource-feature-grid,
    .resource-chain-layout,
    .resource-closing-inner {
        grid-template-columns: 1fr;
    }

    .resource-directory-grid { grid-template-columns: 1fr; }

    .article-side {
        position: static;
    }
}

@media (max-width: 560px) {
    .resources-main {
        padding-top: 80px;
    }

    .resources-knowledge-hero { min-height: 580px; background-position: 60% center; }
    .resources-hero-overlay { background: rgba(4,20,23,.84); }
    .resources-hero-actions .button { width: 100%; }

    .resource-stat-grid {
        grid-template-columns: 1fr;
    }
}

/* OEM compliance checklist */
.resource-available {
    padding-top: 18px;
}

.resource-available > .container > h2 {
    margin: 8px 0 26px;
    color: var(--color-white);
    font-family: var(--font-heading);
    font-size: clamp(1.8rem, 4vw, 2.8rem);
}

.resource-feature-card {
    max-width: 820px;
}

.resource-card-link {
    color: var(--color-gold);
    font-weight: 800;
}

.checklist-main {
    color: #173337;
    background: #eef6f5;
}

.checklist-hero {
    background:
        radial-gradient(circle at 18% 15%, rgba(15, 111, 115, 0.28), transparent 35%),
        linear-gradient(135deg, #071013, #0b3035 65%, #123d40);
}

.checklist-hero-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-top: 28px;
}

.checklist-hero .checklist-scope-note {
    max-width: 860px;
    margin-top: 14px;
    padding: 12px 16px;
    border: 1px solid rgba(215, 155, 50, 0.28);
    border-radius: 12px;
    color: rgba(255, 255, 255, 0.78);
    background: rgba(0, 0, 0, 0.14);
    font-size: 0.9rem;
    line-height: 1.55;
}

.checklist-scope-note strong {
    color: var(--color-gold);
}

.checklist-workspace {
    padding-top: 46px;
}

.checklist-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 290px;
    gap: 24px;
    align-items: start;
}

.checklist-document {
    display: grid;
    gap: 22px;
}

.checklist-supplier-card,
.checklist-section,
.checklist-signoff,
.checklist-summary {
    border: 1px solid rgba(15, 111, 115, 0.15);
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 14px 36px rgba(6, 43, 47, 0.08);
}

.checklist-supplier-card,
.checklist-signoff {
    padding: clamp(24px, 4vw, 38px);
}

.checklist-supplier-card h2,
.checklist-signoff h2 {
    margin: 6px 0 24px;
    color: #123337;
    font-family: var(--font-heading);
}

.checklist-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.checklist-fields label,
.checklist-notes {
    display: grid;
    gap: 7px;
    color: #3d5b5f;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.checklist-fields input,
.checklist-fields select,
.checklist-notes textarea,
.checklist-row select {
    width: 100%;
    border: 1px solid rgba(15, 111, 115, 0.22);
    border-radius: 10px;
    color: #173337;
    background: #f8fbfb;
    font: 500 0.92rem var(--font-body);
    text-transform: none;
}

.checklist-fields input,
.checklist-fields select,
.checklist-row select {
    min-height: 46px;
    padding: 0 12px;
}

.checklist-notes {
    margin-top: 18px;
}

.checklist-notes textarea {
    padding: 12px;
    resize: vertical;
}

.checklist-section {
    overflow: hidden;
}

.checklist-section > header {
    display: flex;
    gap: 14px;
    align-items: center;
    padding: 22px 26px;
    border-bottom: 1px solid rgba(15, 111, 115, 0.13);
    background: linear-gradient(90deg, rgba(15, 111, 115, 0.09), rgba(215, 155, 50, 0.05));
}

.checklist-section > header span {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 50%;
    color: #ffffff;
    background: #0f6f73;
    font: 800 0.75rem var(--font-heading);
}

.checklist-section h2 {
    margin: 0;
    color: #13363a;
    font-family: var(--font-heading);
    font-size: 1.25rem;
}

.checklist-column-labels,
.checklist-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 165px;
    gap: 18px;
    align-items: center;
}

.checklist-column-labels {
    padding: 14px 26px 8px;
    color: #6d8588;
    font-size: 0.67rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.checklist-row {
    min-height: 68px;
    margin: 0 26px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(15, 111, 115, 0.10);
}

.checklist-item {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    color: #304d51;
    line-height: 1.5;
    cursor: pointer;
}

.checklist-item input {
    position: absolute;
    opacity: 0;
}

.checkmark {
    display: grid;
    flex: 0 0 23px;
    width: 23px;
    height: 23px;
    place-items: center;
    border: 2px solid rgba(15, 111, 115, 0.45);
    border-radius: 6px;
    background: #ffffff;
}

.checklist-item input:checked + .checkmark {
    border-color: #0f6f73;
    background: #0f6f73;
}

.checklist-item input:checked + .checkmark::after {
    content: "✓";
    color: #ffffff;
    font-size: 0.9rem;
    font-weight: 900;
}

.checklist-item input:focus-visible + .checkmark {
    outline: 3px solid rgba(215, 155, 50, 0.38);
    outline-offset: 2px;
}

.checklist-section > .checklist-notes {
    margin: 20px 26px 26px;
}

.checklist-summary {
    position: sticky;
    top: calc(var(--header-height) + 20px);
    display: grid;
    gap: 14px;
    padding: 24px;
}

.checklist-summary strong {
    color: #0f6f73;
    font: 800 3rem var(--font-heading);
}

.checklist-summary p,
.checklist-summary small {
    margin: 0;
    color: #60777a;
    line-height: 1.55;
}

.checklist-progress {
    height: 9px;
    overflow: hidden;
    border-radius: 999px;
    background: #dbe8e6;
}

.checklist-progress span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #0f6f73, #d79b32);
    transition: width 180ms ease;
}

@media (max-width: 980px) {
    .checklist-layout { grid-template-columns: 1fr; }
    .checklist-summary { position: static; grid-row: 1; }
}

@media (max-width: 680px) {
    .checklist-fields,
    .checklist-column-labels,
    .checklist-row { grid-template-columns: 1fr; }
    .checklist-column-labels span:last-child { display: none; }
    .checklist-row { gap: 10px; margin-inline: 18px; padding-block: 16px; }
    .checklist-section > header { padding-inline: 18px; }
    .checklist-section > .checklist-notes { margin-inline: 18px; }
}

@media print {
    .site-header,
    .site-footer,
    .checklist-hero-actions,
    .checklist-summary .button { display: none !important; }
    .resources-main { padding-top: 0; background: #ffffff; }
    .checklist-hero { padding: 24px 0; background: #ffffff; }
    .checklist-hero h1,
    .checklist-hero p { color: #173337; }
    .checklist-layout { display: block; }
    .checklist-summary { position: static; margin-bottom: 20px; box-shadow: none; }
    .checklist-section,
    .checklist-supplier-card,
    .checklist-signoff { break-inside: avoid; box-shadow: none; }
}

/* Pre-quotation requirement analysis */
.resource-analysis-feature {
    padding-top: 0;
}

.resource-analysis-feature-inner {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr) auto;
    gap: clamp(24px, 4vw, 48px);
    align-items: center;
    padding: clamp(28px, 4vw, 48px);
    border: 1px solid rgba(15, 111, 115, 0.18);
    border-radius: 26px;
    background: linear-gradient(135deg, #f7fcfb, #eaf6f4);
    box-shadow: 0 22px 54px rgba(6, 43, 47, 0.09);
}

.resource-analysis-feature-mark {
    display: grid;
    place-items: center;
    width: 96px;
    height: 96px;
    border-radius: 23px;
    background: linear-gradient(145deg, #0f7777, #164f55);
    box-shadow: 0 14px 30px rgba(12, 91, 94, 0.24);
}

.resource-analysis-feature-mark span {
    color: #f4c667;
    font: 900 1.9rem var(--font-heading);
    letter-spacing: 0.08em;
}

.resource-analysis-feature h2,
.resource-analysis-feature p {
    margin-block: 0;
}

.resource-analysis-feature h2 {
    margin-top: 7px;
    color: #17383b;
    font-size: clamp(1.7rem, 3vw, 2.45rem);
}

.resource-analysis-feature div > p:last-child {
    margin-top: 12px;
    color: #526f72;
    line-height: 1.7;
}

.pre-quotation-hero {
    background:
        linear-gradient(100deg, rgba(5, 38, 43, 0.96), rgba(11, 87, 88, 0.88)),
        radial-gradient(circle at 84% 20%, rgba(215, 155, 50, 0.26), transparent 34%);
}

.pre-quotation-hero .container > p:not(.section-kicker) {
    max-width: 830px;
}

.pre-quotation-positioning-grid,
.pre-quotation-commercial-grid,
.pre-quotation-output-grid,
.pre-quotation-human-review-inner {
    display: grid;
    grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
    gap: clamp(34px, 7vw, 90px);
    align-items: start;
}

.pre-quotation-positioning h2,
.pre-quotation-commercial h2,
.pre-quotation-output h2,
.pre-quotation-human-review h2 {
    margin: 8px 0 0;
    color: #17383b;
    font-size: clamp(2rem, 4vw, 3.2rem);
    line-height: 1.08;
}

.pre-quotation-positioning-grid > div:last-child p,
.pre-quotation-commercial-grid > div > p,
.pre-quotation-output-grid > div > p,
.pre-quotation-human-review-inner p {
    color: #536f72;
    line-height: 1.76;
}

.pre-quotation-process {
    background: linear-gradient(180deg, #edf7f5, #f8fbfa);
}

.pre-quotation-review-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-top: 34px;
}

.pre-quotation-review-grid article {
    min-height: 245px;
    padding: 28px;
    border: 1px solid rgba(15, 111, 115, 0.14);
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 14px 32px rgba(10, 54, 58, 0.07);
}

.pre-quotation-review-grid span {
    color: #c48118;
    font: 850 0.82rem var(--font-heading);
    letter-spacing: 0.12em;
}

.pre-quotation-review-grid h3 {
    margin: 18px 0 10px;
    color: #183b3e;
    font-size: 1.22rem;
}

.pre-quotation-review-grid p {
    margin: 0;
    color: #597376;
    line-height: 1.68;
}

.pre-quotation-commercial-grid {
    grid-template-columns: minmax(0, 1.18fr) minmax(300px, 0.82fr);
    align-items: center;
}

.pre-quotation-commercial aside {
    display: grid;
    gap: 12px;
    padding: clamp(26px, 4vw, 40px);
    border-radius: 24px;
    background: linear-gradient(145deg, #123f44, #0f6f73);
    box-shadow: 0 22px 48px rgba(6, 43, 47, 0.20);
}

.pre-quotation-commercial aside span {
    color: #f0c36c;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.pre-quotation-commercial aside strong,
.pre-quotation-commercial aside b {
    color: #ffffff;
    font-size: 1.08rem;
}

.pre-quotation-commercial aside i {
    color: #f0c36c;
    font-size: 1.25rem;
    font-style: normal;
}

.pre-quotation-output {
    background: #f4f9f8;
}

.pre-quotation-output ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pre-quotation-output li {
    position: relative;
    padding: 17px 18px 17px 44px;
    border: 1px solid rgba(15, 111, 115, 0.12);
    border-radius: 14px;
    background: #ffffff;
    color: #36575a;
    font-weight: 700;
}

.pre-quotation-output li::before {
    content: "✓";
    position: absolute;
    left: 18px;
    color: #0f7777;
    font-weight: 900;
}

.pre-quotation-human-review-inner {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    padding: clamp(30px, 5vw, 58px);
    border-radius: 26px;
    background: linear-gradient(135deg, #f8fcfb, #e9f5f3);
    box-shadow: 0 20px 52px rgba(7, 54, 58, 0.09);
}

.pre-quotation-model-note {
    margin-top: 18px;
    padding-left: 18px;
    border-left: 3px solid #d79b32;
    font-size: 0.96rem;
}

.pre-quotation-complimentary {
    padding-top: 0;
}

.pre-quotation-complimentary-inner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: clamp(24px, 5vw, 64px);
    align-items: center;
    padding: clamp(28px, 5vw, 54px);
    border: 1px solid rgba(215, 155, 50, 0.24);
    border-radius: 26px;
    background:
        radial-gradient(circle at 93% 10%, rgba(215, 155, 50, 0.18), transparent 30%),
        linear-gradient(135deg, #fffaf0, #f3f9f7);
    box-shadow: 0 20px 50px rgba(67, 54, 16, 0.08);
}

.pre-quotation-complimentary-inner > span {
    display: inline-flex;
    padding: 11px 16px;
    border-radius: 999px;
    background: #c3811c;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.pre-quotation-complimentary h2,
.pre-quotation-complimentary p {
    margin: 0;
}

.pre-quotation-complimentary h2 {
    color: #173b3e;
    font-size: clamp(1.7rem, 3.4vw, 2.7rem);
}

.pre-quotation-complimentary p {
    margin-top: 10px;
    color: #536f72;
    line-height: 1.7;
}

.pre-quotation-model-note a {
    color: #0f6f73;
    font-weight: 850;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.pre-quotation-human-actions {
    display: grid;
    gap: 12px;
    min-width: 260px;
}

.pre-quotation-example {
    scroll-margin-top: calc(var(--header-height) + 24px);
    background: linear-gradient(180deg, #edf7f5 0%, #f9fbfb 100%);
}

.pre-quotation-example-block {
    margin-top: 24px;
    overflow: hidden;
    border: 1px solid rgba(15, 111, 115, 0.14);
    border-radius: 22px;
    background: #ffffff;
    box-shadow: 0 14px 34px rgba(7, 54, 58, 0.07);
}

.pre-quotation-example-heading {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 18px;
    align-items: center;
    padding: 24px 26px;
    border-bottom: 1px solid rgba(15, 111, 115, 0.11);
    background: #f7fbfa;
}

.pre-quotation-example-heading > span {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #0f6f73;
    color: #ffffff;
    font: 850 0.78rem var(--font-heading);
}

.pre-quotation-example-heading h3,
.pre-quotation-example-heading p {
    margin: 0;
}

.pre-quotation-example-heading h3 {
    color: #183b3e;
    font-size: 1.35rem;
}

.pre-quotation-example-heading p {
    margin-top: 5px;
    color: #60777a;
    line-height: 1.55;
}

.pre-quotation-table-wrap {
    overflow-x: auto;
}

.pre-quotation-table {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
}

.pre-quotation-table th,
.pre-quotation-table td {
    padding: 15px 18px;
    border-bottom: 1px solid #e4eeec;
    color: #395b5e;
    text-align: left;
    vertical-align: top;
}

.pre-quotation-table th {
    background: #143f44;
    color: #ffffff;
    font-size: 0.8rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.pre-quotation-table tbody tr:last-child td {
    border-bottom: 0;
}

.pre-quotation-context {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 22px 26px 26px;
    border-top: 1px solid rgba(15, 111, 115, 0.09);
}

.pre-quotation-context strong {
    flex-basis: 100%;
    color: #183b3e;
}

.pre-quotation-context span {
    padding: 9px 12px;
    border-radius: 999px;
    background: #e8f4f2;
    color: #315c5f;
    font-size: 0.88rem;
    font-weight: 700;
}

.pre-quotation-calculation-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    padding: 26px;
}

.pre-quotation-calculation-grid article {
    padding: 22px;
    border: 1px solid rgba(15, 111, 115, 0.12);
    border-radius: 16px;
    background: #f8fbfa;
}

.pre-quotation-calculation-grid b,
.pre-quotation-calculation-grid strong {
    display: block;
}

.pre-quotation-calculation-grid b {
    color: #a66b13;
    font-size: 0.78rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.pre-quotation-calculation-grid strong {
    margin-top: 12px;
    color: #153f43;
    font-size: 1.15rem;
}

.pre-quotation-calculation-grid p {
    margin: 12px 0 0;
    color: #60777a;
    line-height: 1.58;
}

.pre-quotation-gap-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
    padding: 26px;
    list-style: none;
}

.pre-quotation-gap-list li {
    position: relative;
    padding: 16px 16px 16px 44px;
    border: 1px solid rgba(191, 127, 27, 0.18);
    border-radius: 14px;
    background: #fffaf1;
    color: #4d6162;
    line-height: 1.55;
}

.pre-quotation-gap-list li::before {
    content: "?";
    position: absolute;
    top: 15px;
    left: 17px;
    color: #b97817;
    font-weight: 900;
}

.pre-quotation-example-disclaimer {
    margin: 0;
    padding: 18px 24px;
    border-top: 1px solid rgba(15, 111, 115, 0.11);
    background: #f7fbfa;
    color: #60777a;
    font-size: 0.88rem;
    line-height: 1.55;
}

@media (max-width: 980px) {
    .resource-analysis-feature-inner {
        grid-template-columns: 82px minmax(0, 1fr);
    }

    .resource-analysis-feature-mark {
        width: 82px;
        height: 82px;
    }

    .resource-analysis-feature .button {
        grid-column: 2;
        justify-self: start;
    }

    .pre-quotation-review-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pre-quotation-positioning-grid,
    .pre-quotation-commercial-grid,
    .pre-quotation-output-grid,
    .pre-quotation-complimentary-inner,
    .pre-quotation-human-review-inner {
        grid-template-columns: 1fr;
    }

    .pre-quotation-human-review-inner .button {
        justify-self: start;
    }

    .pre-quotation-calculation-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .resource-analysis-feature-inner,
    .pre-quotation-review-grid,
    .pre-quotation-output ul {
        grid-template-columns: 1fr;
    }

    .resource-analysis-feature .button {
        grid-column: 1;
        width: 100%;
    }

    .pre-quotation-review-grid article {
        min-height: 0;
    }

    .pre-quotation-human-actions {
        width: 100%;
        min-width: 0;
    }

    .pre-quotation-human-actions .button {
        width: 100%;
    }

    .pre-quotation-example-heading,
    .pre-quotation-gap-list {
        grid-template-columns: 1fr;
    }
}