/* Tangier service page. Extend the shared Black Platinum components only. */
.local-web { --lw-panel: var(--surface); }
.local-web h1, .local-web h2, .local-web h3 { color: var(--white); }
.local-web .btn { white-space: normal; text-align: center; }
.local-web .section { padding-block: clamp(3rem, 6vw, 5.5rem); }
.local-web main section { scroll-margin-block-start: 100px; }
.lw-hero { padding-block: 112px 3.5rem; }
.lw-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem; font-size: 0.8rem; margin-block-end: 2.25rem; color: var(--text-secondary); }
.lw-breadcrumb a { text-decoration: underline; text-underline-offset: 0.2em; }
.lw-hero__grid { display: grid; gap: 2.5rem; align-items: center; }
.lw-hero h1 { font-size: clamp(2.25rem, 4.4vw, 4rem); line-height: 1.12; letter-spacing: -0.035em; max-width: 16ch; margin-block-end: 1.5rem; }
[dir="rtl"] .lw-hero h1 { letter-spacing: normal; line-height: 1.4; }
.lw-lead { max-width: 60ch; font-size: 1.08rem; }
.lw-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.85rem 1.25rem; margin-block-start: 1.75rem; }
.lw-note { margin-block-start: 1.25rem; font-size: 0.85rem; color: var(--text-secondary); }
.lw-hero__proof { min-width: 0; padding: 1rem; background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.lw-hero__badge { display: block; color: var(--platinum); font-size: 0.8rem; margin-block-end: 0.8rem; }
.lw-hero__proof img { display: block; width: 100%; height: auto; border-radius: var(--radius-sm); }
.lw-hero__proof figcaption { margin-block-start: 0.85rem; font-size: 0.85rem; color: var(--text-secondary); }
.lw-context { background: var(--surface); border-block: 1px solid var(--border); }
.lw-two-col { display: grid; gap: 1.5rem; }
.lw-prose p + p { margin-block-start: 1.25rem; }
.lw-service-grid, .lw-foundation__grid, .lw-project-grid, .lw-process-grid, .lw-testimonial-grid { display: grid; gap: 1.5rem; }
.lw-service-grid .service-card { padding: 1.75rem; }
.lw-index { display: block; font-family: var(--font-alt); font-size: 0.85rem; font-weight: 600; color: var(--platinum); margin-block-end: 1.25rem; }
.lw-foundation { margin-block-start: 3.5rem; }
.lw-foundation > h2 { font-size: clamp(1.6rem, 3vw, 2rem); margin-block-end: 1.5rem; }
.lw-foundation__grid article { padding-block-start: 1.25rem; border-block-start: 1px solid var(--border-strong); }
.lw-foundation__grid h3, .lw-process-step h3 { margin-block-end: 0.6rem; font-size: 1.1rem; }
.lw-featured-project { display: grid; gap: 0; background: var(--bg-dark); border: 1px solid var(--border-strong); border-radius: var(--radius); overflow: hidden; }
.lw-project-image { display: block; overflow: hidden; background: var(--bg-dark); }
.lw-project-image img { display: block; width: 100%; height: auto; }
.lw-featured-project__copy, .lw-project-card__body { padding: 1.5rem; }
.lw-featured-project h3 { font-size: 1.6rem; line-height: 1.3; margin-block-end: 1rem; }
.lw-featured-project .eyebrow { letter-spacing: 0.04em; font-size: 0.75rem; }
.lw-featured-project .link-arrow, .lw-project-card .link-arrow { margin-block-start: 1.25rem; }
.lw-project-grid { margin-block-start: 1.5rem; }
.lw-project-card { background: var(--bg-dark); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.lw-project-card .lw-project-image img { aspect-ratio: 8 / 5; object-fit: cover; object-position: top; }
.lw-category { display: block; color: var(--platinum); font-size: 0.8rem; margin-block-end: 0.5rem; }
.lw-project-card h3 { font-size: 1.35rem; margin-block-end: 0.75rem; }
.lw-actions--section { margin-block-start: 2rem; }
.lw-process-grid { list-style: none; }
.lw-process-step { padding: 1.5rem; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
.lw-testimonial { display: flex; flex-direction: column; align-items: start; padding: 1.75rem; background: var(--bg-dark); border: 1px solid var(--border-strong); border-radius: var(--radius); }
.lw-testimonial blockquote { color: var(--white); font-size: 1.1rem; line-height: 1.7; }
.lw-testimonial figcaption { display: grid; gap: 0.25rem; margin-block: 1.5rem 1rem; font-size: 0.9rem; }
.lw-testimonial figcaption strong { color: var(--platinum); }
.lw-testimonial .link-arrow { margin-block-start: auto; }
.lw-faq { max-width: 900px; }
.lw-faq details { padding-block: 1.25rem; border-block-end: 1px solid var(--border-strong); }
.lw-faq summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; cursor: pointer; list-style: none; color: var(--white); }
.lw-faq summary::-webkit-details-marker { display: none; }
.lw-faq summary h3 { font-size: 1.05rem; font-weight: 600; }
.lw-faq summary::after { content: '+'; flex-shrink: 0; font-size: 1.4rem; }
.lw-faq details[open] summary::after { transform: rotate(45deg); }
.lw-faq details > p { margin-block-start: 1rem; max-width: 75ch; }
.lw-final { background: var(--surface); border-block-start: 1px solid var(--border); }
.lw-final .section-subtitle { margin-block-end: 1.75rem; }
.lw-related { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; margin-block-start: 2.25rem; }
.lw-related a { color: var(--platinum); text-decoration: underline; text-underline-offset: 0.25em; }
.local-web .link-arrow { color: var(--platinum); }
.local-web :is(a, button, summary):focus-visible { outline: 2px solid var(--platinum); outline-offset: 4px; }
@media (max-width: 480px) {
  .lw-actions .btn { width: 100%; }
  .local-web .nav__cta { max-width: 155px; height: auto; min-height: 42px; padding-block: 6px; line-height: 1.3; }
  .lw-hero__proof { padding: 0.75rem; }
  .lw-featured-project__copy, .lw-project-card__body { padding: 1.25rem; }
}
@media (min-width: 700px) {
  .lw-service-grid, .lw-foundation__grid, .lw-project-grid, .lw-process-grid, .lw-testimonial-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 980px) {
  .lw-hero__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 3rem; }
  .lw-two-col { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 4rem; }
  .lw-service-grid, .lw-process-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lw-featured-project { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: center; }
  .lw-featured-project__copy { padding: 2rem; }
}