/* Poison Control Centre page (page-iqraa-poison-centre.php), loaded on that
   page alone. Layout only: cards reuse existing theme designs (the shared
   page banner, About Us mission cards, Homecare mission/ethics cards, Thannal
   Registration card, Gallery cards). Theme colour tokens only. */

.pcc-about__text p, .pcc-head p, .pcc-research p, .pcc-note, .pcc-service p { color: var(--color-body); }
.pcc-wrap { max-width: 1400px; margin: 0 auto; padding-left: 24px; padding-right: 24px; }
.pcc-section { padding-top: 64px; padding-bottom: 64px; }
.pcc-section--tight-bottom { padding-bottom: 0; }
.pcc-section--tight-top { padding-top: 8px; }
.pcc p { line-height: 1.7; }
.pcc-head { max-width: 900px; margin-bottom: 32px; }
.pcc-head p, .pcc-about__text p, .pcc-research p { font-size: 1.05rem; }
.pcc-about__text p + p, .pcc-research p + p { margin-top: 16px; }

/* Phone numbers: the Thannal Registration link colour, larger, never split. */
.pcc-phone { display: inline-block; font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); font-weight: 600; white-space: nowrap; }

/* 2. About */
.pcc-about { display: grid; gap: 40px; padding-top: 64px; padding-bottom: 16px; align-items: start; }
@media (min-width: 1024px) { .pcc-about { grid-template-columns: minmax(0, 1fr) 400px; gap: 64px; } }

/* 3. Services */
.pcc-services { display: grid; gap: 20px; grid-template-columns: 1fr; margin-top: 12px; }
@media (min-width: 640px) and (max-width: 1099px) { .pcc-services { grid-template-columns: repeat(2, 1fr); } .pcc-service:last-child:nth-child(odd) { grid-column: span 2; } }
/* Desktop: two cards across the first row, the other three in the second. */
@media (min-width: 1100px) { .pcc-services { grid-template-columns: repeat(6, 1fr); } .pcc-service { grid-column: span 2; } .pcc-service:nth-child(-n+2) { grid-column: span 3; } }
/* Background: the header dropdown card gradient (class on the element). */
.pcc-service { padding: 28px; border-radius: 24px; border: 1px solid var(--color-border-subtle); display: flex; flex-direction: column; justify-content: space-between; gap: 36px; } /* gap = the least space between icon and text */
.pcc-service h3 { font-size: 1.15rem; font-weight: 600; color: var(--color-brand); margin-bottom: 8px; }
.pcc-service p { font-size: .95rem; }

