/* Additions on top of the original stylesheet. Nothing here changes the original look;
   it replaces inline style="" attributes from the old templates, and adds accessibility, print and builder helpers. */

/* Spacing options (block style "spacing") and the original inline margins they replace */
.sp-top{margin-top:22px}.sp-bottom{margin-bottom:22px}.sp-none{margin-top:0;margin-bottom:0}
.sp-h3{margin-top:20px}
.quote+.content-grid{margin-top:22px}
/* exact margins carried over from the original templates' inline styles */
.mt-12{margin-top:12px!important}.mt-15{margin-top:15px!important}.mt-16{margin-top:16px!important}.mt-18{margin-top:18px!important}
.mt-20{margin-top:20px!important}.mt-22{margin-top:22px!important}.mb-20{margin-bottom:20px!important}.mb-23{margin-bottom:23px!important}

/* Block extras */
.panel.dark{background:var(--green);color:#f5f0dc;border-color:var(--green)}
.panel.dark .eyebrow{color:#e4c68e}
.divider-line{border:0;border-top:1px solid var(--line)}
.divider-sm{margin:12px 0}.divider-md{margin:24px 0}.divider-lg{margin:44px 0}
.divider-space{border:0}
.photo-section.is-carousel .photo-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:15px}
.photo-section.is-carousel .photo-card{flex:0 0 min(320px,80%);scroll-snap-align:start}
.work-card[hidden]{display:none}
.folder-image{display:block;width:100%;height:120px;object-fit:cover;border-radius:6px;margin-bottom:12px}
.brand-logo{width:47px;height:51px;object-fit:contain}
.preview-bar{background:#f5eddc;border:1px solid #ead9b9;color:#a17c3f;border-radius:6px;padding:8px 14px;margin-bottom:18px;font-size:11px}

/* Accessibility */
.skip-link{position:absolute;top:-60px;right:16px;z-index:100;background:var(--green);color:#fff;padding:8px 14px;border-radius:6px;font-size:12px}
.skip-link:focus{top:12px}
#content:focus{outline:none}
.folder-card:focus-visible,.media-card:focus-visible,.photo-card:focus-visible,.tag:focus-visible{outline:3px solid #b58b48;outline-offset:3px}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Print */
@media print{
  aside,header,#mobileMenu,dialog,.header-actions,.skip-link,.btnrow,.matrix-actions,#workFilters,.photo-zoom,.photo-hint{display:none!important}
  .shell{display:block}
  body{background:#fff;font-size:12px}
  .panel,.course,.work-card,.folder-card{break-inside:avoid;box-shadow:none}
  .hero{background:#fff!important;color:#000;border:1px solid #ccc}
  .hero h1,.hero p,.hero .eyebrow{color:#000!important}
  a[href^="http"]:after{content:" (" attr(href) ")";font-size:9px;color:#666}
  .matrix-scroll{overflow:visible}
}

/* ---- Phase 3 blocks: image, YouTube, PDF / Word / PowerPoint, rich text ---- */
.richtext{max-width:820px;margin:0 0 22px}
.richtext p,.richtext li{font-size:13px;line-height:2.1}
.richtext h2{font-family:var(--serif);font-size:26px;margin:18px 0 6px}
.richtext h3{font-size:16px;margin:16px 0 4px}
.richtext blockquote,.panel blockquote{margin:12px 0;padding:8px 16px;border-right:3px solid #b5955c;background:#f1f4eb;font-family:var(--serif)}
.richtext a,.panel p a{color:var(--green);text-decoration:underline;text-underline-offset:3px}
[dir=ltr]{text-align:left}

.img-block{margin:0 0 22px}
.img-block img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:8px}
.img-block.img-wide{max-width:900px}.img-block.img-contained{max-width:560px}
.img-block figcaption,.yt-block figcaption{font-size:10px;color:var(--muted);padding-top:7px}

.yt-block{margin:0 0 22px;max-width:900px}
.yt-frame{position:relative;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#0c2a22;border:1px solid #d9e1d3}
.yt-frame iframe,.yt-facade{position:absolute;inset:0;width:100%;height:100%;border:0}
.yt-facade{padding:0;background:#0c2a22;cursor:pointer}
.yt-facade img{width:100%;height:100%;object-fit:cover;opacity:.85;transition:opacity .2s}
.yt-facade:hover img{opacity:1}
.yt-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:68px;height:48px;border-radius:12px;background:#c4302b;color:#fff;display:grid;place-items:center;font-size:20px;box-shadow:0 8px 24px #0006}
.yt-block figcaption{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline}
.yt-block figcaption b{font-size:12px;color:var(--ink)}
.yt-block figcaption a{margin-inline-start:auto;color:var(--green)}

.doc-block{margin:0 0 22px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:18px}
.doc-title{font-size:15px;margin:0 0 12px}
.doc-foot{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:12px;font-size:11px;color:var(--muted)}
.doc-foot span{flex:1 1 200px}
.doc-tabs{display:flex;gap:6px;margin-bottom:10px}
.doc-tabs button{border:1px solid var(--line);background:#f5f7f0;border-radius:20px;padding:4px 14px;font-size:11px;color:#55665c}
.doc-tabs button[aria-selected=true]{background:var(--green);border-color:var(--green);color:#fff}
.doc-unavailable{font-size:12px;color:var(--muted);padding:20px;text-align:center;background:#f5f7f0;border-radius:6px}
.office-frame{display:block;width:100%;border:1px solid var(--line);border-radius:6px;background:#f5f7f0}
.pdf-viewer{border:1px solid var(--line);border-radius:6px;background:#eef1ea;overflow:hidden}
.pdf-toolbar{display:flex;align-items:center;gap:6px;padding:6px 10px;background:#fff;border-bottom:1px solid var(--line);font-size:11px;color:#55665c}
.pdf-toolbar button{border:1px solid var(--line);background:#f5f7f0;border-radius:5px;min-width:30px;height:28px;color:var(--ink)}
.pdf-toolbar .pdf-sep{flex:1}
.pdf-canvas{overflow:auto;display:flex;justify-content:center;padding:12px;outline-offset:-3px}
.pdf-canvas canvas{max-width:none;box-shadow:0 2px 10px #2c432520;background:#fff}
.pdf-loading{margin:auto;font-size:12px;color:var(--muted)}
.pdf-sm .pdf-canvas,.office-frame.pdf-sm{height:380px}.pdf-md .pdf-canvas,.office-frame.pdf-md{height:560px}.pdf-lg .pdf-canvas,.office-frame.pdf-lg{height:760px}
@media(max-width:760px){.pdf-md .pdf-canvas,.office-frame.pdf-md,.pdf-lg .pdf-canvas,.office-frame.pdf-lg{height:460px}}
@media print{.pdf-toolbar,.yt-play,.doc-tabs{display:none}}