/* ==========================================================================
   Embassy of India, Vilnius — inner page template (DBIM v3.0, GIGW 3.0)
   Uses the tokens defined at the top of style.css.
   ========================================================================== */

/* Page head: breadcrumb + title (DBIM §7.3 inner page) */
.page-head{ background:var(--key-50); border-bottom:1px solid var(--key-200); padding:20px 0 24px; }
.breadcrumb ol{ display:flex; flex-wrap:wrap; gap:4px 0; margin:0 0 10px; padding:0; list-style:none; font-size:.875rem; }
.breadcrumb li{ display:flex; align-items:center; color:var(--grey3); }
.breadcrumb li + li::before{ content:"›"; margin:0 8px; color:var(--grey3); }
.breadcrumb a{ color:var(--key-900); text-decoration:underline; text-underline-offset:2px; }
.breadcrumb [aria-current]{ color:var(--text); font-weight:600; }
.page-head h1{ margin:0; font-size:2rem; max-width:60ch; }

/* Layout: section menu + content */
.inner-layout{ display:grid; grid-template-columns:300px minmax(0,1fr); gap:40px; padding-top:32px; padding-bottom:48px; align-items:start; }
.inner-layout.no-side{ grid-template-columns:minmax(0,1fr); }
.side-nav{ position:sticky; top:72px; border:1px solid var(--key-200); background:#fff; }
.side-nav summary{ list-style:none; cursor:default; padding:14px 18px; background:var(--key-900); }
.side-nav summary::-webkit-details-marker{ display:none; }
.side-nav summary h2{ margin:0; color:#fff; font-size:1rem; font-weight:600; }
.side-nav > details > ul{ padding:6px 0; }
.side-nav li a{ display:block; padding:9px 18px; color:var(--text); font-size:.9375rem; border-left:4px solid transparent; }
.side-nav li a:hover{ background:var(--key-50); color:var(--key-900); }
.side-nav li.on > a{ border-left-color:var(--key-700); background:var(--key-50); color:var(--key-900); font-weight:600; }
.side-nav li a[aria-current="page"]{ text-decoration:underline; text-underline-offset:3px; }
.side-nav li ul{ padding:2px 0 8px; }
.side-nav li ul a{ padding:6px 18px 6px 34px; font-size:.875rem; font-weight:400; border-left:0; }
.side-nav li ul li.on > a{ background:none; font-weight:600; color:var(--key-700); }

/* Content typography */
.content{ min-width:0; max-width:900px; font-size:1rem; line-height:1.65; }
.content > :first-child{ margin-top:0; }
.content h2{ font-size:1.5rem; margin:32px 0 12px; }
.content h3{ font-size:1.2rem; margin:24px 0 10px; }
.content h4{ font-size:1.05rem; margin:20px 0 8px; }
.content p{ margin:0 0 14px; }
.content ul,.content ol{ margin:0 0 16px; padding-left:1.5rem; }
.content ul{ list-style:disc; }
.content ol{ list-style:decimal; }
.content ol[type="a"]{ list-style:lower-alpha; }
.content ol[type="i"]{ list-style:lower-roman; }
.content li{ margin:0 0 6px; }
.content li > ul,.content li > ol{ margin:6px 0 0; }
.content a{ color:var(--info); text-decoration:underline; text-underline-offset:2px; word-break:break-word; }
.content a:hover{ color:var(--key-900); }
.content strong{ font-weight:700; }
.content hr{ border:0; border-top:1px solid var(--key-200); margin:28px 0; }
.content blockquote{ margin:0 0 16px; padding:12px 18px; border-left:4px solid var(--key-700); background:var(--key-50); }
.content img{ height:auto; }
.content figure{ margin:0 0 20px; }
.content figcaption{ font-size:.875rem; color:var(--grey3); margin-top:6px; }
.lead{ font-size:1.125rem; }
.note{ padding:14px 18px; background:#FFF8E1; border-left:4px solid var(--warning); margin:0 0 18px; }
.note.info{ background:var(--key-50); border-left-color:var(--key-700); }
.note > :last-child{ margin-bottom:0; }

/* Tables (GIGW 3.0: header cells, caption, scroll on small screens) */
.table-wrap{ overflow-x:auto; margin:0 0 20px; border:1px solid var(--key-200); }
.table-wrap:focus-visible{ outline:3px solid var(--warning); }
.content table{ width:100%; border-collapse:collapse; font-size:.9375rem; }
.content caption{ text-align:left; font-weight:600; padding:10px 14px; color:var(--key-900); background:#fff; caption-side:top; }
.content th,.content td{ border:1px solid var(--key-200); padding:10px 14px; text-align:left; vertical-align:top; }
.content thead th{ background:var(--key-900); color:#fff; font-weight:600; }
.content tbody th{ background:var(--key-50); font-weight:600; color:var(--key-900); }
.content tbody tr:nth-child(even) td{ background:#F7F9FF; }
.content td p:last-child,.content th p:last-child{ margin-bottom:0; }
.content td.num,.content th.num{ text-align:right; white-space:nowrap; }

/* Lists of links and documents */
.link-list{ list-style:none!important; padding:0!important; margin:0 0 20px; border-top:1px solid var(--linen); }
.link-list li{ margin:0; border-bottom:1px solid var(--linen); }
.link-list a{ display:flex; gap:12px; align-items:flex-start; padding:12px 4px; text-decoration:none; color:var(--text); }
.link-list a:hover{ background:var(--key-50); color:var(--key-900); }
.link-list a:hover .t{ text-decoration:underline; }
.link-list .n{ flex:none; min-width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center; background:var(--key-50); color:var(--key-900); font-weight:700; font-size:.8125rem; }
.link-list .t{ flex:1; }
.link-list .d{ flex:none; font-size:.8125rem; color:var(--grey3); white-space:nowrap; }
.link-list .icon{ color:var(--key-700); margin-top:3px; }

/* Cards grid (hub pages, personas) */
.card-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; list-style:none!important; padding:0!important; margin:0 0 24px; }
.card-grid li{ margin:0; }
.card-grid a{ display:flex; flex-direction:column; gap:6px; height:100%; padding:18px; border:1px solid var(--key-200); background:#fff; color:var(--text); text-decoration:none; box-shadow:var(--card-shadow); }
.card-grid a:hover,.card-grid a:focus-visible{ border-color:var(--key-700); background:var(--key-50); }
.card-grid a strong{ color:var(--key-900); font-size:1rem; }
.card-grid a span{ font-size:.875rem; color:var(--grey3); }
.card-grid a:hover strong{ text-decoration:underline; }

/* Profile (Ambassador) */
.profile{ display:grid; grid-template-columns:220px minmax(0,1fr); gap:28px; align-items:start; margin-bottom:24px; }
.profile img{ width:220px; height:auto; border:1px solid var(--key-200); background:#fff; }
.profile .role{ color:var(--grey3); margin:-6px 0 14px; }
.facts{ display:grid; grid-template-columns:max-content minmax(0,1fr); gap:8px 20px; margin:0 0 20px; padding:16px 18px; background:var(--key-50); border:1px solid var(--key-200); }
.facts dt{ font-weight:600; color:var(--key-900); }
.facts dd{ margin:0; }

/* Contact blocks */
.contact-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; margin:0 0 24px; }
.contact-grid > div{ border:1px solid var(--key-200); padding:18px; background:#fff; }
.contact-grid h2,.contact-grid h3{ font-size:1rem; margin:0 0 8px; display:flex; gap:8px; align-items:center; }
.contact-grid h2 .icon,.contact-grid h3 .icon{ color:var(--key-700); }
.contact-grid p{ margin:0 0 6px; }
.email{ white-space:nowrap; }

/* FAQ accordion */
.faq details{ border:1px solid var(--key-200); margin:0 0 8px; background:#fff; }
.faq summary{ cursor:pointer; padding:14px 18px; font-weight:600; color:var(--key-900); list-style:none; display:flex; justify-content:space-between; gap:12px; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; font-size:1.25rem; line-height:1; }
.faq details[open] summary::after{ content:"−"; }
.faq details[open] summary{ border-bottom:1px solid var(--key-200); background:var(--key-50); }
.faq .a{ padding:14px 18px; }
.faq .a > :last-child{ margin-bottom:0; }

/* Forms (GIGW 3.0: visible labels, required marker, error text) */
.form{ max-width:720px; }
.form .row{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 20px; }
.form .f{ margin:0 0 16px; }
.form label,.form legend{ display:block; font-weight:600; margin:0 0 6px; color:var(--key-900); }
.form .req{ color:var(--error); }
.form input[type="text"],.form input[type="email"],.form input[type="tel"],.form input[type="date"],.form select,.form textarea{
  width:100%; padding:10px 12px; border:1px solid var(--grey2); background:#fff; font:inherit; color:var(--text); border-radius:0; }
.form textarea{ min-height:96px; resize:vertical; }
.form input:focus,.form select:focus,.form textarea:focus{ outline:3px solid var(--warning); outline-offset:0; border-color:var(--key-900); }
.form .hint{ font-size:.8125rem; color:var(--grey3); margin:4px 0 0; }
.form .err{ font-size:.8125rem; color:var(--error); margin:4px 0 0; font-weight:600; }
.form [aria-invalid="true"]{ border-color:var(--error)!important; }
.form fieldset{ border:1px solid var(--key-200); padding:14px 18px; margin:0 0 16px; }
.form .captcha{ display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.form .captcha img{ border:1px solid var(--key-200); }
.form .actions{ display:flex; gap:12px; flex-wrap:wrap; margin-top:8px; }
.form-msg{ padding:14px 18px; margin:0 0 20px; border-left:4px solid var(--success); background:#E8F5EE; }
.form-msg.error{ border-left-color:var(--error); background:#FDECEE; }

/* Gallery */
.gallery-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:20px; list-style:none!important; padding:0!important; margin:0 0 24px; }
.gallery-grid li{ margin:0; }
.gallery-grid a{ display:block; border:1px solid var(--key-200); background:#fff; color:var(--text); text-decoration:none; height:100%; }
.gallery-grid a:hover,.gallery-grid a:focus-visible{ border-color:var(--key-700); box-shadow:var(--card-shadow); }
.gallery-grid img{ width:100%; aspect-ratio:4/3; object-fit:cover; background:var(--linen); }
.gallery-grid .cap{ display:block; padding:12px 14px; font-size:.9375rem; }
.gallery-grid a:hover .cap{ text-decoration:underline; }
.gallery-grid .date{ display:block; font-size:.8125rem; color:var(--grey3); margin-bottom:4px; }
.photo-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:12px; list-style:none!important; padding:0!important; }
.photo-grid li{ margin:0; }
.photo-grid a{ display:block; border:1px solid var(--key-200); }
.photo-grid img{ width:100%; aspect-ratio:4/3; object-fit:cover; background:var(--linen); }
.year-filter{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 20px; }
.year-filter button[aria-pressed="true"]{ background:var(--key-700); color:#fff; }

/* Sitemap */
.sitemap{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:24px; }
.sitemap section{ border-top:4px solid var(--key-700); padding-top:10px; }
.sitemap h2{ font-size:1.125rem; margin:0 0 10px; }
.sitemap h3{ font-size:.9375rem; margin:14px 0 6px; color:var(--grey3); text-transform:uppercase; letter-spacing:.03em; }
.sitemap ul{ list-style:none; padding:0; margin:0; }
.sitemap li{ margin:0 0 4px; font-size:.9375rem; }
.sitemap li ul{ padding-left:14px; border-left:2px solid var(--linen); margin:4px 0 8px; }

/* Search results */
.results{ list-style:none!important; padding:0!important; }
.results li{ border-bottom:1px solid var(--linen); padding:14px 0; margin:0; }
.results .t{ font-size:1.0625rem; font-weight:600; }
.results .u{ font-size:.8125rem; color:var(--success); margin:2px 0; }
.results p{ margin:4px 0 0; font-size:.9375rem; }
.results mark{ background:#FFF3B0; color:inherit; }

/* Page tools */
.page-tools{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-top:40px; padding-top:16px; border-top:1px solid var(--key-200); }
.page-tools .updated{ margin:0; font-size:.875rem; color:var(--grey3); }
.page-tools .tools{ display:flex; gap:10px; flex-wrap:wrap; }
.page-tools .btn-outline{ padding:6px 14px; font-size:.8125rem; }

/* Responsive */
@media (max-width:1100px){
  .inner-layout{ grid-template-columns:250px minmax(0,1fr); gap:28px; }
}
@media (max-width:900px){
  .inner-layout{ grid-template-columns:minmax(0,1fr); gap:20px; padding-top:20px; }
  .side-nav{ position:static; }
  .side-nav summary{ cursor:pointer; display:flex; justify-content:space-between; align-items:center; }
  .side-nav summary::after{ content:""; width:10px; height:10px; border-right:2px solid #fff; border-bottom:2px solid #fff; transform:rotate(45deg); margin-top:-4px; }
  .side-nav details[open] summary::after{ transform:rotate(-135deg); margin-top:4px; }
  .profile{ grid-template-columns:minmax(0,1fr); }
  .form .row{ grid-template-columns:minmax(0,1fr); }
}
@media (max-width:760px){
  .page-head h1{ font-size:1.5rem; }
  .content h2{ font-size:1.25rem; }
  .facts{ grid-template-columns:minmax(0,1fr); gap:2px; }
  .facts dd{ margin-bottom:8px; }
  .link-list .d{ display:none; }
}
html.hc .page-head,html.hc .side-nav li.on > a,html.hc .facts{ background:#fff; }
html.hc .content thead th,html.hc .side-nav summary{ background:#000; }

/* Numbered link lists (service and form lists) */
ol.link-list.numbered{ counter-reset:ll; }
ol.link-list.numbered > li{ counter-increment:ll; }
ol.link-list.numbered > li > a::before{ content:counter(ll); flex:none; min-width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center; background:var(--key-50); color:var(--key-900); font-weight:700; font-size:.8125rem; }
.link-list a .ft{ align-self:center; }
.ta-c{ text-align:center; }
/* Links and labels on tinted backgrounds: darkest key colour for 4.5:1 contrast (DBIM: #162F6A on light-blue panels) */
.content tbody tr:nth-child(even) td a,.content tbody th a,.note a,.facts a,.faq details[open] summary a{ color:var(--key-900); }
.side-nav li.on .ft,.side-nav li a:hover .ft,.link-list a:hover .ft,.card-grid a:hover .ft,.note .ft,.content tbody tr:nth-child(even) .ft{ color:#B02A37; }
.content .embed-gate a{ color:var(--key-900); }