/* PJ site polish — small, global. Layout/colors live in Elementor globals. */
:root{--pj-ink:#17243D;--pj-deep:#102A43;--pj-act:#2563EB;--pj-act-dark:#1D4ED8;--pj-coral:#F28C55;--pj-muted:#526079;--pj-line:#DCE3EB;--pj-canvas:#F7F8FA;--pj-pale:#EAF1FF}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}}
body{-webkit-font-smoothing:antialiased;overflow-x:clip}
::selection{background:#CFE0FF;color:var(--pj-ink)}

/* Visible focus everywhere, never removed */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--pj-act)!important;outline-offset:3px!important;border-radius:6px}
.pj-on-dark a:focus-visible,.pj-on-dark button:focus-visible{outline-color:#9CC0FF!important}

/* Text links inside body copy are underlined so they don't rely on color */
.elementor-widget-text-editor a,.elementor-widget-theme-post-content a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.pj-on-dark .elementor-widget-text-editor a{color:#BFD4FF}

/* Eyebrow label */
.pj-eyebrow .elementor-heading-title{letter-spacing:.12em;text-transform:uppercase}

/* Hero visual: holds portrait + decorative spheres */
.pj-hero-visual{position:relative}
.pj-hero-visual .elementor-widget-image img{border-radius:24px;box-shadow:0 30px 60px -38px rgba(16,42,67,.55)}
.pj-hero-visual .elementor-widget-shortcode{position:static}
@media (min-width:768px){.pj-hero-visual>.elementor-widget-shortcode,.pj-hero-visual .e-con-inner>.elementor-widget-shortcode{position:absolute;left:0;bottom:0;width:auto;margin:0;z-index:2;pointer-events:none}}

/* Learning-path motif: a quiet dashed line with nodes */
.pj-path-line{position:relative}
.pj-path-line::before{content:"";position:absolute;left:0;right:0;top:50%;border-top:2px dashed var(--pj-line);z-index:0}

/* Project / demo cards (addendum): lift 4px + cobalt edge; equal focus state */
.pj-card,.e-con.pj-card{position:relative;transition:transform 210ms ease,box-shadow 210ms ease,border-color 210ms ease!important}
.pj-card::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:3px;background:var(--pj-act);opacity:0;transition:opacity 210ms ease}
.pj-card:hover{transform:translateY(-4px);box-shadow:0 22px 40px -26px rgba(16,42,67,.5)}
.pj-card:hover::before,.pj-card:focus-within::before{opacity:1}
.pj-card:focus-within{border-color:var(--pj-act)!important;box-shadow:0 0 0 3px rgba(37,99,235,.35)}
.pj-card .elementor-button{white-space:normal}
@media (prefers-reduced-motion:reduce){.pj-card:hover{transform:none}}

/* Tag chips inside cards */
.pj-tags .elementor-heading-title{font-variant-caps:all-small-caps;letter-spacing:.06em}

/* Header */
.pj-header{backdrop-filter:saturate(140%) blur(6px)}
.pj-header .elementor-nav-menu--main .elementor-item{font-weight:600}
.pj-header .elementor-widget-theme-site-logo img{border-radius:10px}

/* Blog readability: flat background, comfortable measure */
.pj-article .elementor-widget-theme-post-content{font-size:1.075rem;line-height:1.75}
.pj-article .elementor-widget-theme-post-content p{margin-bottom:1.15em}
.pj-article .elementor-widget-theme-post-content h2,.pj-article .elementor-widget-theme-post-content h3{margin-top:1.6em}
.elementor-post__card{border:1px solid var(--pj-line)!important;border-radius:16px!important;transition:transform 210ms ease,box-shadow 210ms ease}
.elementor-post__card:hover{transform:translateY(-4px)}
.elementor-post__card:focus-within{box-shadow:0 0 0 3px rgba(37,99,235,.35)}

/* No comment UI anywhere (belt and braces with the plugin filters) */
#comments,.comments-area,.comment-respond,.elementor-widget-post-comments,.elementor-post__meta-data .elementor-post-comments,.post-info .comments,.elementor-post-info__item--type-comments{display:none!important}

/* Forms */
.elementor-form .elementor-field-group .elementor-field{min-height:48px}
.elementor-form .elementor-field-type-acceptance label{font-size:.92rem}

/* Defensive: no horizontal scroll */
.elementor-section,.e-con{max-width:100%}

/* Footer logo: faint ring so the navy mark separates from the deep-blue footer */
.pj-footer .elementor-widget-image img{box-shadow:0 0 0 1px rgba(201,214,232,.45)}
@media (max-width:767px){.pj-hero-visual{--align-items:center;align-items:center}}

/* Footer menus: links turn white on hover/focus (footer only) */
.pj-footer .elementor-widget-text-editor a{color:#C9D6E8;transition:color 180ms ease}
.pj-footer .elementor-widget-text-editor a:hover,.pj-footer .elementor-widget-text-editor a:focus-visible{color:#FFFFFF!important;text-decoration-color:#FFFFFF}

/* ---- Blog (Lori-style structure, Phelim palette) ---- */
.pj-post-cards .elementor-post__card{background:#fff;border:1px solid var(--pj-line)!important;border-radius:18px!important;overflow:hidden;box-shadow:none}
.pj-post-cards .elementor-post__card:hover{box-shadow:0 22px 40px -28px rgba(16,42,67,.45)}
.pj-post-cards .elementor-post__thumbnail__link{margin-bottom:22px!important}
.pj-post-cards .elementor-post__thumbnail img{object-fit:cover;width:100%;height:100%}
.pj-post-cards .elementor-post__badge{text-transform:uppercase;letter-spacing:.08em;font-weight:700;padding:.45em 1em!important}
.pj-post-cards .elementor-post__read-more{text-decoration:none}
.pj-post-cards .elementor-post__read-more:hover{text-decoration:underline;text-underline-offset:3px}
.pj-post-cards .elementor-post__meta-data{border-top-color:var(--pj-line)!important}
.pj-post-eyebrow .elementor-icon-list-text,.pj-post-eyebrow a{text-transform:uppercase;letter-spacing:.1em;color:var(--pj-act-dark)!important;text-decoration:none}
.pj-post-cover img{width:100%;max-width:960px;box-shadow:0 26px 50px -40px rgba(16,42,67,.55)}
.pj-read{max-width:720px;margin:0 auto}
.pj-callout{background:var(--pj-pale);border-left:4px solid var(--pj-act);border-radius:8px;padding:14px 18px}
.pj-callout p{margin:0}
.pj-callout a{font-weight:700;color:var(--pj-act-dark)!important}
.pj-post-nav{border-top:1px solid var(--pj-line);padding-top:18px}
.pj-meet .elementor-button{min-width:220px}
@media (max-width:767px){.pj-meet .elementor-button{min-width:0}}
