/* ARECH Icon Bullets — block-11 view.css */
.arech-ib { padding-block: var(--space-9); container-type: inline-size; }
.arech-ib--theme-paper-2 { background-color: var(--paper-2); color: var(--ink-1); }
.arech-ib--theme-paper-1 { background-color: var(--paper-1); color: var(--ink-1); }
.arech-ib--theme-dark    { background-color: var(--dark); color: var(--off-white); }

.arech-ib__inner { max-width: var(--container-wide); margin-inline: auto; padding-inline: var(--container-px); }

.arech-ib__header { max-width: 60ch; margin-bottom: var(--space-7); }
.arech-ib__eyebrow {
    font-family: var(--font-mono); font-size: 12px; font-weight: 500;
    letter-spacing: 0.12em; text-transform: uppercase; color: var(--orange);
    margin: 0 0 var(--space-3);
}
.arech-ib__h2 {
    font-family: var(--font-display); font-weight: 700;
    font-size: clamp(28px, 4vw, 48px); line-height: 1.1;
    margin: 0 0 var(--space-4); max-width: 28ch;
}
.arech-ib__pullquote {
    font-family: var(--font-body); font-size: 18px; line-height: 1.5;
    font-style: italic; color: var(--orange);
    border-left: 3px solid var(--orange); padding-left: var(--space-4);
    margin: 0;
}

.arech-ib__list {
    list-style: none; margin: 0; padding: 0;
    display: grid; grid-template-columns: 1fr; gap: var(--space-5);
}
@container (min-width: 768px) {
    .arech-ib--two-col .arech-ib__list { grid-template-columns: repeat(2, 1fr); gap: var(--space-5) var(--space-7); }
}

.arech-ib__item {
    display: grid; grid-template-columns: 64px 1fr; gap: var(--space-4); align-items: start;
}
@container (max-width: 480px) {
    .arech-ib__item { grid-template-columns: 1fr; gap: var(--space-3); }
}

.arech-ib__icon {
    display: grid; place-items: center;
    width: 64px; height: 64px;
    background-color: color-mix(in oklch, var(--orange) 12%, transparent);
    color: var(--orange); border-radius: 4px;
}
.arech-ib__icon img { display: block; width: 32px; height: 32px; }

.arech-ib__copy { padding-top: var(--space-2); }
.arech-ib__label {
    font-family: var(--font-display); font-weight: 600;
    font-size: clamp(18px, 1.8vw, 22px); line-height: 1.2;
    margin: 0 0 var(--space-2);
}
.arech-ib__body {
    font-family: var(--font-body); font-size: 16px; line-height: 1.55;
    margin: 0 0 var(--space-2); opacity: 0.86;
}
.arech-ib__link {
    font-family: var(--font-mono); font-size: 13px; font-weight: 500;
    letter-spacing: 0.06em; text-transform: uppercase;
    color: var(--orange); text-decoration: none;
    transition: color var(--motion-fast) var(--ease-standard);
}
.arech-ib__link:hover, .arech-ib__link:focus-visible { color: var(--orange-bright); }
.arech-ib__link:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
    .arech-ib__link { transition: none; }
}

.ccm-edit-mode .arech-ib { padding-block: var(--space-7); }

@media print {
    .arech-ib { background: #fff !important; color: #000 !important; }
    .arech-ib__icon { background: transparent !important; }
}
