@import 'tailwindcss';

:root { --ink:#303234; --muted:#676a6b; --paper:#fffdfa; --soft:#f8f5ee; --line:#dedbd3; --red:#f04438; --orange:#ffad00; --green:#7fbe22; --blue:#68c4de; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
html,body { margin:0; min-height:100%; }
body { color:var(--ink); background:var(--paper); font-family:var(--font-sans),Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
button,a { font:inherit; }
.institutional-header { height:88px; padding:0 clamp(24px,5vw,76px); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; border-bottom:1px solid var(--line); background:rgba(255,253,250,.96); position:sticky; top:0; z-index:30; backdrop-filter:blur(12px); }
.institutional-brand { display:flex; align-items:center; gap:12px; min-width:260px; }
.institutional-brand img { width:54px; height:54px; border-radius:50%; object-fit:cover; mix-blend-mode:multiply; }
.institutional-brand>span { font-size:14px; line-height:1.05; }
.institutional-brand strong { font-family:var(--font-display),Georgia,serif; font-size:20px; font-weight:500; letter-spacing:-.03em; }
.institutional-brand b { color:var(--red); font-size:10px; margin-left:6px; font-family:var(--font-sans),Arial,sans-serif; }
.institutional-brand small { display:block; color:var(--muted); text-transform:uppercase; letter-spacing:.11em; font-size:7px; margin-top:5px; }
.institutional-header nav { display:flex; gap:30px; font-size:12px; }
.institutional-header nav a { padding:8px 0; position:relative; }
.institutional-header nav a:after { content:''; position:absolute; height:2px; background:var(--red); left:0; right:100%; bottom:0; transition:right .2s; }
.institutional-header nav a:hover:after { right:0; }
.header-contact { justify-self:end; display:flex; align-items:center; gap:8px; padding:11px 17px; background:var(--ink); color:white; border-radius:8px; font-size:12px; }
.nav-menu { display:none; border:0; background:transparent; }
.section-kicker { color:var(--red); text-transform:uppercase; letter-spacing:.16em; font-size:10px; font-weight:800; margin:0 0 22px; }

.institutional-hero { min-height:700px; display:grid; grid-template-columns:1fr; overflow:hidden; }
.hero-content { padding:clamp(72px,9vw,130px) clamp(28px,8vw,125px); align-self:center; }
.hero-content h1 { font-family:var(--font-display),Georgia,serif; font-size:clamp(64px,7.2vw,112px); line-height:.86; letter-spacing:-.062em; font-weight:430; margin:0; }
.hero-content h1 em { color:var(--red); font-weight:350; }
.hero-content>p:not(.section-kicker) { max-width:650px; font-size:19px; line-height:1.65; color:var(--muted); margin:40px 0 32px; }
.hero-buttons { display:flex; gap:12px; flex-wrap:wrap; }
.primary-button,.secondary-button { display:inline-flex; align-items:center; gap:10px; padding:14px 19px; border-radius:8px; font-size:12px; font-weight:700; }
.primary-button { background:var(--red); color:white; }
.secondary-button { border:1px solid var(--line); background:white; }
.hero-visual { position:relative; background:var(--soft); display:flex; align-items:center; justify-content:center; min-height:680px; border-top:1px solid var(--line); }
.hero-visual:before { content:''; position:absolute; inset:8%; border:1px solid var(--line); border-radius:50%; }
.logo-circle { width:min(32vw,490px); height:min(32vw,490px); background:white; border-radius:50%; display:grid; place-items:center; overflow:hidden; box-shadow:0 20px 60px rgba(48,50,52,.09); position:relative; z-index:2; }
.logo-circle img { width:112%; mix-blend-mode:multiply; }
.value-pill { position:absolute; padding:10px 15px; background:white; border:1px solid var(--line); border-radius:100px; font-size:11px; font-weight:700; z-index:3; box-shadow:0 8px 20px rgba(48,50,52,.08); }
.value-one { top:22%; left:10%; color:#589400; }
.value-two { top:17%; right:12%; color:#d83a30; }
.value-three { right:7%; bottom:26%; color:#208aa8; }
.hero-note { position:absolute; left:8%; bottom:8%; background:var(--ink); color:white; padding:20px 24px; border-radius:10px; z-index:4; max-width:330px; }
.hero-note strong,.hero-note span { display:block; }
.hero-note strong { color:var(--orange); font-family:var(--font-display),Georgia,serif; font-size:19px; }
.hero-note span { font-size:11px; opacity:.75; margin-top:6px; }

.quick-links { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.quick-links a { min-height:112px; padding:25px clamp(18px,3vw,45px); display:grid; grid-template-columns:auto 1fr auto; gap:16px; align-items:center; border-right:1px solid var(--line); transition:background .2s; }
.quick-links a:hover { background:var(--soft); }
.quick-links a:last-child { border-right:0; }
.quick-links span { font-size:10px; color:var(--red); font-weight:700; }
.quick-links strong { font-family:var(--font-display),Georgia,serif; font-size:19px; font-weight:500; }
.quick-links svg { width:18px; }

.mission-section { padding:120px clamp(28px,7vw,110px); display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,100px); }
.section-heading h2,.projects-intro h2,.audience-card h2,.team-heading h2,.contact-section h2 { font-family:var(--font-display),Georgia,serif; font-weight:450; letter-spacing:-.045em; }
.section-heading h2 { font-size:clamp(47px,5vw,76px); line-height:.97; margin:0; }
.mission-copy { padding-top:38px; }
.mission-copy p { color:var(--muted); line-height:1.72; }
.mission-copy .large-copy { color:var(--ink); font-family:var(--font-display),Georgia,serif; font-size:25px; line-height:1.4; margin-top:0; }
.mission-copy a,.audience-card a { display:inline-flex; align-items:center; gap:8px; margin-top:20px; color:var(--red); font-size:12px; font-weight:700; }
.mission-values { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); border-left:0; }
.mission-values article { padding:20px 0 25px 30px; border-bottom:1px solid var(--line); }
.mission-values article:first-child { padding-top:0; }
.mission-values strong { display:block; margin:10px 0 5px; }
.mission-values p { color:var(--muted); font-size:13px; line-height:1.55; margin:0; }
.dot { display:block; width:10px; height:10px; border-radius:50%; }
.dot.red { background:var(--red); }.dot.orange { background:var(--orange); }.dot.green { background:var(--green); }

.projects-section { background:var(--soft); padding:120px clamp(28px,7vw,110px); }
.labs-section { background:var(--paper); padding:120px clamp(28px,7vw,110px); }
.projects-intro { display:grid; grid-template-columns:1fr; gap:25px; align-items:end; margin:0 auto 55px; max-width:1180px; }
.projects-intro h2 { font-size:clamp(48px,5.8vw,84px); line-height:.92; margin:0; max-width:850px; }
.projects-intro>p { color:var(--muted); line-height:1.7; margin:0 0 6px; }
.projects-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; max-width:1180px; margin:0 auto; }
.project-card { background:white; min-height:390px; padding:36px; border:1px solid var(--line); display:flex; flex-direction:column; transition:transform .2s,box-shadow .2s; }
.project-card:hover { transform:translateY(-4px); box-shadow:0 15px 35px rgba(48,50,52,.08); }
.project-card.green { border-top:4px solid var(--green); }.project-card.blue { border-top:4px solid var(--blue); }.project-card.orange { border-top:4px solid var(--orange); }.project-card.red { border-top:4px solid var(--red); }
.project-top { display:flex; justify-content:space-between; color:var(--muted); font-size:11px; }
.project-top svg { width:24px; height:24px; }
.project-card h3 { font-family:var(--font-display),Georgia,serif; font-size:32px; line-height:1.05; font-weight:500; margin:40px 0 18px; }
.project-card p { color:var(--muted); font-size:14px; line-height:1.65; margin:0; }
.project-card .card-link { margin-top:auto; display:flex; align-items:center; gap:8px; font-size:11px; font-weight:700; }
.photo-note { padding:90px clamp(28px,7vw,110px); display:grid; grid-template-columns:1fr 1fr; gap:80px; border-top:1px solid var(--line); }
.photo-note h2 { font-family:var(--font-display),Georgia,serif; font-size:clamp(42px,5vw,72px); line-height:.95; font-weight:450; margin:0; }
.photo-note>p { color:var(--muted); line-height:1.75; align-self:end; max-width:650px; }

.detail-hero { padding:90px clamp(28px,9vw,150px) 110px; min-height:510px; display:flex; flex-direction:column; justify-content:flex-end; }
.detail-hero.red{background:#fff0ed}.detail-hero.orange{background:#fff3d5}.detail-hero.green{background:#edf6df}.detail-hero.blue{background:#e5f5f8}
.detail-hero { position:relative; isolation:isolate; overflow:hidden; }
.detail-hero.red:after { content:''; position:absolute; right:7%; top:50%; width:min(32vw,430px); aspect-ratio:1; transform:translateY(-45%); border-radius:50%; background:rgba(255,255,255,.72) url('/logo-originale.webp') center/112% no-repeat; box-shadow:0 24px 70px rgba(48,50,52,.08); z-index:-1; }
.detail-hero.red h1,.detail-hero.red>p { max-width:62%; }
.detail-hero h1 { font-family:var(--font-display),Georgia,serif; font-size:clamp(70px,11vw,160px); line-height:.84; font-weight:450; letter-spacing:-.065em; margin:12px 0 30px; max-width:1200px; }
.detail-hero>p:last-child { font-size:clamp(18px,2vw,26px); line-height:1.45; max-width:760px; margin:0; }
.back-link { margin-bottom:auto; font-size:12px; font-weight:700; }
.detail-body { padding:100px clamp(28px,9vw,150px); display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; }
.detail-copy .large-copy { font-family:var(--font-display),Georgia,serif; font-size:clamp(26px,3vw,40px); line-height:1.35; margin:0 0 35px; }
.detail-columns { display:grid; grid-template-columns:1fr 1fr; gap:50px; }
.detail-columns article { border-top:3px solid var(--red); padding-top:18px; }
.detail-columns span { color:var(--muted); font-size:10px; }.detail-columns h2 { font-family:var(--font-display),Georgia,serif; font-size:31px; font-weight:500; }
.detail-columns ul { list-style:none; padding:0; }.detail-columns li { padding:12px 0; border-bottom:1px solid var(--line); font-size:13px; }
.detail-photos { background:var(--soft); padding:100px clamp(28px,7vw,110px); display:grid; grid-template-columns:1fr 1fr 1fr; gap:24px; align-items:stretch; }
.detail-photos h2 { font-family:var(--font-display),Georgia,serif; font-size:50px; line-height:.95; font-weight:450; margin:0 0 20px; }.detail-photos p { color:var(--muted); line-height:1.6; }
.photo-placeholder { min-height:340px; border:1px dashed #b9b4a9; background:#ebe7de; display:flex; flex-direction:column; justify-content:flex-end; padding:25px; }
.photo-placeholder span { margin-bottom:auto; font-size:10px; }.photo-placeholder strong { font-family:var(--font-display),Georgia,serif; font-size:25px; }.photo-placeholder small { color:var(--muted); margin-top:5px; }
.detail-cta { padding:90px 28px; text-align:center; }.detail-cta h2 { font-family:var(--font-display),Georgia,serif; font-size:70px; font-weight:450; margin:0 0 30px; }.detail-cta .primary-button { display:inline-flex; }
.detail-actions { display:flex; gap:10px; flex-wrap:wrap; }
.loading-detail main,.loading-detail>header,.loading-detail>footer { visibility:hidden; }

.audience-section { padding:120px clamp(28px,7vw,110px); display:grid; grid-template-columns:1fr; gap:24px; }
.audience-section>* { width:100%; max-width:1180px; margin-inline:auto; }
.audience-card { background:var(--blue); padding:clamp(45px,6vw,85px); border-radius:18px; }
.audience-card .section-kicker { color:#175f73; }
.audience-card h2 { font-size:clamp(48px,5.6vw,82px); line-height:.92; margin:0 0 30px; max-width:800px; }
.audience-card>p { max-width:720px; line-height:1.7; }
.audience-card a { color:var(--ink); }
.spaces-card { background:var(--ink); color:white; padding:50px 42px; border-radius:18px; }
.spaces-icon { width:54px; height:54px; display:grid; place-items:center; border-radius:50%; background:var(--red); }
.spaces-card h3 { font-family:var(--font-display),Georgia,serif; font-size:36px; font-weight:500; margin:35px 0 14px; }
.spaces-card>p { opacity:.75; line-height:1.6; }
.spaces-card ul { list-style:none; padding:20px 0 0; margin:20px 0 0; border-top:1px solid rgba(255,255,255,.18); }
.spaces-card li { padding:7px 0; font-size:13px; }
.spaces-card li:before { content:'•'; color:var(--orange); margin-right:10px; }

.team-section { padding:120px clamp(28px,7vw,110px); display:grid; grid-template-columns:.85fr 1.15fr; gap:90px; background:#fff; }
.team-heading h2 { font-size:clamp(48px,5vw,75px); line-height:.96; margin:0 0 30px; }
.team-heading>p:last-child { color:var(--muted); line-height:1.7; max-width:500px; }
.team-list article { display:grid; grid-template-columns:70px 1fr; align-items:center; gap:25px; padding:25px 0; border-bottom:1px solid var(--line); }
.team-list article>span { width:70px; height:70px; border-radius:50%; display:grid; place-items:center; background:var(--soft); font-family:var(--font-display),Georgia,serif; font-size:20px; }
.team-list article:nth-child(1)>span { background:#dff1d0; }.team-list article:nth-child(2)>span { background:#d9f2f7; }.team-list article:nth-child(3)>span { background:#ffe5bf; }
.team-list h3 { margin:0 0 7px; font-size:17px; }
.team-list p { margin:0; color:var(--muted); font-size:13px; }

.contact-section { padding:110px clamp(28px,7vw,110px); background:var(--red); color:white; display:grid; grid-template-columns:1fr 1fr; gap:80px; }
.contact-section .section-kicker { color:#fff3aa; }
.contact-section h2 { font-size:clamp(52px,6vw,88px); line-height:.9; margin:0 0 30px; }
.contact-section>div:first-child>p:last-child { max-width:530px; opacity:.85; line-height:1.7; }
.contact-details { border-top:1px solid rgba(255,255,255,.35); }
.contact-details a { display:grid; grid-template-columns:48px 1fr; gap:18px; align-items:center; padding:19px 0; border-bottom:1px solid rgba(255,255,255,.35); }
.contact-details a>span { width:46px; height:46px; border:1px solid rgba(255,255,255,.5); border-radius:50%; display:grid; place-items:center; }
.contact-details svg { width:19px; }
.contact-details small,.contact-details strong { display:block; }
.contact-details small { font-size:9px; text-transform:uppercase; letter-spacing:.16em; opacity:.7; margin-bottom:5px; }
.contact-details strong { font-size:14px; overflow-wrap:anywhere; }

.site-footer { padding:55px clamp(28px,7vw,110px) 25px; display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:45px; align-items:start; background:var(--paper); }
.footer-brand { display:flex; gap:15px; align-items:center; }
.footer-brand img { width:60px; height:60px; object-fit:cover; border-radius:50%; mix-blend-mode:multiply; }
.footer-brand strong,.footer-brand span { display:block; }
.footer-brand span { color:var(--muted); font-size:11px; margin-top:4px; }
.footer-links,.footer-docs { display:grid; gap:10px; font-size:12px; }
.footer-docs a { display:flex; gap:7px; align-items:center; }
.site-footer>p { grid-column:1/-1; border-top:1px solid var(--line); padding-top:20px; color:var(--muted); font-size:10px; }

@media (max-width:1000px) {
  .institutional-header { grid-template-columns:1fr auto; }
  .institutional-header nav,.header-contact { display:none; }.nav-menu { display:block; }
  .institutional-hero { grid-template-columns:1fr; }
  .hero-visual { min-height:650px; }
  .logo-circle { width:450px; height:450px; }
  .quick-links { grid-template-columns:1fr 1fr; }
  .quick-links a:nth-child(2) { border-right:0; }.quick-links a:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .mission-section { grid-template-columns:1fr; }.mission-values { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); border-left:0; }.mission-values article { border-top:1px solid var(--line); border-bottom:0; }
  .projects-grid { grid-template-columns:1fr 1fr; }
  .audience-section { grid-template-columns:1fr; }
  .team-section { grid-template-columns:1fr; }
}
@media (max-width:650px) {
  .institutional-header { height:76px; padding:0 16px; }.institutional-brand img { width:46px; height:46px; }.institutional-brand small { display:none; }
  .hero-content { padding:70px 22px; }.hero-content h1 { font-size:64px; }.hero-content>p:not(.section-kicker) { font-size:16px; }
  .hero-visual { min-height:500px; }.logo-circle { width:330px; height:330px; }.value-one { left:4%; }.value-two { right:4%; }.hero-note { left:18px; right:18px; bottom:20px; }
  .quick-links { grid-template-columns:1fr; }.quick-links a { border-right:0; border-bottom:1px solid var(--line); }
  .mission-section,.projects-section,.labs-section,.audience-section,.team-section,.contact-section { padding:85px 22px; }
  .mission-section,.projects-intro,.contact-section { grid-template-columns:1fr; }.mission-copy { padding-top:0; }.mission-values { grid-template-columns:1fr; }.mission-values article { padding-left:0; }
  .projects-intro { gap:25px; }.projects-grid { grid-template-columns:1fr; }
  .audience-card,.spaces-card { padding:40px 26px; }
  .team-section { gap:35px; }.team-list article { grid-template-columns:58px 1fr; }.team-list article>span { width:58px; height:58px; }
  .contact-section { gap:35px; }
  .site-footer { grid-template-columns:1fr; padding-left:22px; padding-right:22px; }
  .photo-note,.detail-body,.detail-photos { grid-template-columns:1fr; padding:70px 22px; gap:35px; }
  .detail-hero { padding:65px 22px 80px; min-height:430px; }.detail-hero h1 { font-size:70px; }
  .detail-hero.red:after { opacity:.24; width:320px; right:-90px; }.detail-hero.red h1,.detail-hero.red>p { max-width:100%; }
  .detail-columns { grid-template-columns:1fr; }.detail-cta h2 { font-size:54px; }
}

/* General photo story */
.moments-section { padding:110px clamp(28px,6vw,90px) 150px; background:#f5f1e8; overflow:hidden; scroll-margin-top:88px; }
.moments-heading { max-width:1240px; margin:0 auto 70px; display:grid; grid-template-columns:1.15fr .85fr; gap:80px; align-items:end; }
.moments-heading h2 { font-family:var(--font-display),Georgia,serif; font-size:clamp(55px,6vw,88px); line-height:.92; letter-spacing:-.05em; font-weight:450; margin:0; }
.moments-heading>p { color:var(--muted); line-height:1.75; max-width:560px; }
.moments-board { max-width:1240px; margin:0 auto; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:58px 34px; position:relative; isolation:isolate; padding:35px 25px 45px; }
.gallery-doodles { position:absolute; inset:-45px -60px; background:url('/doodles-polaroid.png') center/100% 100% no-repeat; z-index:-1; pointer-events:none; }
.home-polaroid { margin:0; background:#fff; padding:14px 14px 20px; box-shadow:0 18px 38px rgba(48,50,52,.15); transition:transform .25s,box-shadow .25s; }
.home-polaroid:hover { transform:rotate(0) translateY(-7px); box-shadow:0 25px 45px rgba(48,50,52,.2); z-index:3; }
.home-polaroid img { display:block; width:100%; height:330px; object-fit:cover; }
.home-polaroid figcaption { font-family:var(--font-display),Georgia,serif; font-size:20px; margin:15px 6px 0; }
.home-polaroid.r-left { transform:rotate(-2.5deg); }.home-polaroid.r-right { transform:rotate(2.5deg); }.home-polaroid.r-soft { transform:rotate(-.7deg); }
@media (max-width:1000px) { .moments-heading { grid-template-columns:1fr; gap:24px; }.moments-board { grid-template-columns:repeat(2,1fr); }.home-polaroid img { height:360px; } }
@media (max-width:650px) { .moments-section { padding:80px 18px 110px; }.moments-board { grid-template-columns:1fr; gap:38px; padding-inline:10px; }.gallery-doodles { inset:-30px -90px; background-size:auto 100%; }.home-polaroid { max-width:380px; width:92%; margin-inline:auto; }.home-polaroid img { height:390px; }.moments-heading { padding-inline:4px; } }

/* Paper album */
.album { max-width:1180px; margin:0 auto; border-radius:18px; background:#c7a77c; padding:22px; box-shadow:0 30px 70px rgba(48,50,52,.22); position:relative; }
.album:before,.album:after { content:''; position:absolute; top:38px; bottom:38px; width:9px; border-radius:50%; background:rgba(74,52,32,.32); filter:blur(4px); left:50%; transform:translateX(-50%); z-index:5; }
.album:after { width:2px; background:rgba(255,255,255,.7); filter:none; }
.album-spread { display:none; grid-template-columns:1fr 1fr; min-height:720px; perspective:1600px; }
.album-spread.active { display:grid; animation:albumOpen .45s ease both; }
@keyframes albumOpen { from{opacity:.35;transform:rotateY(-3deg) translateX(12px)} to{opacity:1;transform:none} }
.album-page { position:relative; padding:54px 48px; background:#fffdf5; display:flex; align-items:center; justify-content:center; overflow:hidden; box-shadow:inset 0 0 35px rgba(94,68,38,.08); }
.album-page:before { content:''; position:absolute; width:145px; height:145px; background-image:url('/doodle-stickers.png'); background-size:300% 200%; background-repeat:no-repeat; opacity:1; pointer-events:none; z-index:3; filter:drop-shadow(0 7px 7px rgba(48,50,52,.18)); }
.album-spread:nth-child(1) .left-page:before { background-position:0 0; right:22px; top:20px; transform:rotate(8deg); }
.album-spread:nth-child(1) .right-page:before { background-position:0 100%; left:24px; bottom:22px; transform:rotate(-5deg); }
.album-spread:nth-child(2) .left-page:before { background-position:50% 0; left:20px; bottom:18px; transform:rotate(-9deg); }
.album-spread:nth-child(2) .right-page:before { background-position:100% 100%; right:22px; top:18px; transform:rotate(7deg); }
.album-spread:nth-child(3) .left-page:before { background-position:50% 100%; right:20px; bottom:18px; transform:rotate(5deg); }
.album-spread:nth-child(3) .right-page:before { background-position:100% 0; left:20px; top:20px; transform:rotate(-8deg); }
.left-page { border-radius:10px 2px 2px 10px; transform-origin:right center; }.right-page { border-radius:2px 10px 10px 2px; transform-origin:left center; }
.album-page.two-photos { display:grid; grid-template-columns:1fr 1fr; gap:22px; align-items:center; }
.album-polaroid { width:min(100%,390px); margin:0; padding:13px 13px 20px; background:white; box-shadow:0 16px 30px rgba(48,50,52,.18); position:relative; z-index:2; }
.album-polaroid img { width:100%; height:430px; object-fit:cover; display:block; }
.two-photos .album-polaroid img { height:295px; }
.album-polaroid figcaption { font-family:var(--font-display),Georgia,serif; font-size:19px; margin:14px 5px 0; }
.tilt-left { transform:rotate(-3deg); }.tilt-right { transform:rotate(3deg); }.tilt-soft { transform:rotate(-1deg); }
.page-doodle { display:none; }
.album-controls { max-width:1180px; margin:28px auto 0; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; }
.album-controls button { border:1px solid #a49c8d; background:white; border-radius:100px; padding:13px 20px; cursor:pointer; font-size:12px; font-weight:700; }.album-controls button:last-child { justify-self:end; }.album-controls button:disabled { opacity:.32; cursor:default; }.album-controls p { margin:0 24px; font-size:12px; font-weight:700; }
@media (max-width:1000px) { .album-spread { min-height:610px; }.album-page { padding:38px 25px; }.album-page.two-photos { grid-template-columns:1fr; gap:12px; }.album-polaroid img { height:340px; }.two-photos .album-polaroid { max-width:240px; }.two-photos .album-polaroid img { height:190px; }.album-polaroid figcaption { font-size:16px; } }
@media (max-width:650px) { .album { padding:12px; border-radius:14px; }.album:before,.album:after { display:none; }.album-spread.active { display:flex; flex-direction:column; }.album-page { min-height:480px; border-radius:8px!important; padding:32px 20px; }.album-page:before { width:105px; height:105px; }.album-page+ .album-page { border-top:1px solid #ddd4c3; }.album-page.two-photos { min-height:620px; grid-template-columns:1fr; }.album-polaroid { max-width:300px; }.album-polaroid img { height:330px; }.two-photos .album-polaroid { max-width:250px; }.two-photos .album-polaroid img { height:205px; }.album-controls button span { display:none; } }

/* Calm, structured home */
.institutional-hero { grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr); min-height:650px; max-width:1440px; margin:0 auto; }
.hero-content { padding:clamp(70px,7vw,110px) clamp(28px,6vw,90px); }
.hero-content h1 { font-size:clamp(62px,6.5vw,96px); }
.hero-visual { min-height:650px; border-top:0; border-left:1px solid var(--line); }
.logo-circle { width:min(30vw,410px); height:min(30vw,410px); }
.quick-links { max-width:1440px; margin:0 auto; grid-template-columns:repeat(4,1fr); }
.quick-links a { min-height:92px; padding-block:20px; }
.mission-section,.projects-section,.labs-section,.audience-section,.photo-note,.contact-section { scroll-margin-top:88px; }
.mission-section { max-width:1320px; margin:0 auto; grid-template-columns:.9fr 1.1fr; padding-block:100px; }
.mission-values { grid-column:1/-1; border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.mission-values article { padding:28px!important; border-bottom:0; border-right:1px solid var(--line); }
.mission-values article:last-child { border-right:0; }
.projects-section,.labs-section { padding-block:105px; }
.projects-intro h2 { max-width:900px; }
.project-card { border-radius:14px; min-height:330px; padding:34px; }
.audience-section { padding-block:105px; }
.spaces-card { min-height:420px; }
.photo-note { max-width:1320px; margin:0 auto; padding-block:90px; }

/* Project sheets */
.detail-title { min-height:560px; padding:70px clamp(28px,8vw,125px); position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; }
.detail-title.red{background:#fff0ed}.detail-title.orange{background:#fff3d5}.detail-title.green{background:#edf6df}.detail-title.blue{background:#e5f5f8}
.detail-title>div { position:relative; z-index:2; max-width:920px; }
.detail-title h1 { font-family:var(--font-display),Georgia,serif; font-size:clamp(72px,10vw,145px); line-height:.86; letter-spacing:-.065em; font-weight:450; margin:10px 0 28px; }
.detail-title>div>p:last-child { font-size:clamp(18px,2vw,25px); line-height:1.5; max-width:720px; margin:0; }
.project-story { padding:110px clamp(28px,8vw,125px); display:grid; grid-template-columns:.32fr 1fr; gap:70px; max-width:1440px; margin:0 auto; }
.story-label { display:flex; gap:18px; align-items:flex-start; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.14em; }
.story-label p { margin:0; }.story-label span { color:var(--red); font-weight:700; }
.project-story h2 { font-family:var(--font-display),Georgia,serif; font-size:clamp(45px,5.5vw,78px); line-height:.96; letter-spacing:-.045em; font-weight:450; margin:0 0 38px; }
.project-story>div:last-child>p { max-width:850px; font-size:20px; color:var(--muted); line-height:1.8; margin-bottom:32px; }
.project-facts { padding:0 clamp(28px,8vw,125px) 110px; display:grid; grid-template-columns:1fr 1fr; gap:22px; max-width:1440px; margin:0 auto; }
.project-facts article { border-radius:18px; padding:44px; min-height:420px; }
.goals-card { background:#ffddd8; }.activities-card { background:#def0c4; }
.fact-heading { display:flex; justify-content:space-between; align-items:flex-start; border-bottom:1px solid rgba(48,50,52,.22); padding-bottom:25px; }
.fact-heading>span { font-size:10px; font-weight:700; }.fact-heading h2 { font-family:var(--font-display),Georgia,serif; font-size:48px; font-weight:450; margin:0; }
.project-facts ul { list-style:none; margin:22px 0 0; padding:0; }
.project-facts li { display:grid; grid-template-columns:45px 1fr; align-items:center; padding:18px 0; border-bottom:1px solid rgba(48,50,52,.18); }
.project-facts li span { font-size:10px; opacity:.6; }.project-facts li strong { font-size:17px; font-weight:600; }
.polaroid-section { background:#f5f1e8; padding:110px clamp(28px,6vw,90px) 150px; display:grid; grid-template-columns:.7fr 1.3fr; gap:70px; overflow:hidden; }
.polaroid-intro { padding-top:60px; max-width:480px; }.polaroid-intro h2 { font-family:var(--font-display),Georgia,serif; font-size:clamp(48px,5vw,74px); line-height:.95; font-weight:450; margin:0 0 25px; }.polaroid-intro>p:last-child { color:var(--muted); line-height:1.7; }
.polaroid-wall { min-height:620px; position:relative; isolation:isolate; }
.polaroid-wall:before { content:''; position:absolute; inset:-45px -35px -55px; background:url('/doodles-polaroid.png') center/100% 100% no-repeat; z-index:0; pointer-events:none; }
.polaroid { width:310px; background:white; padding:14px 14px 22px; box-shadow:0 18px 40px rgba(48,50,52,.16); position:absolute; margin:0; z-index:2; }
.photo-slot { aspect-ratio:4/3; background:#e1ddd3; display:grid; place-items:center; color:#858078; font-size:11px; text-transform:uppercase; letter-spacing:.12em; }
.polaroid figcaption { font-family:var(--font-display),Georgia,serif; font-size:20px; margin:16px 6px 0; }
.p-one { left:2%; top:15%; transform:rotate(-6deg); }.p-two { right:4%; top:0; transform:rotate(5deg); }.p-three { left:35%; bottom:0; transform:rotate(2deg); }
.doodle-line { position:absolute; left:18%; right:16%; top:49%; height:150px; border:3px dashed var(--red); border-color:var(--red) transparent transparent var(--red); border-radius:50%; transform:rotate(8deg); opacity:.35; z-index:1; }
.polaroid-section+.site-footer { border-top:0; }

@media (max-width:1000px) {
  .institutional-hero { grid-template-columns:1fr; }.hero-visual { min-height:540px; border-left:0; border-top:1px solid var(--line); }.logo-circle { width:390px; height:390px; }
  .quick-links { grid-template-columns:1fr 1fr; }.mission-section { grid-template-columns:1fr; }.mission-values { grid-template-columns:1fr; }.mission-values article { border-right:0; border-bottom:1px solid var(--line); }
  .project-story { grid-template-columns:1fr; gap:28px; }.project-facts { grid-template-columns:1fr; }.polaroid-section { grid-template-columns:1fr; }.polaroid-intro { padding-top:0; }.polaroid-wall { min-height:700px; max-width:700px; width:100%; margin:auto; }
}
@media (max-width:650px) {
  .institutional-hero { min-height:0; }.hero-visual { min-height:440px; }.logo-circle { width:310px; height:310px; }
  .quick-links { grid-template-columns:1fr; }.mission-values { grid-template-columns:1fr; }.project-card { min-height:300px; padding:28px; }
  .detail-title { min-height:460px; padding:55px 22px; }.detail-title h1 { font-size:68px; }
  .project-story,.project-facts { padding-left:22px; padding-right:22px; }.project-story { padding-block:75px; }.project-story>div:last-child>p { font-size:17px; }.project-facts article { padding:28px; min-height:0; }.fact-heading h2 { font-size:39px; }
  .polaroid-section { padding:80px 22px 120px; }.polaroid-wall { min-height:820px; }.polaroid-wall:before { inset:-25px -80px; background-size:auto 100%; }.polaroid { width:min(78vw,300px); }.p-one { left:0; }.p-two { right:0; top:260px; }.p-three { left:5%; bottom:0; }.doodle-line { top:35%; height:350px; }
}