/* 4. Clinical toxicology: About Us mission cards in a grid */
.pcc-tiles { display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .pcc-tiles { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .pcc-tiles { grid-template-columns: repeat(4, 1fr); } }
.pcc-tiles > div { min-height: 15rem; }
.pcc-note { margin-top: 32px; max-width: 900px; font-size: 1.05rem; }

/* 5. Gallery viewer */
.pcc-lightbox { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(0, 0, 0, .85); }
.pcc-lightbox[hidden] { display: none; }
.pcc-lightbox figure { max-width: 1100px; width: 100%; }
.pcc-lightbox img { width: 100%; max-height: 80vh; object-fit: contain; border-radius: 12px; }
.pcc-lightbox figcaption { margin-top: 12px; text-align: center; color: #fff; }
.pcc-lightbox__close { position: absolute; top: 16px; right: 22px; font-size: 40px; line-height: 1; color: #fff; cursor: pointer; }

/* 6. Research */
.pcc-research__intro { max-width: 900px; margin-bottom: 48px; }
@media (min-width: 1024px) { .pcc-research__intro { margin-bottom: 64px; } }

/* Key areas network: a text hub (Clinical Toxicology card background) with the
   areas branching off it as plain pills (header dropdown gradient, classes on
   the elements). Static teal connectors; no hover or reveal effects. */
.pcc-net { --pcc-line: var(--color-primary-a50); --pcc-dash: repeating-linear-gradient(90deg, var(--color-primary) 0 6px, transparent 6px 12px); position: relative; }
.pcc-net__side { display: flex; flex-direction: column; gap: 14px; }
.pcc-net__item { position: relative; display: flex; align-items: center; min-height: 64px; padding: 10px 28px; border-radius: 999px; border: 1px solid var(--color-border-subtle); font-weight: 500; line-height: 1.3; color: var(--color-brand); }
.pcc-net__item::before, .pcc-net__item::after, .pcc-net__side::after { content: ''; position: absolute; pointer-events: none; }

.pcc-net__hub { position: relative; display: grid; place-items: center; }
.pcc-net__core { position: relative; z-index: 1; display: flex; align-items: center; text-align: center; }
.pcc-net__core { gap: 10px; }
.pcc-net__icon { flex: none; width: 28px; height: 28px; object-fit: contain; }
.pcc-net__core h3 { font-size: 1.05rem; line-height: 1.3; }


/* Desktop: areas on both sides of a square hub (Clinical Toxicology card radius). */
@media (min-width: 1024px) {
  .pcc-net { display: grid; grid-template-columns: minmax(0, 1fr) 200px minmax(0, 1fr); align-items: center; }
  .pcc-net__hub { grid-column: 2; grid-row: 1; }
  .pcc-net__side--left { grid-column: 1; grid-row: 1; padding-right: 56px; }
  .pcc-net__side--right { grid-column: 3; grid-row: 1; padding-left: 56px; }
  .pcc-net__side { position: relative; }
  .pcc-net__item { height: 64px; }
  /* Spine: a vertical line through the item centres, 28px off the hub side. */
  .pcc-net__side--left::before, .pcc-net__side--right::before { content: ''; position: absolute; top: 32px; bottom: 32px; width: 2px; background: var(--pcc-line); }
  .pcc-net__side--left::before { right: 27px; }
  .pcc-net__side--right::before { left: 27px; }
  /* Item → spine and spine → hub connectors (dashed). */
  .pcc-net__item::after, .pcc-net__side::after { top: 50%; width: 28px; height: 2px; margin-top: -1px; background: var(--pcc-dash); }
  .pcc-net__side--left .pcc-net__item::after { right: -29px; }
  .pcc-net__side--right .pcc-net__item::after { left: -29px; }
  .pcc-net__side--left::after { right: 0; }
  .pcc-net__side--right::after { left: 0; }
  .pcc-net__core { flex-direction: column; justify-content: center; gap: 8px; width: 200px; height: 120px; padding: 16px 24px; border-radius: 28px; }
  .pcc-net__icon { width: 32px; height: 32px; }
  .pcc-net__core h3 { font-size: 1.15rem; }
}

/* Phones and tablets: hub on top, the areas hang off one vertical line. */
@media (max-width: 1023px) {
  .pcc-net__hub { justify-items: start; }
  .pcc-net__core { flex-direction: column; align-items: flex-start; gap: 8px; padding: 16px 24px; border-radius: 20px; text-align: left; }
  .pcc-net__side { padding: 14px 0 0 60px; }
  /* Each item draws the line from above it down to its centre, plus its branch. */
  .pcc-net__item::before { left: -25px; top: -15px; bottom: 0; width: 2px; background: var(--pcc-line); }
  .pcc-net__side:last-child .pcc-net__item:last-child::before { bottom: auto; height: calc(50% + 16px); }
  .pcc-net__item::after { left: -25px; top: 50%; width: 24px; height: 2px; margin-top: -1px; background: var(--pcc-dash); }
}
@media (max-width: 639px) {
  .pcc-net__item { min-height: 52px; padding: 8px 20px; font-size: .9375rem; }
  .pcc-net__side { gap: 12px; padding-top: 12px; padding-left: 34px; }
  .pcc-net__item::before, .pcc-net__item::after { left: -20px; }
  .pcc-net__item::after { width: 19px; }
  .pcc-net__item::before { top: -13px; }
  .pcc-net__side:last-child .pcc-net__item:last-child::before { height: calc(50% + 14px); }
}

/* 7. Mission points inside the Homecare-style card */
.pcc-mission { list-style: disc; padding-left: 1.1rem; display: grid; gap: 6px; }
.pcc-mission li { line-height: 1.6; }

/* The shared panels bring their own top padding; keep them close to their heading. */
.pcc .expanding-panels { padding-top: 16px; }

/* Phones: two cards per row so the eight emergencies stay compact. */
@media (max-width: 639px) {
  .pcc-tiles { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .pcc-tiles > div { min-height: 10.5rem; padding: 18px; border-radius: 24px; }
  .pcc-tiles img { width: 34px; margin-bottom: 1.5rem; }
  .pcc-tiles h3 { font-size: .875rem; line-height: 1.3; }
}

/* Phones: tighter line spacing in the page content (the shared banner keeps its own). */
@media (max-width: 639px) {
  .pcc-wrap p, .pcc-wrap li, .pcc .expanding-panels p, .pcc .leading-relaxed, .pcc .leading-relaxed p, .pcc-mission li { line-height: 1.5; }
  .pcc-about__text p + p, .pcc-research p + p { margin-top: 12px; }
}



/* ---- 8. Contact card ---- */
.pcc-opt-row { display: flex; align-items: flex-start; gap: 14px; }

.pcc-pin { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: rgba(3, 187, 185, .12); border: 1px solid rgba(3, 187, 185, .25); }
.pcc-bento__ic { flex: none; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; }

/* Orb: the tap-to-call circle */
.pcc-orb { position: relative; overflow: hidden; border-radius: 34px; }
.pcc-orb__text { position: relative; display: flex; flex-direction: column; gap: 18px; padding: 44px; }
.pcc-orb__circle { display: block; }
.pcc-orb__inner { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.pcc-orb__inner .pcc-bento__ic { margin-bottom: 12px; border: 2px solid rgba(255, 255, 255, .35); background-clip: padding-box; }
.pcc-orb__label { color: #fff; font-size: 1.15rem; font-weight: 600; }
@media (min-width: 1000px) {
  .pcc-orb { min-height: 400px; display: flex; align-items: center; }
  .pcc-orb__text { max-width: 54%; }
  .pcc-orb__circle { position: absolute; top: 50%; right: -110px; width: 560px; height: 560px; border-radius: 50%; transform: translateY(-50%); box-shadow: 0 0 0 28px rgba(3, 78, 163, .08), 0 0 0 56px rgba(3, 78, 163, .05); }
  .pcc-orb__inner { position: absolute; top: 50%; left: 110px; transform: translateY(-50%); }
}
/* Below 1000px: the same circle, rising from the bottom edge (clipped by the card). */
@media (max-width: 999px) {
  .pcc-orb__circle { position: relative; z-index: 0; margin-top: 32px; padding: 52px 24px 40px; background: transparent; }
  .pcc-orb__circle::before { content: ""; position: absolute; z-index: -1; top: 0; left: 50%; width: 300%; aspect-ratio: 1; border-radius: 50%; transform: translateX(-50%); background: var(--color-brand); box-shadow: 0 0 0 14px rgba(3, 78, 163, .08), 0 0 0 28px rgba(3, 78, 163, .05); }
  .pcc-orb__inner { align-items: center; text-align: center; }
}

@media (max-width: 639px) {
  .pcc-orb { border-radius: 28px; }
  .pcc-orb__text { padding: 28px 20px 8px; }
  .pcc-orb__circle { margin-top: 28px; padding: 48px 20px 36px; }
  /* Phones: a much wider circle, so only a gentle curve shows. */
  .pcc-orb__circle::before { width: 320%; box-shadow: 0 0 0 12px rgba(3, 78, 163, .08), 0 0 0 24px rgba(3, 78, 163, .05); }
  /* Phones: slightly smaller text (the "Contact Us" heading keeps its size). */
  .pcc-orb__text p { font-size: .875rem; line-height: 1.6; }
  .pcc-orb__label { font-size: .975rem; }
  .pcc-orb .pcc-phone { font-size: 1.2rem; }
}