*,
*::before,
*::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --ev-page: #f5f6f0;
    --ev-moss: #66775a;
    --ev-mossDeep: #4d5c43;
    --ev-mossDark: #3f4c37;
    --ev-sage: #e6e9dc;
    --ev-ink: #2b2f27;
    --ev-soft: #4f5747;
    --ev-line: #d9ddcd;
    --ev-card: #ffffff;
    --ev-font: "Trebuchet MS", "Segoe UI", sans-serif;
}

html { -webkit-text-size-adjust: 100%; }

body {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    background: var(--ev-page);
    font-family: var(--ev-font);
    font-size: 16px;
    line-height: 1.65;
    color: var(--ev-ink);
}

a {
    color: var(--ev-mossDeep);
    text-decoration: underline;
    text-underline-offset: 3px;
}
a:hover { color: var(--ev-ink); }

/* header band */
.e-topBar {
    background: var(--ev-sage);
    border-bottom: 1px solid var(--ev-line);
}
.e-topInner {
    max-width: 860px;
    margin: 0 auto;
    padding: 14px 20px;
    display: flex;
    align-items: center;
}
.e-brandName {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 19px;
    font-weight: 700;
    letter-spacing: .03em;
    color: var(--ev-mossDeep);
    text-decoration: none;
}
.e-brandName:hover { color: var(--ev-mossDark); }
.e-brandLeaf { width: 20px; height: 20px; flex: 0 0 auto; }

/* page intro */
.e-docTop {
    max-width: 860px;
    width: 100%;
    margin: 0 auto;
    padding: 42px 20px 22px;
}
.e-docTitle {
    font-size: clamp(26px, 4vw, 38px);
    font-weight: 700;
    line-height: 1.25;
    color: var(--ev-ink);
}
.e-docDate {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    font-size: 14px;
    color: var(--ev-mossDeep);
}
.e-docDate svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.e-docLead {
    margin-top: 10px;
    max-width: 680px;
    font-size: 16px;
    color: var(--ev-soft);
}

/* topic list */
.e-docBody {
    max-width: 860px;
    width: 100%;
    margin: 0 auto;
    padding: 6px 20px 54px;
}
.e-topic {
    padding: 26px 0;
    border-top: 1px solid var(--ev-line);
}
.e-topic:last-child { border-bottom: 1px solid var(--ev-line); }
.e-topicHead {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 12px;
}
.e-topicIcon {
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--ev-moss);
    display: grid;
    place-items: center;
}
.e-topicIcon svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: #ffffff;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.e-topicName {
    font-size: clamp(19px, 2.3vw, 23px);
    font-weight: 700;
    line-height: 1.3;
    color: var(--ev-ink);
}
.e-topicText { padding-left: 56px; color: var(--ev-soft); }
.e-topicText p { margin-bottom: 12px; }
.e-topicText p:last-child { margin-bottom: 0; }
.e-topicText strong { color: var(--ev-ink); }
.e-topicText ul,
.e-topicText ol {
    margin: 0 0 12px;
    padding-left: 22px;
}
.e-topicText ul:last-child,
.e-topicText ol:last-child { margin-bottom: 0; }
.e-topicText li { margin-bottom: 6px; padding-left: 4px; }
.e-topicText ul li::marker { color: var(--ev-moss); }
.e-topicText ol li::marker { color: var(--ev-mossDeep); font-weight: 700; }

/* important note */
.e-noteBox {
    margin: 14px 0;
    padding: 14px 16px;
    background: #eef0e6;
    border: 1px solid var(--ev-line);
    border-radius: 8px;
    color: var(--ev-ink);
    font-size: 15px;
}
.e-noteBox:last-child { margin-bottom: 0; }

/* label / value rows */
.e-factGrid {
    margin: 12px 0;
    background: var(--ev-card);
    border: 1px solid var(--ev-line);
    border-radius: 8px;
    overflow: hidden;
}
.e-factGrid:last-child { margin-bottom: 0; }
.e-factRow {
    display: grid;
    grid-template-columns: minmax(150px, 36%) 1fr;
    gap: 4px 16px;
    padding: 11px 14px;
    font-size: 15px;
}
.e-factRow + .e-factRow { border-top: 1px solid var(--ev-line); }
.e-factRow dt { font-weight: 700; color: var(--ev-mossDeep); }
.e-factRow dd { color: var(--ev-soft); }

/* chips */
.e-chipLine {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 4px 0 12px;
    padding: 0;
    list-style: none;
}
.e-topicText .e-chipLine { padding-left: 0; }
.e-chipLine li {
    margin: 0;
    padding: 4px 12px;
    border-radius: 8px;
    background: var(--ev-sage);
    font-size: 14px;
    color: var(--ev-mossDeep);
}

/* table */
.e-tableWrap { overflow-x: auto; margin: 12px 0 0; }
.e-costTable {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px;
    background: var(--ev-card);
    border: 1px solid var(--ev-line);
}
.e-costTable th {
    text-align: left;
    padding: 10px 14px;
    background: var(--ev-sage);
    color: var(--ev-mossDeep);
    font-weight: 700;
    border-bottom: 1px solid var(--ev-line);
}
.e-costTable td {
    padding: 10px 14px;
    border-top: 1px solid var(--ev-line);
    color: var(--ev-soft);
    vertical-align: top;
}

/* final remark */
.e-endRemark {
    max-width: 860px;
    width: 100%;
    margin: 0 auto;
    padding: 0 20px 50px;
    font-size: 14px;
    color: var(--ev-soft);
}

@media (max-width: 600px) {
    .e-docTop { padding-top: 32px; }
    .e-topicHead { gap: 12px; }
    .e-topicIcon { width: 36px; height: 36px; }
    .e-topicIcon svg { width: 18px; height: 18px; }
    .e-topicText { padding-left: 0; }
    .e-factRow { grid-template-columns: 1fr; }
}

/* footer */
.e-pageEnd {
    margin-top: auto;
    flex-shrink: 0;
    background: var(--ev-sage);
    border-top: 1px solid var(--ev-line);
    padding: 26px 20px 24px;
    text-align: center;
    color: var(--ev-soft);
}
.e-endInner { max-width: 860px; margin: 0 auto; }
.e-endLinks {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 22px;
    margin-bottom: 14px;
}
.e-endLinks a { font-size: 13px; color: var(--ev-mossDeep); }
.e-endLinks a:hover { color: var(--ev-ink); }
.e-endCopy { font-size: 12.5px; margin-bottom: 10px; }
.e-endLegal {
    max-width: 740px;
    margin: 0 auto;
    font-size: 12px;
    line-height: 1.65;
}
