/* Tanggal.net date-first experience. No calendar grid is rendered on the homepage. */
.tgl-topnav { display:flex;align-items:center;gap:6px;margin-left:auto; }
.tgl-topnav a { padding:9px 11px;border-radius:9px;color:var(--ink);text-decoration:none;font-weight:700;font-size:.87rem; }
.tgl-topnav a:hover,.tgl-topnav a:focus-visible { background:#e1f1ec; }
.tgl-mobile-nav { display:none;position:relative;margin-left:auto; }
.tgl-mobile-nav summary { cursor:pointer;list-style:none;border:1px solid var(--line);padding:9px 14px;border-radius:10px;font-weight:700; }
.tgl-mobile-nav summary::-webkit-details-marker { display:none; }
.tgl-mobile-nav nav { position:absolute;z-index:10;top:calc(100% + 9px);right:0;min-width:225px;display:grid;gap:2px;padding:10px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow); }
.tgl-mobile-nav nav a { padding:10px;color:var(--ink);text-decoration:none;white-space:nowrap; }
.tgl-mobile-nav nav a:hover { background:var(--paper); }
.tgl-date-hero { padding:78px 0 80px;background:#123e43;color:#fff; }
.tgl-date-hero__inner { display:grid;grid-template-columns:minmax(0,1.3fr) minmax(230px,.7fr);gap:66px;align-items:center; }
.tgl-date-eyebrow,.tgl-tool-zone__heading>span { display:block;letter-spacing:.17em;font-size:.72rem;font-weight:800;color:#6cd8ac;margin:0 0 14px; }
.tgl-date-hero h1 { margin:0;font-size:clamp(2.65rem,5.2vw,4.8rem);letter-spacing:-.06em;line-height:1.08;max-width:720px; }
.tgl-date-hero__lead { margin:21px 0 0;color:#d8eae6;font-size:1.13rem;max-width:650px;line-height:1.65; }
.tgl-date-hero__actions { display:flex;flex-wrap:wrap;gap:10px;margin-top:23px; }
.tgl-date-hero__actions a { display:inline-flex;align-items:center;justify-content:center;padding:10px 15px;border:1px solid #b1e6ce;border-radius:9px;background:#b1e6ce;color:#123e43;text-decoration:none;font-weight:750; }
.tgl-date-hero__actions a+a { background:transparent;color:#fff; }
.tgl-date-hero__actions a:focus-visible { outline:2px solid #f8c86c;outline-offset:2px; }
.tgl-today { display:grid;gap:10px;background:#f9fcf9;color:var(--ink);padding:28px;border-radius:18px;box-shadow:12px 12px 0 #357974; }
.tgl-today span { font-size:.72rem;font-weight:800;letter-spacing:.14em;color:#177069; }
.tgl-today strong { font-size:clamp(1.5rem,2.6vw,2.2rem);line-height:1.22;letter-spacing:-.04em; }
.tgl-today small { color:var(--muted);line-height:1.5; }
.tgl-tool-zone { padding:70px 0;background:#f5faf7; }
.tgl-tool-zone--page { padding:50px 0 60px; }
.tgl-tool-zone__heading { margin:0 0 22px;max-width:720px; }
.tgl-tool-zone__heading>span { color:#196968; }
.tgl-tool-zone__heading h2,.tgl-date-links h2,.tgl-date-faq h2 { margin:0 0 7px;font-size:clamp(1.7rem,3vw,2.45rem);letter-spacing:-.04em;line-height:1.2; }
.tgl-tool-zone__heading p { margin:0;color:var(--muted); }
.tgl-date-tool { display:grid;grid-template-columns:minmax(0,1.15fr) minmax(240px,.85fr);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:18px;overflow:hidden; }
.tgl-date-tool__form { align-self:center;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px;padding:34px; }
.tgl-date-tool__form label { display:grid;gap:7px;font-size:.85rem;font-weight:750; }
.tgl-date-tool__form label:first-child { grid-column:1/-1; }
.tgl-date-tool[data-date-tool="difference"] .tgl-date-tool__form label:first-child { grid-column:auto; }
.tgl-date-tool__form input,.tgl-date-tool__form select { width:100%;min-width:0;min-height:48px;padding:9px 11px;border:1px solid #a9c5bc;border-radius:9px;background:#fff;color:var(--ink);font:inherit; }
.tgl-date-tool__form input:focus-visible,.tgl-date-tool__form select:focus-visible { outline:2px solid #167a6d;outline-offset:2px; }
.tgl-date-tool__form button { grid-column:1/-1;min-height:48px;border:0;border-radius:9px;background:#123e43;color:white;cursor:pointer;font:750 1rem system-ui,sans-serif; }
.tgl-date-tool__form button:hover { background:#226661; }
.tgl-date-tool__check { display:flex!important;grid-column:1/-1;align-items:center;gap:9px; }
.tgl-date-tool__check input { width:18px!important;min-height:18px!important;accent-color:#123e43; }
.tgl-date-tool__result { min-height:230px;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:32px;background:#e6f3ed; }
.tgl-date-tool__result span { font-size:.72rem;letter-spacing:.16em;font-weight:800;color:#26726a; }
.tgl-date-tool__result strong { font-size:clamp(1.45rem,2.7vw,2.2rem);letter-spacing:-.04em;line-height:1.2;overflow-wrap:anywhere; }
.tgl-date-tool__result p { margin:0;font-size:1rem;line-height:1.55; }
.tgl-date-tool__result small { color:var(--muted);line-height:1.5; }
.tgl-date-links { padding:72px 0;background:#fff; }
.tgl-date-links__grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-top:23px; }
.tgl-date-links__grid a { position:relative;display:flex;flex-direction:column;gap:9px;padding:24px;border:1px solid var(--line);border-radius:15px;color:var(--ink);text-decoration:none; }
.tgl-date-links__grid a:hover { border-color:#2a8e80;box-shadow:var(--shadow); }
.tgl-date-links__grid span { color:#26726a;font-size:.7rem;font-weight:800;letter-spacing:.12em; }
.tgl-date-links__grid strong { font-size:1.25rem;line-height:1.25; }
.tgl-date-links__grid small { font-size:.84rem;color:var(--muted);line-height:1.55; }
.tgl-date-links__grid em { position:absolute;right:22px;top:22px;font-style:normal; }
.tgl-date-copy { max-width:950px;padding-top:60px;padding-bottom:38px; }
.tgl-date-copy section { padding-bottom:24px;margin-bottom:27px;border-bottom:1px solid var(--line); }
.tgl-date-copy h2 { font-size:1.55rem;letter-spacing:-.025em;line-height:1.25; }
.tgl-date-copy p { color:#385456;line-height:1.75; }
.tgl-date-faq { max-width:950px;padding-top:10px;padding-bottom:80px; }
.tgl-date-faq details { border-bottom:1px solid var(--line);padding:16px 0; }
.tgl-date-faq summary { cursor:pointer;font-weight:750; }
.tgl-date-faq p { margin:10px 0 0;color:var(--muted); }
.tgl-page-mast { padding:56px 0; }
.tgl-page-mast h1 { max-width:800px; }
.tgl-page-body .tgl-reading--page { max-width:840px; }
@media(max-width:900px) {
  .tgl-date-hero__inner { gap:32px;grid-template-columns:1fr; }
  .tgl-today { max-width:410px; }
  .tgl-date-tool { grid-template-columns:1fr; }
  .tgl-date-tool__result { min-height:180px; }
  .tgl-date-links__grid { grid-template-columns:1fr; }
  .tgl-topnav { display:none; }
  .tgl-mobile-nav { display:block; }
}
@media(max-width:560px) {
  .tgl-date-hero { padding:48px 0 58px; }
  .tgl-date-hero h1 { font-size:clamp(2.35rem,10vw,3.4rem); }
  .tgl-today { padding:20px;box-shadow:7px 7px 0 #357974; }
  .tgl-tool-zone,.tgl-date-links { padding:45px 0; }
  .tgl-date-tool__form,.tgl-date-tool__result { padding:20px; }
  .tgl-date-tool__form { gap:12px; }
  .tgl-date-tool__form label { grid-column:1/-1; }
  .tgl-date-copy { padding-top:43px; }
}
