.ci-intro{padding:35px 6% 48px}.ci-title{display:flex;align-items:end;justify-content:space-between;gap:32px}.ci-title h1{font-size:clamp(48px,6vw,88px);width:auto;margin:35px 0 0;line-height:1.03;letter-spacing:-.065em}.ci-title p{font-size:16px;color:var(--ice);line-height:1.7;margin:0}.ci-section{padding:52px 6% 65px}.ci-page .section-label{font-size:12px}.palette,.logo-section{background:#fff;color:var(--navy)}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:25px;margin:30px 0}.section-heading h2{font-size:clamp(32px,3.4vw,48px)}.section-heading p{font-size:14px;line-height:1.6;max-width:310px}.color-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:15px}.swatch{width:100%;min-height:215px;display:flex;flex-direction:column;align-items:start;text-align:left;border:0;padding:20px;background:var(--swatch);cursor:pointer;transition:transform .2s,box-shadow .2s;border-radius:2px}.swatch:hover{transform:translateY(-6px);box-shadow:0 12px 24px #00283e20}.swatch.light{color:var(--navy)}.swatch.dark{color:#fff}.swatch>span:first-child{font-size:12px;letter-spacing:.06em;font-weight:600}.swatch strong{font-size:clamp(19px,2vw,29px);letter-spacing:-.045em;margin:auto 0 18px}.copy-hint{font-size:14px;width:100%;display:flex;justify-content:space-between}.color-meta h3{font-size:16px;margin:18px 0 6px}.color-meta>span{font-size:13px}.palette-bottom{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:30px}.palette-bottom p{font-size:14px;line-height:1.8}.utility-button{display:inline-flex;align-items:center;justify-content:center;gap:25px;font:inherit;font-size:14px;line-height:1.5;color:inherit;background:transparent;border:1px solid currentColor;border-radius:30px;padding:12px 20px;cursor:pointer;transition:background .2s}.utility-button:hover{background:#00708e18}.typography{background:var(--ice);color:var(--navy)}.type-layout{display:grid;grid-template-columns:1fr 1.3fr;gap:60px;margin:45px 0}.inter-title{font-size:clamp(100px,14vw,200px);letter-spacing:-.075em;margin:0 0 22px}.inter-title span{color:var(--coral)}.type-layout>div>p{font-size:16px;line-height:1.8;max-width:340px}.sample{border-bottom:1px solid #00283e30;padding:20px 0}.sample:first-child{padding-top:0}.sample-label{font-size:12px;letter-spacing:.06em;color:var(--teal)}.uppercase-sample{font-size:14px;font-weight:600;letter-spacing:.14em}.headline-sample{font-size:clamp(32px,4vw,55px);font-weight:800;letter-spacing:-.05em;line-height:1.05;margin:20px 0}.body-sample{font-size:16px;line-height:1.8;font-weight:400;max-width:450px}.type-playground{border-top:1px solid #00283e40;padding-top:30px}.type-playground>label{display:block;font-size:12px;letter-spacing:.08em;font-weight:600;margin-bottom:14px}#type-input{width:100%;background:#ffffff90;color:var(--navy);border:1px solid #00283e40;border-radius:3px;padding:15px;font:inherit;font-size:16px}.type-controls{display:flex;gap:40px;margin:24px 0}.type-controls label{display:flex;gap:12px;align-items:center;font-size:14px}.type-controls select{padding:10px;background:white;border:1px solid #00283e40;color:var(--navy);font:inherit;border-radius:3px}.type-controls input{accent-color:var(--teal);max-width:160px}#type-preview{font-size:48px;font-weight:700;line-height:1.2;letter-spacing:-.04em;overflow-wrap:anywhere;margin:40px 0;min-height:100px}.type-note,.source-note{font-size:14px;line-height:1.7;max-width:750px;opacity:.8}.logo-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}.logo-stage{min-height:330px;display:grid;place-items:center;padding:55px}.logo-stage img{width:200px;max-width:100%;height:210px;object-fit:contain}.logo-on-light{background:var(--ice)}.logo-on-dark{background:var(--navy)}.logo-caption{display:flex;justify-content:space-between;align-items:center;gap:20px}.logo-caption h3{font-size:18px}.logo-caption a{font-size:14px;text-decoration:underline;text-underline-offset:5px}.ci-rules{background:var(--navy)}.ci-rules .steps{margin-top:40px}.ci-rules .steps article{border-color:#ffffff50}.ci-rules .steps article>span{color:var(--ice)}.ci-source{display:flex;justify-content:space-between;align-items:center;gap:30px;border-top:1px solid #ffffff50;margin-top:45px;padding-top:30px}.ci-source h3{font-size:26px;letter-spacing:-.04em;margin:0 0 10px}.ci-source p{font-size:14px;color:var(--ice)}.copy-status{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);background:var(--navy);color:#fff;border:1px solid var(--ice);box-shadow:0 8px 30px #00283e40;border-radius:30px;padding:15px 24px;z-index:100;pointer-events:none;opacity:0;transition:opacity .2s,transform .2s;font-size:14px;text-align:center;max-width:calc(100% - 30px);width:max-content}.copy-status.show{opacity:1;transform:translate(-50%,0)}dialog{color:var(--navy);border:0;padding:30px;max-width:min(90vw,550px);border-radius:4px}dialog::backdrop{background:#00283eb0}dialog h2{font-size:30px;letter-spacing:-.04em}dialog p,dialog label{font-size:16px;line-height:1.6}dialog textarea{display:block;width:100%;margin:10px 0 20px;padding:12px;font-size:16px;resize:vertical}input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--teal);outline-offset:3px}@media(max-width:950px){.color-grid{gap:10px}.swatch{padding:14px;min-height:190px}.ci-title{align-items:start;flex-direction:column;gap:20px}.type-controls{flex-wrap:wrap;gap:18px}.type-layout{gap:30px}.copy-hint{font-size:12px}}@media(max-width:640px){.ci-intro{padding:25px 6% 35px}.ci-title h1{font-size:13vw;margin-top:28px}.ci-title p{font-size:15px}.ci-section{padding:38px 6%}.ci-page .section-label{font-size:11px}.section-heading{align-items:start;flex-direction:column;gap:5px}.section-heading h2{font-size:34px}.section-heading p{max-width:none}.color-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}.color-card:last-child{grid-column:1/-1}.swatch{min-height:190px;padding:18px}.swatch strong{font-size:25px}.copy-hint{font-size:14px}.color-meta>span{font-size:12px}.palette-bottom,.ci-source{flex-direction:column;align-items:start}.type-layout{grid-template-columns:1fr;gap:25px}.inter-title{font-size:120px}.headline-sample{font-size:10vw}.type-controls{flex-direction:column}.type-controls label{flex-wrap:wrap}.type-controls input{max-width:140px}.logo-grid{grid-template-columns:1fr}.logo-stage{min-height:280px}.logo-caption a{font-size:13px}.ci-page footer{gap:20px}.ci-page footer>a:not(.footer-brand){font-size:14px}}
