:root{--navy:#10294e;--deep:#0b1e3a;--ink:#162b46;--muted:#4b5b6f;--gold:#cfae7e;--accent:#937038;--paper:#f9f6ee;--line:#ddd5c6;--serif:Georgia,'Times New Roman',serif;--sans:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.6}a{color:inherit}img{display:block;max-width:100%;height:auto}a:focus-visible,summary:focus-visible{outline:3px solid #ab7e30;outline-offset:5px}.wrap{width:min(1220px,calc(100% - 100px));margin-inline:auto}.skip{position:fixed;top:1rem;left:1rem;padding:.6rem 1rem;background:white;z-index:5;transform:translateY(-200%)}.skip:focus{transform:none}.top{min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:1rem}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;font:1.5rem/1.1 var(--serif);white-space:nowrap}.brand img{border-radius:50%;object-fit:cover}.brand small{display:block;margin-top:6px;font:700 .62rem/1 var(--sans);letter-spacing:.26em;color:#755c30}.top nav{display:flex;align-items:center;gap:30px;font-size:.875rem;font-weight:650}.top nav a{text-decoration:none}.top nav a:hover{text-decoration:underline;text-underline-offset:5px}.nav-button{border:1px solid #af9972;padding:9px 14px}.nav-button span{margin-left:6px}
.hero{min-height:560px;background:var(--deep);color:var(--paper);display:grid;grid-template-columns:1fr 1fr}.hero-content{padding:84px clamp(30px,5vw,88px) 85px max(50px,calc((100vw - 1220px)/2));align-self:center}.eyebrow{font-size:.72rem;letter-spacing:.2em;font-weight:750;margin:0 0 17px;display:flex;align-items:center;gap:10px}.eyebrow span,.hero-image figcaption span{width:8px;height:8px;display:inline-block;background:#a77f3e;transform:rotate(45deg);flex:none}.hero .eyebrow,.contact .eyebrow{color:var(--gold)}.hero .eyebrow span,.contact .eyebrow span{background:var(--gold)}h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;line-height:1.06}h1{font-size:clamp(3rem,5.25vw,5.7rem);letter-spacing:-.053em;max-width:660px}h1 em{color:var(--gold);font-weight:400;display:block}h2{font-size:clamp(2.45rem,4.2vw,4.2rem);letter-spacing:-.045em}.intro{color:#e0e7ee;max-width:470px;margin:24px 0 30px;font-size:1.04rem}.actions{display:flex;gap:16px 22px;align-items:center;flex-wrap:wrap}.button{display:inline-flex;justify-content:space-between;gap:14px;align-items:center;text-decoration:none;padding:11px 16px;font-weight:750;font-size:.875rem;min-height:45px}.gold{background:linear-gradient(110deg,#e6d0ae,#cfae7e 57%,#be9868);color:var(--deep)}.gold:hover{background:linear-gradient(110deg,#efdbbb,#d9bb90 57%,#c9a677)}.text-link{font-size:.85rem;font-weight:650;text-underline-offset:5px}.hero-image{margin:0;position:relative;min-height:100%;overflow:hidden}.hero-image img{width:100%;height:100%;object-fit:cover;object-position:95% center;position:absolute;inset:0}.hero-image figcaption{position:absolute;bottom:25px;right:25px;background:#f9f6ee;color:var(--navy);padding:7px 12px;font-size:.63rem;letter-spacing:.16em;font-weight:750;display:flex;align-items:center;gap:8px}.hero-image figcaption span{width:5px;height:5px}
.support{padding-block:79px 88px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:31px}.section-heading>p{max-width:340px;margin:0;color:var(--muted)}.service-grid{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.service-grid article{grid-column:span 2;min-height:222px;padding:22px 23px 20px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start}.service-grid article:nth-child(n+4){grid-column:span 3}.index{color:#755c30;font-size:.72rem;font-weight:750;letter-spacing:.12em;margin-bottom:10px}.service-grid h3{font-size:clamp(1.7rem,2.35vw,2.35rem);letter-spacing:-.035em}.service-grid p{font-size:.92rem;color:var(--muted);margin:9px 0 16px;max-width:350px}.service-grid a{margin-top:auto;color:#26476c;font-size:.82rem;font-weight:750;text-underline-offset:4px}.service-grid a span{margin-left:4px}
.questions{background:#edf1f4;padding:62px 0 68px}.question-grid,.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:42px}.questions details{border-top:1px solid #bdc8d1;padding:15px 0}.questions details:last-child{border-bottom:1px solid #bdc8d1}.questions summary{cursor:pointer;font-weight:700}.questions details p{color:var(--muted);margin:10px 0 0}.contact{padding:62px 0;background:var(--navy);color:var(--paper)}.contact p:not(.eyebrow){color:#e0e7ee;margin-bottom:0}.contact-links{display:flex;align-items:flex-start;justify-content:center;flex-direction:column;gap:12px}.contact-links>a:not(.button){text-underline-offset:4px}.footer{min-height:69px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.8rem;color:var(--muted)}
@media(max-width:900px){.wrap{width:calc(100% - 60px)}.hero-content{padding-left:30px;padding-block:62px}.top nav{gap:16px}.service-grid article{padding:19px}.hero{min-height:480px}}
@media(max-width:640px){.wrap{width:calc(100% - 36px)}.top{min-height:68px}.brand{font-size:1.24rem;gap:6px}.brand img{width:39px;height:39px}.brand small{font-size:.5rem}.top nav>a:not(.nav-button){display:none}.nav-button{padding:7px 9px;font-size:.76rem;white-space:nowrap}.hero{display:block;min-height:0}.hero-content{padding:39px 18px 35px}.hero-image{min-height:230px}.hero-image img{object-position:center 57%}.hero-image figcaption{bottom:13px;right:13px}.intro{margin:15px 0 22px}.section-heading{display:block;margin-bottom:20px}.section-heading>p{margin-top:12px}.support{padding-block:46px}.service-grid{grid-template-columns:1fr}.service-grid article,.service-grid article:nth-child(n+4){grid-column:auto;min-height:0}.question-grid,.contact-grid{grid-template-columns:1fr;gap:24px}.questions,.contact{padding:40px 0}.footer{font-size:.72rem;min-height:60px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.hero-content { background: radial-gradient(ellipse at top left, #183963 0, transparent 70%); }
.hero .intro { max-width: 415px; }
.hero .gold { box-shadow: 0 4px 18px #0003; }
.quick-topics { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.quick-topics a { display: inline-flex; align-items: center; min-height: 36px; border: 1px solid #f9f6ee55; border-radius: 99px; padding: 4px 12px; font-size: .8rem; font-weight: 650; text-decoration: none; }
.quick-topics a:hover { background: #f9f6ee1c; border-color: var(--gold); }
.service-grid article:target { background: #f0e6d2; }

.topic-guide { width: 100%; border-top: 1px solid var(--line); padding-top: 10px; margin: 0 0 15px; }
.topic-guide summary { cursor: pointer; color: var(--navy); font-size: .85rem; font-weight: 700; }
.topic-guide[open] summary { margin-bottom: 8px; }
.topic-guide p { max-width: none; }
.topic-guide ul { margin: 0 0 10px; padding-left: 19px; }
.topic-guide li + li { margin-top: 6px; }

.header { background: #0d223e; color: var(--paper); border-bottom: 1px solid #f9f6ee29; }
.header .brand small { color: var(--gold); }
.header .nav-button { border-color: #cfae7e8c; border-radius: 99px; }
.hero { position: relative; isolation: isolate; }
.hero-content { padding-block: 64px; background: none; }
.hero .gold { border-radius: 99px; padding-inline: 20px; }
.quick-topics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  max-width: 550px;
  margin-top: 25px;
  padding: 15px;
  border: 1px solid #c9ddf153;
  border-radius: 16px;
  background: #142f4ee6;
}
.quick-topics p { grid-column: 1 / -1; margin: 0 0 3px; color: var(--gold); font-size: .67rem; font-weight: 750; letter-spacing: .15em; text-transform: uppercase; }
.quick-topics a { justify-content: space-between; gap: 6px; border-color: #d2e3f02e; border-radius: 8px; background: #f9f6ee0e; }
.quick-topics a span { color: var(--gold); }
/* Blend the photograph into the hero on desktop and stacked layouts. */
.hero-image::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, var(--deep), #0b1e3a50 16%, transparent 37%, transparent 72%, #0a1c2d95 92%, #0a1c2d);
}
@media (min-width: 641px) and (max-width: 900px) {
  .hero-image::after { background: linear-gradient(90deg, var(--deep), #0b1e3a72 18%, transparent 52%); }
}
@media (min-width: 901px) {
  .hero { display: block; min-height: 625px; }
  .hero-content { max-width: min(730px, 64vw); position: relative; z-index: 1; }
  .hero-image { position: absolute; inset: 0 0 0 35%; z-index: -1; }
  .hero-image::after { background: linear-gradient(90deg, var(--deep) 0%, #0b1e3ac7 20%, #0b1e3a56 47%, transparent 74%), linear-gradient(0deg, #0b1e3a65, transparent 36%); }
  .hero-image figcaption { z-index: 1; border-radius: 99px; }
}
@media (max-width: 640px) {
  .hero-content { padding-block: 37px 29px; }
  .quick-topics { margin-top: 20px; padding: 11px; gap: 6px; }
  .quick-topics a { font-size: .75rem; padding-inline: 8px; }
}

.support { background: radial-gradient(ellipse at 90% 10%, #183c56, #0a1c2d 70%); color: #fffaf1; }
.support .eyebrow, .support .section-heading > p { color: #bed0df; }
.support .eyebrow span { background: #79c7f1; }
.service-grid { gap: 14px; border: 0; align-items: start; }
.service-grid article {
  --card-position: 50%;
  position: relative;
  isolation: isolate;
  min-height: 347px;
  padding: 23px 24px;
  border: 1px solid #a0c0d54d;
  border-radius: 21px;
  background: #101f2e;
  scroll-margin-top: 18px;
}
.service-grid article::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(180deg, #08172462 0%, #081724db 41%, #081724 92%), url("service-interior.webp") var(--card-position) center / cover;
}
#immigration { --card-position: 5%; }
#family { --card-position: 36%; }
#housing { --card-position: 68%; }
#pip { --card-position: 96%; }
#care { --card-position: 100%; }
.service-grid article:target { outline: 2px solid #7ac9ef; outline-offset: 3px; background: #101f2e; }
.card-top { display: flex; align-items: center; justify-content: space-between; width: 100%; margin-bottom: 29px; }
.card-top .index, .card-icon { color: #7ac9ef; margin: 0; }
.card-icon svg, .card-action svg { display: block; }
.service-grid h3 { font-size: clamp(1.95rem, 3vw, 2.75rem); }
.service-grid p { color: #e4edf5; max-width: 48ch; }
.service-grid .card-subtitle { color: #8cd2f5; margin: 11px 0 0; }
.service-grid .card-subtitle + p { margin-top: 4px; }
.topic-guide { border-color: #b6d1e549; }
.topic-guide summary, .service-grid .topic-guide a { color: #a9def8; }
.service-grid .card-action { display: grid; place-items: center; border: 1px solid #b6d1e57a; background: #f9f6ee12; border-radius: 50%; width: 43px; height: 43px; color: #fffaf1; }
.service-grid .card-action:hover { background: #a9def82c; }
.nav-button svg, .quick-topics svg, .button svg, .topic-guide svg { vertical-align: middle; }
@media (max-width: 640px) {
  .service-grid { gap: 13px; }
  .service-grid article, .service-grid article:nth-child(n+4) { min-height: 300px; padding: 20px 21px; }
  .card-top { margin-bottom: 26px; }
}

.hero-image img { object-position: 62% 46%; }
.footer { flex-wrap: wrap; padding-block: 12px; }
.footer small { font-size: inherit; }

.hero-image { isolation: isolate; }
.hero-image img { object-position: 62% 62%; }
.hero-image::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(180deg, #12365b 0%, #12365b00 39%, #12365b00 52%, #185c96a8 80%, #1346738c 100%);
  mix-blend-mode: screen;
}
.hero-image::after {
  z-index: 2;
  background: linear-gradient(180deg, var(--deep), #0b1e3a26 12%, transparent 24%, transparent 89%, #0a1c2d7a);
}
@media (min-width: 641px) {
  .hero-image::after { background: linear-gradient(90deg, var(--deep), #0b1e3ac9 14%, #0b1e3a36 38%, transparent 60%); }
}
@media (max-width: 640px) {
  .hero-image { min-height: 285px; }
}

.header { background: linear-gradient(115deg, #0b1726, #0b1320 66%, #101d2c); border-bottom: 1px solid #d4ddea29; }
.header .top { min-height: 96px; }
.header .brand { gap: 16px; color: #fffdf9; font-size: clamp(1.25rem, 2.15vw, 1.8rem); letter-spacing: .1em; text-transform: uppercase; }
.header .brand img { width: 60px; height: 60px; flex: none; }
@media (max-width: 640px) {
  .header .top { min-height: 82px; gap: 7px; }
  .header .brand { gap: 8px; font-size: clamp(.85rem, 4.05vw, 1.18rem); letter-spacing: .085em; }
  .header .brand img { width: 46px; height: 46px; }
}
