#iso-soc-article{--navy: oklch(0.22 0.04 245); --text: #1a2e42; --muted: #4d6176; --primary: oklch(0.38 0.2 255); --primary-dark: #0a2f8a; --panel: oklch(0.25 0.18 255); --amber: oklch(0.72 0.14 70); --amber-ink: oklch(0.2 0.05 70); --alt: oklch(0.995 0.003 245); --line: #dfe6ee; --green: #2f9e63;}
#iso-soc-article *{box-sizing: border-box;}
#iso-soc-article{scroll-behavior: smooth;}
#iso-soc-article{margin: 0px; font-family: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 16px; line-height: 1.55; color: var(--text); background: rgb(255, 255, 255); text-size-adjust: 100%;}
#iso-soc-article h1,#iso-soc-article h2,#iso-soc-article h3,#iso-soc-article h4{font-family: Bitter, Georgia, serif; color: var(--navy); margin: 0px; font-weight: 700;}
#iso-soc-article a{color: var(--primary); text-decoration: none;}
#iso-soc-article a:hover{text-decoration: underline;}
#iso-soc-article img{max-width: 100%;}
#iso-soc-article .container{width: 100%; max-width: 1180px; margin: 0px auto; padding: 0px 20px;}
#iso-soc-article .header{position: sticky; top: 0px; z-index: 50; background: rgb(255, 255, 255); box-shadow: rgba(8, 37, 69, 0.08) 0px 6px 18px; padding: 8px 0px 6px;}
#iso-soc-article .header .container{display: flex; align-items: center; justify-content: space-between; gap: 20px;}
#iso-soc-article .nav-logo{display: flex; align-items: center; gap: 10px; color: inherit;}
#iso-soc-article .nav-logo:hover{text-decoration: none;}
#iso-soc-article .nav-logo img{width: 34px; height: 34px; object-fit: contain;}
#iso-soc-article .nav-logo-name{display: block; font-family: Bitter, serif; font-weight: 700; font-size: 15px; letter-spacing: 0.03em; color: var(--navy); line-height: 1.1;}
#iso-soc-article .nav-logo-tagline{display: block; font-size: 8.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted);}
#iso-soc-article .nav{display: flex; align-items: center; gap: 26px;}
#iso-soc-article .nav a{font-weight: 600; font-size: 15px; color: var(--text);}
#iso-soc-article .nav a.active{color: var(--primary);}
#iso-soc-article .nav a.btn{color: rgb(255, 255, 255); white-space: nowrap;}
@media (max-width: 560px) {#iso-soc-article .nav a.btn{font-size: 14px; padding: 9px 14px;}
#iso-soc-article .nav-logo-tagline{display: none;}}
#iso-soc-article .btn{display: inline-block; font-family: inherit; font-weight: 700; font-size: 17px; line-height: 1.5; padding: 14px 28px; border-radius: 6px; border: 2px solid transparent; cursor: pointer; text-align: center;}
#iso-soc-article .btn:hover{text-decoration: none;}
#iso-soc-article .btn-primary{background: var(--primary); color: rgb(255, 255, 255);}
#iso-soc-article .btn-primary:hover{background: var(--primary-dark);}
#iso-soc-article .btn-outline{background: rgb(255, 255, 255); color: var(--primary); border-color: var(--primary);}
#iso-soc-article .btn-outline:hover{background: var(--alt);}
#iso-soc-article .btn-sm{font-size: 15px; padding: 10px 18px;}
@media (max-width: 940px) {#iso-soc-article .nav a:not(.btn){display: none;}}
#iso-soc-article{--surface: oklch(97.5% 0.005 245); --ink: oklch(22% 0.04 245); --ink-muted: oklch(42% 0.05 245); --ink-faint: oklch(58% 0.03 245); --brand: oklch(38% 0.20 255); --brand-pale: oklch(95% 0.03 255); --brand-mid: oklch(48% 0.20 255); --brand-dark: oklch(25% 0.18 255); --amber2: oklch(72% 0.14 70); --border: oklch(91% 0.008 245); --card: oklch(99.5% 0.003 245); --text-xs: clamp(0.75rem, 0.7rem + 0.2vw, 0.85rem); --text-sm: clamp(0.875rem, 0.85rem + 0.2vw, 1rem); --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem); --text-lg: clamp(1.125rem, 1rem + 0.5vw, 1.375rem); --text-xl: clamp(1.375rem, 1.1rem + 1vw, 1.875rem); --text-2xl: clamp(1.75rem, 1.3rem + 2vw, 2.75rem); background: var(--surface); color: var(--ink); font-family: "Source Sans 3", system-ui, sans-serif; font-size: var(--text-base); line-height: 1.65;}
#iso-soc-article .prose-container{max-width: 760px; margin: 0px auto; padding: 0px clamp(20px, 5vw, 48px);}
#iso-soc-article .article-header{padding: clamp(48px, 8vw, 88px) 0px clamp(32px, 6vw, 48px);}
#iso-soc-article .article-eyebrow{display: inline-flex; align-items: center; gap: 8px; font-size: var(--text-xs); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--brand); margin-bottom: 20px;}
#iso-soc-article .article-eyebrow-dot{width: 6px; height: 6px; background: var(--amber2); border-radius: 50%; flex-shrink: 0;}
#iso-soc-article .article-header h1{font-family: Bitter, serif; font-size: clamp(2rem, 1.5rem + 2.5vw, 3.25rem); font-weight: 700; line-height: 1.12; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 20px;}
#iso-soc-article .article-sub{font-size: var(--text-lg); color: var(--ink-muted); line-height: 1.6; margin-bottom: 24px;}
#iso-soc-article .article-meta{display: flex; align-items: center; gap: 14px; font-size: var(--text-sm); color: var(--ink-faint); flex-wrap: wrap;}
#iso-soc-article .article-meta .dot{width: 3px; height: 3px; background: var(--ink-faint); border-radius: 50%;}
#iso-soc-article .prose{padding-bottom: clamp(48px, 8vw, 80px);}
#iso-soc-article .prose p{font-size: var(--text-base); color: var(--ink-muted); line-height: 1.75; margin-bottom: 22px;}
#iso-soc-article .prose h2{font-family: Bitter, serif; font-size: var(--text-2xl); font-weight: 700; color: var(--ink); letter-spacing: -0.01em; line-height: 1.2; margin: 48px 0px 20px;}
#iso-soc-article .prose strong{color: var(--ink); font-weight: 700;}
#iso-soc-article .checklist{list-style: none; margin: 28px 0px 32px; padding: 0px; display: flex; flex-direction: column; gap: 2px; background: var(--border); border-radius: 12px; overflow: hidden;}
#iso-soc-article .checklist li{background: var(--card); padding: 20px 24px; display: flex; gap: 18px; align-items: flex-start;}
#iso-soc-article .checklist-num{font-family: Bitter, serif; font-size: var(--text-xl); font-weight: 700; color: var(--brand-pale); flex-shrink: 0; line-height: 1.3; min-width: 28px;}
#iso-soc-article .checklist-body strong{font-family: Bitter, serif; font-size: var(--text-base); color: var(--ink); display: block; margin-bottom: 4px;}
#iso-soc-article .checklist-body span{font-size: var(--text-sm); color: var(--ink-muted); line-height: 1.6;}
#iso-soc-article .cta-soft{background: var(--brand-pale); border: 1px solid oklch(0.88 0.05 255); border-radius: 12px; padding: 24px 28px; margin: 8px 0px 40px; display: flex; align-items: center; gap: 20px; flex-wrap: wrap;}
#iso-soc-article .cta-soft p{font-size: var(--text-sm); color: var(--ink-muted); margin: 0px; flex: 1 1 0%; min-width: 220px; line-height: 1.6;}
#iso-soc-article .cta-main{background: var(--brand-dark); border-radius: 14px; padding: clamp(28px, 5vw, 40px); margin: 40px 0px 8px;}
#iso-soc-article .cta-main-eyebrow{font-size: var(--text-xs); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--amber2); margin-bottom: 12px;}
#iso-soc-article .cta-main h3{font-family: Bitter, serif; font-size: var(--text-xl); font-weight: 700; color: rgb(255, 255, 255); margin-bottom: 12px; line-height: 1.25;}
#iso-soc-article .cta-main p{font-size: var(--text-sm); color: oklch(0.78 0.05 245); line-height: 1.7; margin-bottom: 24px; max-width: 60ch;}
#iso-soc-article .btn-primary{background: var(--brand); color: rgb(255, 255, 255); padding: 13px 26px; border-radius: 6px; font-family: "Source Sans 3", sans-serif; font-size: var(--text-base); font-weight: 700; text-decoration: none; border: none; cursor: pointer; transition: background 0.15s, transform 0.15s; display: inline-block; white-space: nowrap;}
#iso-soc-article .btn-primary:hover{background: var(--brand-mid); transform: translateY(-1px); text-decoration: none;}
#iso-soc-article .btn-amber{background: var(--amber2); color: oklch(0.2 0.05 70); padding: 13px 26px; border-radius: 6px; font-family: "Source Sans 3", sans-serif; font-size: var(--text-base); font-weight: 700; text-decoration: none; border: none; cursor: pointer; transition: opacity 0.15s, transform 0.15s; display: inline-block; white-space: nowrap;}
#iso-soc-article .btn-amber:hover{opacity: 0.9; transform: translateY(-1px); text-decoration: none;}
#iso-soc-article .article-tags{display: flex; flex-wrap: wrap; gap: 8px; margin-top: 40px; padding-top: 32px; border-top: 1px solid var(--border);}
#iso-soc-article .article-tag{font-size: 12px; font-weight: 600; background: var(--brand-pale); color: var(--brand); padding: 5px 12px; border-radius: 20px;}
@media (max-width: 600px) {#iso-soc-article .cta-soft{flex-direction: column; align-items: stretch;}
#iso-soc-article .cta-soft p{min-width: 0px; flex: 1 1 auto;}
#iso-soc-article .btn-primary,#iso-soc-article .btn-amber{white-space: normal; text-align: center;}}
#iso-soc-article .table-wrap{overflow-x: auto; border: 1px solid var(--border); border-radius: 12px; margin: 28px 0px 8px; background: var(--card);}
#iso-soc-article table{border-collapse: collapse; width: 100%; min-width: 420px; font-size: var(--text-sm);}
#iso-soc-article th,#iso-soc-article td{padding: 14px 20px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--border);}
#iso-soc-article thead th{background: var(--brand-dark); color: rgb(255, 255, 255); font-family: Bitter, serif; font-size: var(--text-sm); font-weight: 700;}
#iso-soc-article tbody th{font-weight: 700; color: var(--ink); background: var(--surface); width: 42%;}
#iso-soc-article tbody tr:last-child th,#iso-soc-article tbody tr:last-child td{border-bottom: 0px;}
#iso-soc-article .note{font-size: var(--text-sm); color: var(--ink-faint); margin: 12px 0px 22px;}
#iso-soc-article .resource-cta{display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; background: var(--brand-pale); border: 1px solid oklch(0.88 0.05 255); border-radius: 12px; padding: 24px 28px; margin: 12px 0px 8px;}
#iso-soc-article .resource-cta h3{font-family: Bitter, serif; font-size: var(--text-lg); color: var(--ink); margin-bottom: 4px; font-weight: 700;}
#iso-soc-article .resource-cta p{margin: 0px; color: var(--ink-muted); font-size: var(--text-sm);}
@media (max-width: 600px) {#iso-soc-article .resource-cta{flex-direction: column; align-items: stretch;}}
#iso-soc-article .criteria-grid{display: grid; grid-template-columns: repeat(2, minmax(220px, 1fr)); gap: 14px; margin: 20px 0px 32px;}
#iso-soc-article .criteria-card{background: var(--card); border: 1px solid var(--border); border-radius: 10px; padding: 20px;}
#iso-soc-article .criteria-card h3{font-family: Bitter, serif; font-size: var(--text-base); color: var(--ink); margin-bottom: 8px; font-weight: 700;}
#iso-soc-article .criteria-card p{font-size: var(--text-sm); color: var(--ink-muted); line-height: 1.65; margin: 0px;}
@media (max-width: 640px) {#iso-soc-article .criteria-grid{grid-template-columns: 1fr;}}
#iso-soc-article .cta{background: var(--panel); color: rgb(255, 255, 255); padding: 56px 0px;}
#iso-soc-article .cta-inner{display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap;}
#iso-soc-article .cta h2{color: rgb(255, 255, 255); font-size: clamp(26px, 3vw, 34px); margin-bottom: 10px;}
#iso-soc-article .cta p{margin: 0px; color: rgba(255, 255, 255, 0.85); max-width: 640px; font-size: 17.5px;}
#iso-soc-article .cta-actions{display: flex; flex-wrap: wrap; gap: 12px;}
#iso-soc-article .cta-btn{display: inline-block; font-weight: 700; font-size: 15px; padding: 12px 22px; border-radius: 6px; background: var(--amber); color: var(--amber-ink); border: 2px solid var(--amber);}
#iso-soc-article .cta-btn.outline{background: transparent; color: rgb(255, 255, 255); border-color: rgba(255, 255, 255, 0.55);}
#iso-soc-article .cta-btn:hover{text-decoration: none; filter: brightness(1.06);}
#iso-soc-article footer{background: var(--panel); color: oklch(0.72 0.04 245); padding: 0px 0px 28px; border-top: 1px solid rgba(255, 255, 255, 0.12);}
#iso-soc-article .foot-grid{display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 32px; padding: 44px 0px 30px;}
#iso-soc-article footer h4{font-family: "Source Sans 3", sans-serif; font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase; color: rgb(255, 255, 255); margin-bottom: 12px;}
#iso-soc-article footer a{color: inherit; display: block; padding: 3px 0px; font-size: 15px;}
#iso-soc-article footer a:hover{color: rgb(255, 255, 255);}
#iso-soc-article footer .brand{font-family: Bitter, serif; color: rgb(255, 255, 255); font-size: 18px; font-weight: 700; margin-bottom: 4px;}
#iso-soc-article footer p{margin: 8px 0px; font-size: 15px;}
#iso-soc-article .foot-bottom{border-top: 1px solid rgba(255, 255, 255, 0.12); padding-top: 20px; font-size: 14px; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px;}
#iso-soc-article .foot-bottom a{display: inline; font-size: 14px;}
@media (max-width: 820px) {#iso-soc-article .foot-grid{grid-template-columns: 1fr 1fr;}}
@media (max-width: 520px) {#iso-soc-article .foot-grid{grid-template-columns: 1fr;}}
#iso-soc-article .float-cta{position: fixed; right: 16px; bottom: 16px; z-index: 60; background: rgb(58, 123, 240); color: rgb(255, 255, 255); font-weight: 700; font-size: 15px; padding: 13px 20px; border-radius: 12px; box-shadow: rgba(8, 37, 69, 0.3) 0px 8px 24px;}
#iso-soc-article .float-cta:hover{text-decoration: none; filter: brightness(1.06);}
#iso-soc-article .float-cta small{font-weight: 600; opacity: 0.9; margin-left: 6px;}
@media (max-width: 560px) {#iso-soc-article .float-cta small{display: none;}}
#iso-soc-article .answer-box{background: var(--brand-pale); border-top: 1px solid oklch(0.88 0.05 255); border-right: 1px solid oklch(0.88 0.05 255); border-bottom: 1px solid oklch(0.88 0.05 255); border-image: initial; border-left: 4px solid var(--primary); border-radius: 12px; padding: 22px 26px; margin: 0px 0px 36px;}
#iso-soc-article .answer-box h2{margin: 0px 0px 10px; font-size: 1.15rem;}
#iso-soc-article .answer-box p{margin: 0px 0px 10px; line-height: 1.65;}
#iso-soc-article .answer-box p:last-child{margin-bottom: 0px;}
body.service-details-page{margin:0}
