/* 062 (Oct 2026): the IP Address Finder page (840), loaded after tailwind/ip-address-finder.css */
/* 054 (Oct 2026): the redone tools' shared sections (How to Use, FAQ, More Tools, closing), as in the Hours sheet */
/* 024: 021 section styles (How to Use, FAQ) */
@keyframes tcFadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}@keyframes tcPop{0%{opacity:0;transform:scale(0.6)}70%{transform:scale(1.08)}100%{opacity:1;transform:scale(1)}}@supports(animation-timeline: view()){.t-page .tc-reveal{animation:tcFadeUp linear both;animation-timeline:view();animation-range:entry 0% entry 100%}.t-page .tc-pop{animation:tcPop linear both;animation-timeline:view();animation-range:entry 20% entry 100%}}@media(prefers-reduced-motion: reduce){.t-page .tc-reveal,.t-page .tc-pop{animation:none}}.has-t-page .single-entry-content{margin:0;padding:0;max-width:none}.t-page{font-family:Inter,Arial,sans-serif;color:#1d2b3a;background:#fff;width:100%;overflow-x:clip;line-height:1.5}.t-page *,.t-page ::before,.t-page ::after{box-sizing:border-box}.t-page :focus:not(:focus-visible){outline:none}.t-page :focus-visible{outline:2px solid #2aa5d5;outline-offset:2px}.t-page .t-wrap{max-width:1180px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}.t-page .t-h1{margin:0;font-family:"Work Sans",Arial,sans-serif;font-weight:700;font-size:clamp(32px,3.6vw,46px);line-height:1.1;letter-spacing:-0.01em;color:#1d2b3a}.t-page .t-h2{margin:0;font-family:"Work Sans",Arial,sans-serif;font-weight:700;font-size:clamp(26px,2.8vw,36px);line-height:1.2;letter-spacing:0;color:#1d2b3a}.t-page .t-h2.sm{font-size:clamp(24px,2.4vw,30px)}.t-page .t-lead{margin:0;font-size:clamp(17px,1.5vw,19px);line-height:1.6;color:#4f5d6b;max-width:560px}.t-page .t-p{margin:0;font-size:17px;line-height:1.65;color:#4f5d6b}.t-page .t-p a,.t-page .t-faq a{color:#1f8fbf;font-weight:600;text-decoration:underline}.t-page .t-p a:hover,.t-page .t-faq a:hover{color:#2aa5d5}.t-page .t-sec{padding:clamp(56px,7vw,96px) 0}.t-page .t-sec.tint{background:#eaf6fb}.t-page .t-sec.gray{background:#f6fafc}.t-page .t-sec.flush{padding-top:0}.t-page .t-stack{display:flex;flex-direction:column;gap:32px}.t-page .t-head-c{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;max-width:760px;margin:0 auto}.t-page .t-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin:0;padding:0;border:0;background:none;color:#1f8fbf;font:600 16px/1.4 Inter,Arial,sans-serif;text-decoration:none;cursor:pointer}.t-page .t-link:hover{color:#2aa5d5;text-decoration:underline}.t-page .t-link svg{display:block;flex:none}.t-page .t-btns{display:flex;flex-wrap:wrap;gap:12px}.t-page .t-cta,.t-page .t-ghost,.t-page .t-ghost-w{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 24px;border-radius:12px;font-family:"Work Sans",Arial,sans-serif;font-weight:600;font-size:16px;line-height:1.2;text-decoration:none;cursor:pointer}.t-page .t-cta{background:#ff6500;color:#fff;border:0}.t-page .t-ghost{padding:0 22px;border:1.5px solid #2aa5d5;color:#1f8fbf;background:#fff}.t-page .t-ghost-w{padding:0 22px;border:1.5px solid rgba(255, 255, 255, 0.8);color:#fff;background:transparent}.t-page .t-cta svg,.t-page .t-ghost svg{display:block;flex:none}.t-page .tc-btn{transition:filter .18s ease,background-color .18s ease}.t-page .tc-btn:hover{filter:brightness(1.05)}.t-page .t-cta:hover,.t-page .t-cta:focus{color:#fff}.t-page .t-ghost:hover{background:#eaf6fb;color:#1f8fbf}.t-page .t-ghost-w:hover,.t-page .t-ghost-w:focus{background:rgba(255, 255, 255, 0.12);color:#fff}.t-page .t-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:20px}.t-page .t-step{display:flex;flex-direction:column;gap:8px;margin:0;padding:26px 22px;border-radius:18px;background:#fff;list-style:none}.t-page .t-num{width:44px;height:44px;border-radius:12px;background:#2aa5d5;color:#fff;font-family:"Work Sans",Arial,sans-serif;font-weight:700;font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center;margin-bottom:8px}.t-page .t-step-t{margin:0;font-family:"Work Sans",Arial,sans-serif;font-weight:600;font-size:18px;line-height:24px;color:#1d2b3a}.t-page .t-step-d{margin:0;font-size:15px;line-height:23px;color:#5d6b78}.t-page .t-faqwrap{display:flex;flex-wrap:wrap;gap:32px 64px;align-items:flex-start}.t-page .t-faq-head{flex:0 1 340px;min-width:0;display:flex;flex-direction:column;gap:16px}.t-page .t-faq-list{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;background:#fff;border:1px solid #dde9f0;border-radius:16px;overflow:hidden}.t-page .t-faq{margin:-1px 0 0;padding:0;background:#fff;border-top:1px solid #eef3f6}.t-page .t-faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:16px 22px;transition:background-color .15s ease}.t-page .t-faq summary:hover{background:#f6fafc}.t-page .t-faq summary:focus{outline:none}.t-page .t-faq summary:focus-visible{outline:2px solid #2aa5d5;outline-offset:-2px}.t-page .t-faq summary::-webkit-details-marker{display:none}.t-page .t-faq summary::marker{content:""}.t-page .t-faq-q{margin:0;font-family:Inter,Arial,sans-serif;font-weight:600;font-size:16px;line-height:1.4;letter-spacing:0;color:#1d2b3a}.t-page .t-faq[open] .t-faq-q{color:#1f7fa8}.t-page .t-plus{display:flex;flex:none;color:#2aa5d5;transition:transform .2s ease}.t-page .t-plus svg{display:block}.t-page .t-faq[open] .t-plus{transform:rotate(180deg)}.t-page .t-faq p,.t-page .t-faq li{margin:0 0 18px;font-size:15px;line-height:24px;color:#4f5d6b}.t-page .t-faq p:not(:last-child){margin-bottom:12px}.t-page .t-faq ul{margin:0 0 18px;padding:0 0 0 20px;list-style:disc}.t-page .t-faq li{margin:0 0 6px;list-style:disc}.t-page .t-faq>:not(summary){margin-left:22px;margin-right:22px}.t-page .t-call{align-self:flex-start;min-height:48px;font-size:15px}.t-page .t-faqwrap--groups{display:grid;grid-template-columns:minmax(0, 340px) minmax(0, 1fr);gap:40px 72px}.t-page .t-faq-side{position:sticky;top:101px;gap:18px}.t-page .t-faq-jump{display:flex;flex-direction:column;gap:2px;margin-top:4px;padding-top:14px;border-top:1px solid #dde9f0}.t-page .t-faq-jump a{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:40px;padding:6px 0;color:#1d2b3a;font-size:15px;font-weight:500;text-decoration:none}.t-page .t-faq-jump a:hover{color:#1f8fbf}.t-page .t-faq-jump span{font-size:13px;font-weight:500;color:#6b7884}.t-page .t-faq-groups{min-width:0;display:flex;flex-direction:column;gap:32px}.t-page .t-faq-group{scroll-margin-top:101px}.t-page .t-faq-label{margin:0 0 10px;font-size:13px;font-weight:600;line-height:1.4;letter-spacing:.06em;text-transform:uppercase;color:#6b7884}@media(max-width: 900px){.t-page .t-faqwrap--groups{grid-template-columns:minmax(0, 1fr);gap:28px}.t-page .t-faq-side{position:static}.t-page .t-faq-jump{display:none}}@media(max-width: 480px){.t-page .t-faq summary{padding:14px 16px}.t-page .t-faq-q{font-size:15px}.t-page .t-faq>:not(summary){margin-left:16px;margin-right:16px}}@media(prefers-reduced-motion: reduce){.t-page .t-plus,.t-page .t-faq summary{transition:none}}.t-page .t-mores{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:16px}.t-page .t-more{display:flex;align-items:flex-start;gap:14px;padding:20px;border:1px solid #dde9f0;border-radius:16px;background:#fff;text-decoration:none;color:#1d2b3a;transition:border-color .15s ease}.t-page .t-more:hover{border-color:#2aa5d5;color:#1d2b3a}.t-page .t-more-txt{flex:1 1 auto;min-width:0}.t-page .m-ic{flex:none;width:38px;height:38px;border-radius:10px;background:#eaf6fb;display:flex;align-items:center;justify-content:center;transition:background-color .15s ease}.t-page .m-ic svg{display:block;stroke:#2aa5d5}.t-page .t-more:hover .m-ic{background:#2aa5d5}.t-page .t-more:hover .m-ic svg{stroke:#fff}.t-page .m-t{display:block;font-size:15px;line-height:20px;font-weight:600;color:#1d2b3a}.t-page .m-d{display:block;font-size:13px;line-height:18px;color:#5d6b78;margin-top:2px}.t-page .t-more-arrow{display:flex;align-self:center;color:#8a97a3}.t-page .t-more-arrow svg{display:block}.t-page .t-final-sec{padding:0 0 clamp(56px,7vw,96px)}.t-page .t-final{background:linear-gradient(135deg, #2aa5d5 0%, #1f8fbf 100%);border-radius:24px;padding:clamp(36px,5vw,64px) clamp(20px,4vw,48px);display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center}.t-page .t-final .t-h2{color:#fff;text-align:center}.t-page .t-final-k{font-size:14px;font-weight:600;line-height:1.4;color:#fff;background:rgba(255, 255, 255, 0.16);padding:6px 14px;border-radius:999px}.t-page .t-final-p{margin:0;color:#e6f5fb;font-size:17px;line-height:1.6;text-align:center;max-width:600px}.t-page .t-final .t-btns{justify-content:center}@media(max-width: 980px){.t-page .t-steps{grid-template-columns:repeat(2, minmax(0, 1fr))}.t-page .t-mores{grid-template-columns:repeat(2, minmax(0, 1fr))}}@media(max-width: 560px){.t-page .t-steps,.t-page .t-mores{grid-template-columns:minmax(0, 1fr)}.t-page .t-step{flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:14px;padding:18px}.t-page .t-num{margin:0;width:40px;height:40px;font-size:18px}.t-page .t-step-t{flex:1 1 0}.t-page .t-step-d{flex:1 1 100%;padding-left:54px}.t-page .t-btns{flex-direction:column;align-self:stretch}.t-page .t-btns a{width:100%}}@media print{.t-page .tc-reveal,.t-page .tc-pop{animation:none !important}}
/* 054 (Oct 2026): the redone tools' header and tool card (as on the Hours to Decimal Calculator). Brand: navy #1d2b3a, gray #4f5d6b,
   blue #2aa5d5, orange #ff6500. No one-side stripes, no hover lift or glow. */
.hd { --navy: #1d2b3a; --gray: #4f5d6b; --blue: #2aa5d5; --orange: #ff6500; --line: #dfe6ed; --soft: #eef2f6; --tint: #f1f8fc; --tint-line: #d6ecf6; color: var(--navy); }
.hd *, .hd *::before, .hd *::after { box-sizing: border-box; }
.hd-hero { padding: 56px 0 64px; background: linear-gradient(180deg, #fff 0%, #fff 55%, var(--tint) 55%, var(--tint) 100%); }
.hd-hero-row { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 48px; align-items: center; margin-bottom: 36px; }
.hd .hd-h1 { font-family: "Work Sans", Arial, sans-serif; font-weight: 700; font-size: 44px; line-height: 1.12; letter-spacing: -.015em; color: var(--navy); margin: 0 0 16px; text-align: left; }
.hd .t-lead { color: var(--gray); font-size: 19px; line-height: 1.6; margin: 0; max-width: 34em; text-align: left; }
.hd-chks { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 20px; font-weight: 600; font-size: 15px; }
.hd-chks span { display: inline-flex; align-items: center; gap: 8px; }
.hd-art { width: 100%; height: auto; display: block; }

.hd-tool { background: #fff; border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 1px 2px rgba(29, 43, 58, .05), 0 14px 36px rgba(29, 43, 58, .08); padding: 28px; max-width: 860px; margin: 0 auto; }
.hd-toggle { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; background: var(--soft); border-radius: 12px; padding: 6px; margin-bottom: 24px; }
.hd .hd-tab { border: 0; background: transparent; color: var(--gray); font: 600 16px/1.3 "Inter", Arial, sans-serif; padding: 12px 14px; border-radius: 9px; cursor: pointer; min-height: 48px; }
.hd .hd-tab.active { background: #fff; color: var(--navy); box-shadow: 0 1px 2px rgba(29, 43, 58, .1), 0 0 0 1px var(--line); }
.hd .hd-tab:focus-visible, .hd button:focus-visible, .hd input:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }
.hd-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.hd-row--one { grid-template-columns: 1fr; }
.hd-field label { display: block; font-weight: 600; font-size: 15px; margin-bottom: 8px; color: var(--navy); }
.hd .hd-field input { width: 100%; height: 60px; border: 2px solid var(--line); border-radius: 12px; padding: 0 18px; font: 600 24px "Inter", Arial, sans-serif; color: var(--navy); background: #fff; }
.hd .hd-field input:focus { border-color: var(--blue); }
.hd .hd-field input.border-red-500 { border-color: var(--orange); }
.hd-err { display: block; margin-top: 6px; font-size: 14px; color: var(--navy); }
.hd-err:not(:empty)::before { content: "!"; display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: var(--orange); color: #fff; font-weight: 700; font-size: 12px; margin-right: 6px; vertical-align: 1px; }
.hd-result { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 16px; margin-top: 20px; background: var(--tint); border: 1px solid var(--tint-line); border-radius: 14px; padding: 18px 22px; }
.hd .hd-result-label { margin: 0; font-size: 14px; font-weight: 600; color: var(--gray); text-transform: uppercase; letter-spacing: .04em; }
.hd .hd-result-value { margin: 2px 0 0; font-family: "Work Sans", Arial, sans-serif; font-weight: 700; font-size: 44px; line-height: 1.1; color: var(--navy); }
.hd .hd-copy { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 10px 18px; border-radius: 10px; border: 2px solid var(--navy); background: #fff; color: var(--navy); font: 700 16px "Inter", Arial, sans-serif; cursor: pointer; }
.hd .hd-copy:hover { background: var(--tint); }
.hd .hd-copy:disabled { opacity: .45; cursor: default; }
.hd-feedback { grid-column: 1 / -1; font-size: 14px; color: var(--navy); min-height: 0; }
.hd-examples { margin-top: 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.hd .hd-examples p { margin: 0; font-size: 14px; font-weight: 600; color: var(--gray); }
.hd-examples > div { display: flex; flex-wrap: wrap; gap: 8px; }
.hd .hd-chip { border: 1px solid var(--line); background: #fff; color: var(--navy); border-radius: 999px; padding: 8px 14px; font: 600 14px "Inter", Arial, sans-serif; cursor: pointer; min-height: 40px; }
.hd .hd-chip:hover { background: var(--tint); border-color: var(--tint-line); }

.hd-chart-sec { background: var(--tint); }
.hd .t-sub { color: var(--gray); font-size: 17px; margin-top: 8px; }
.hd-chart { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-top: 8px; }
.hd-chart div { display: flex; justify-content: space-between; align-items: baseline; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 9px 12px; font-size: 15px; }
.hd-chart span { color: var(--gray); }
.hd-chart b { color: var(--navy); font-weight: 700; }
.hd-how { max-width: 860px; }
.hd .hd-formula { margin: 8px 0 0; font-family: "Work Sans", Arial, sans-serif; font-weight: 700; font-size: 24px; text-align: center; background: var(--tint); border: 1px solid var(--tint-line); border-radius: 14px; padding: 18px; }
.hd-ex3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.hd-ex3 div { border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; background: #fff; }
.hd-ex3 b { display: block; font-size: 16px; }
.hd-ex3 span { color: var(--gray); font-size: 15px; }
.hd .hd-p { color: var(--gray); font-size: 17px; line-height: 1.65; margin: 0; }
.hd-table-card { border: 1px solid var(--line); border-radius: 14px; padding: 18px 22px; background: #fff; }
.hd-table-card h3 { font-family: "Work Sans", Arial, sans-serif; font-size: 20px; margin: 0 0 8px; }
.hd .hd-table { width: 100%; border-collapse: collapse; font-size: 16px; }
.hd .hd-table th, .hd .hd-table td { text-align: left; padding: 10px 0; border-bottom: 1px solid var(--soft); }
.hd .hd-table th { font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--gray); }
.hd .hd-table td:last-child, .hd .hd-table th:last-child { text-align: right; font-weight: 600; }

@media (max-width: 900px) {
	.hd-hero { padding: 32px 0 40px; background: linear-gradient(180deg, #fff 0%, #fff 62%, var(--tint) 62%); }
	.hd-hero-row { grid-template-columns: 1fr; gap: 20px; margin-bottom: 24px; }
	.hd-art-wrap { max-width: 360px; }
	.hd .hd-h1 { font-size: 32px; }
	.hd .t-lead { font-size: 17px; }
	.hd-tool { padding: 18px; }
	.hd .hd-tab { font-size: 14px; padding: 10px 8px; }
	.hd-row { grid-template-columns: 1fr 1fr; gap: 12px; }
	.hd .hd-result-value { font-size: 36px; }
	.hd-chart { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.hd-ex3 { grid-template-columns: 1fr; }
	.hd .hd-formula { font-size: 19px; }
}

/* the minutes chart folds on phones: 12 minutes, then "Show all 59 minutes" (a checkbox, no script) */
.hd-more-cb { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.hd-more-btn { display: none; }
@media (max-width: 900px) {
	.hd-chart > div:nth-child(n+13) { display: none; }
	.hd-more-cb:checked + .hd-chart > div { display: flex; }
	.hd-more-btn { display: inline-flex; align-items: center; justify-content: center; margin: 12px auto 0; min-height: 48px; padding: 10px 20px; border: 2px solid var(--navy); border-radius: 10px; background: #fff; color: var(--navy); font: 700 16px "Inter", Arial, sans-serif; cursor: pointer; }
	.hd-more-cb:checked ~ .hd-more-btn { display: none; }
	.hd-more-cb:focus-visible ~ .hd-more-btn { outline: 3px solid var(--blue); outline-offset: 2px; }
}

/* 062 (Oct 2026): the IP Address Finder restyled (on top of the rules above and the page's old sheet). Brand colors only; no
   one-side stripes, no hover lift or glow. */
.ip .ip-tool { max-width: 860px; display: grid; gap: 14px; }
.ip .ip-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 16px; background: var(--tint); border: 1px solid var(--tint-line); border-radius: 14px; padding: 18px 22px; }
.ip .ip-value { margin: 2px 0 0; font: 700 40px/1.15 "Work Sans", Arial, sans-serif; color: var(--navy); overflow-wrap: anywhere; }
.ip .ip-value--muted { font-size: 26px; color: var(--gray); }
.ip .ip-sub { margin: 6px 0 0; color: var(--gray); font-size: 15px; line-height: 1.5; }
.ip .ip-sub a, .ip-article a { text-transform: none !important; color: var(--navy) !important; text-decoration: underline; text-decoration-color: var(--blue); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.ip .hd-copy[hidden] { display: none; }
/* the two short articles: one readable column */
.ip-article { max-width: 860px !important; margin: 0 auto; }
.ip-article > div { margin: 0 !important; gap: 36px !important; max-width: none !important; }
.ip-article h2 { font: 700 30px/1.25 "Work Sans", Arial, sans-serif !important; color: var(--navy) !important; margin: 0 0 12px !important; text-align: left !important; }
.ip-article p { color: var(--gray) !important; font-size: 17px !important; line-height: 1.7 !important; text-align: left !important; }
@media (max-width: 900px) {
	.ip .ip-value { font-size: 32px; }
	.ip .ip-value--muted { font-size: 22px; }
	.ip-article h2 { font-size: 25px !important; }
}
@media (max-width: 600px) {
	.ip .ip-row { grid-template-columns: 1fr; padding: 16px; }
	.ip .ip-row .hd-copy { justify-self: start; }
}
/* the page's own sheet gives the content a 64px top margin, 64px sides and a 1296px cap: the header sits flush and the bands span the page */
body.postid-840 .entry-content { margin-top: 0 !important; max-width: none !important; width: auto !important; padding: 0 !important; }
/* 059b: only the chevron after each FAQ question. pages-base.css, resources.css and the Time Card sheet add a "▼" after any
   ".faq details summary", and these FAQ sections carry "faq" (the schema plugin reads them by it) */
.t-page .faq .t-faq summary::after, .t-page .faq .t-faq summary::before { content: none !important; display: none !important; }

/* 059 (Oct 28, after the live check): the light band starts just above the tool card (it began partway down the card) */
.hd .hd-hero { background: #fff !important; position: relative; z-index: 0; }
.hd .hd-hero .hd-tool { position: relative; }
.hd .hd-hero .hd-tool::before { content: ""; position: absolute; z-index: -1; top: -40px; bottom: -64px; left: 50%; width: 100vw; transform: translateX(-50%); background: var(--tint); }
@media (max-width: 900px) {
	.hd .hd-hero .hd-tool::before { top: -24px; bottom: -40px; }
}
/* 059: section headings get a wider measure and balanced lines (no lone last word) */
.hd .t-head-c { max-width: 960px; }
.hd .t-h2, .hd .hd-h1, .hd .t-final h2 { text-wrap: balance; }
/* 059b: only the chevron after each FAQ question. pages-base.css, resources.css and the Time Card sheet add a "▼" after any
   ".faq details summary", and these FAQ sections carry "faq" (the schema plugin reads them by it) */
.t-page .faq .t-faq summary::after, .t-page .faq .t-faq summary::before { content: none !important; display: none !important; }
/* the content area spans the page like the other redone tools */
body.postid-840 .entry-content { margin-top: 0 !important; max-width: none !important; width: auto !important; padding: 0 !important; }