/* ARTICLE TEMPLATE — shared styles for sections 01 and 02. */
:root{--ink:#111;--accent:#514b44;--gap:3px;font-family:Montserrat,Arial,sans-serif}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:#fff}a{color:inherit;text-decoration:none}img{display:block;width:100%;height:100%;object-fit:cover}.home-hero{min-height:72vh;padding:12vh 6vw;background:#f6f8f6}.home-hero>p:first-child{font-size:11px;letter-spacing:.13em;font-weight:600}.home-hero h1{font-size:clamp(42px,7vw,112px);line-height:.98;font-weight:400;letter-spacing:-.065em}.home-hero>p:last-child{max-width:570px;line-height:1.7}.portfolio-section{padding:95px 0 75px}.section-head{padding:0 6vw 60px;display:grid;grid-template-columns:130px 1fr}.section-number{font-size:10px;letter-spacing:.09em;font-weight:600}.section-head h2{font-size:clamp(48px,7vw,100px);line-height:.95;letter-spacing:-.055em;font-weight:500;margin:0}.section-head em{color:var(--accent);font-style:normal}.cover-track{display:flex;gap:3px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 6vw 15px}.cover{flex:0 0 min(360px,78vw);scroll-snap-align:start;background:#fff;border:3px solid #111;display:flex;flex-direction:column}.cover img{height:260px}.cover-caption{padding:19px;min-height:85px;font-size:13px;line-height:1.45}.cover-caption strong{font-weight:600}#experience{background:#f5f7f5}footer{padding:50px 6vw;font-size:10px;letter-spacing:.1em}/* ARTICLE HEADER — independent of gallery and homepage styles. */
.article-header{position:sticky;top:0;z-index:20;height:84px;display:flex;align-items:stretch;justify-content:space-between;padding:0 0 0 32px;background:#fff;border-bottom:1px solid #e5e5e5}
.brand{display:flex;flex-direction:column;justify-content:center;gap:6px;min-width:0;text-align:left;line-height:1.1}
.brand strong{font-size:20px;font-weight:700;letter-spacing:-.02em}
.brand small{font-size:8px;font-weight:600;letter-spacing:.13em}
.article-header nav{display:flex;align-items:stretch;margin-left:auto;font-size:11px}
.article-header nav a,.article-header nav .article-position{display:flex;align-items:center;justify-content:center;height:84px;border-left:1px solid #e5e5e5;white-space:nowrap}
.article-header nav .article-prev,.article-header nav .article-next{width:62px;font-size:25px;font-weight:400;line-height:1}
.article-header nav .article-position{padding:0 17px;font-size:9px;font-weight:600;letter-spacing:.13em}
.article-header nav .article-close{width:64px;font-size:32px;font-weight:300;line-height:1}
.article-header nav a:hover{background:#f4f4f4}
.article-header nav a:focus-visible{outline:2px solid #111;outline-offset:-4px}
.article-body{width:min(1540px,94vw);margin:auto;padding:42px 0 120px}/* ARTICLE GALLERY — image intrinsic dimensions cannot enlarge the text row.
   Row 3 follows text height; opening PT increases it and the adjacent image crops to fit.
   First four images + text, followed by alternating image groups.
   Edit image paths in each article's #article-images list; no manual grid positions. */
.article-body{width:min(1540px,94vw);margin:auto;padding:42px 0 120px}
.editorial-grid{display:block}
.editorial-grid figure{position:relative;margin:0;min-width:0;min-height:0;overflow:hidden;cursor:zoom-in}
.editorial-grid figure img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.gallery-lead{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:clamp(230px,25vw,430px) minmax(185px,auto) minmax(320px,max-content);gap:3px}
.gallery-lead>figure:nth-of-type(1){grid-column:1/7;grid-row:1}
.gallery-lead>figure:nth-of-type(2){grid-column:7/11;grid-row:1/3}
.gallery-lead>figure:nth-of-type(3){grid-column:11/13;grid-row:1/3}
.gallery-lead>.intro{grid-column:1/7;grid-row:2}
.gallery-lead>figure:nth-of-type(4){grid-column:1/7;grid-row:3}
.gallery-lead>.copy,.gallery-lead.no-copy>figure:nth-of-type(5){grid-column:7/13;grid-row:3}
.intro,.copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(24px,3.3vw,56px);min-width:0}
.intro h2{font-size:clamp(48px,5.2vw,82px);line-height:.9;letter-spacing:-.05em;font-weight:500;margin:0}
.intro p,.copy{font-size:13px;line-height:1.68}.copy p{margin:0 0 18px}.copy details{margin-top:12px}
/* Every four subsequent photographs: one large + two small + one wide.
   The next group reverses left/right. Incomplete groups expand, never leave blanks. */
.gallery-series{display:grid;gap:3px;margin-top:3px}
.gallery-group{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:repeat(2,minmax(0,1fr));gap:3px;height:clamp(310px,39vw,590px)}
.gallery-group>figure:nth-child(1){grid-column:1;grid-row:1/3}
.gallery-group>figure:nth-child(2){grid-column:2;grid-row:1}
.gallery-group>figure:nth-child(3){grid-column:3;grid-row:1}
.gallery-group>figure:nth-child(4){grid-column:2/4;grid-row:2}
.gallery-group--reverse{grid-template-columns:1fr 1fr 2fr}
.gallery-group--reverse>figure:nth-child(1){grid-column:3;grid-row:1/3}
.gallery-group--reverse>figure:nth-child(2){grid-column:1;grid-row:1}
.gallery-group--reverse>figure:nth-child(3){grid-column:2;grid-row:1}
.gallery-group--reverse>figure:nth-child(4){grid-column:1/3;grid-row:2}
.gallery-group[data-count="1"]{display:block;height:clamp(280px,35vw,530px)}
.gallery-group[data-count="2"]{grid-template-columns:1fr 1fr;grid-template-rows:1fr;height:clamp(250px,29vw,450px)}
.gallery-group[data-count="2"]>figure:nth-child(n){grid-column:auto;grid-row:auto}
.gallery-group[data-count="3"]{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;height:clamp(300px,35vw,530px)}
.gallery-group[data-count="3"]>figure:nth-child(1){grid-column:1;grid-row:1/3}
.gallery-group[data-count="3"]>figure:nth-child(2){grid-column:2;grid-row:1}
.gallery-group[data-count="3"]>figure:nth-child(3){grid-column:2;grid-row:2}
.gallery-group--reverse[data-count="3"]>figure:nth-child(1){grid-column:2;grid-row:1/3}
.gallery-group--reverse[data-count="3"]>figure:nth-child(2){grid-column:1;grid-row:1}
.gallery-group--reverse[data-count="3"]>figure:nth-child(3){grid-column:1;grid-row:2}
.lightbox{position:fixed;inset:0;width:100vw;height:100vh;max-width:none;max-height:none;margin:0;border:0;padding:4vh 5vw;background:#fff}.lightbox::backdrop{background:#fff}.lightbox img{width:100%;height:92vh;object-fit:contain}.lightbox button{position:absolute;z-index:2;border:0;background:#fff;padding:10px;cursor:pointer;font-size:25px}.lightbox .close{right:2vw;top:1vh}@media(max-width:980px){
 .gallery-lead{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none}
 .gallery-lead>figure:nth-of-type(n),.gallery-lead>.intro,.gallery-lead>.copy,.gallery-lead.no-copy>figure:nth-of-type(5){grid-column:auto;grid-row:auto;min-height:0}
 .gallery-lead>figure{aspect-ratio:4/3}.intro,.copy{min-height:220px}
 .gallery-group{height:clamp(260px,50vw,480px)}
}
@media(max-width:620px){
 .article-body{width:calc(100vw - 28px);padding-top:14px}
 .gallery-lead{grid-template-columns:1fr}
 .gallery-lead>figure:nth-of-type(n),.gallery-lead>.intro,.gallery-lead>.copy,.gallery-lead.no-copy>figure:nth-of-type(5){grid-column:1;grid-row:auto}
 .gallery-lead>figure{aspect-ratio:4/3}
 .gallery-group,.gallery-group[data-count="2"],.gallery-group[data-count="3"]{height:clamp(220px,62vw,390px)}
 .article-header{height:66px;padding-left:12px}.article-header nav a,.article-header nav .article-position{height:66px}.article-header nav .article-prev,.article-header nav .article-next{width:36px;font-size:20px}.article-header nav .article-position{padding:0 8px;font-size:7px}.article-header nav .article-close{width:40px;font-size:26px}
 .brand strong{font-size:clamp(10px,3vw,15px)}.brand small{font-size:7px}
}
/* Article navigation and text blocks */
.article-header nav a[hidden]{display:none}.intro h2 .accent{color:var(--accent)}.copy details summary{cursor:pointer}.copy details p{margin:12px 0}.editorial-grid figure img{object-fit:cover}

/* IMAGE VIEWER: click the photograph to advance; X closes. */
.lightbox img{cursor:pointer}

/* MOBILE — títulos e galeria numa coluna com largura real do ecrã. */
@media (max-width: 620px) {
  .article-body { width: calc(100% - 28px); min-width: 0; }
  .gallery-lead { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
  .gallery-lead > .intro, .gallery-lead > .copy { width: 100%; min-width: 0; min-height: 0; padding: 32px 16px; }
  .intro h2 { font-size: clamp(28px, 8vw, 42px); line-height: 1.04; letter-spacing: -.055em; overflow-wrap: anywhere; hyphens: auto; }
  .intro p, .copy { overflow-wrap: break-word; }
  .article-header { min-width: 0; }
  .article-header nav { flex-shrink: 0; }
  .brand { overflow: hidden; }
}
