* { box-sizing:border-box; }
@media (min-width:1501px) and (orientation:landscape) {
 .header .navigation { right:0; top:-14px; padding-top:0; }
 .header .brand { width:clamp(260px,24vw,380px); }
 .header .brand img { clip-path:polygon(0 0,100% 0,100% 70%,30% 70%,30% 100%,0 100%); }
}
:root { color-scheme:light; --navy:#0E2334; --orange:#FE590E; --blue:#4DB5FB; }
html,body { width:100%; height:100%; min-width:320px; margin:0; }
body { color:var(--navy); background:#fff; font-family:Montserrat,"Avenir Next",Arial,sans-serif; }
.landing { position:relative; isolation:isolate; overflow:hidden; width:100%; min-height:100vh; min-height:100svh; background:#fff; }
.scenery { position:absolute; z-index:-1; inset:0; display:block; overflow:hidden; }
.scenery img { position:relative; top:9%; width:100%; height:100%; display:block; object-fit:cover; object-position:center; }
.header { position:absolute; z-index:4; top:4.5vh; left:5.5vw; right:5.5vw; display:flex; align-items:flex-start; justify-content:space-between; }
.brand { display:block; width:clamp(240px,22vw,350px); height:auto; }
.brand img { display:block; width:100%; height:auto; }
.navigation { position:absolute; right:49%; top:0; display:flex; align-items:center; gap:clamp(12px,1.5vw,24px); padding-top:1.3vh; color:var(--navy); font-size:clamp(12px,1.05vw,17px); font-weight:500; line-height:1; white-space:nowrap; }
.navigation a { color:inherit; text-decoration:none; }
.navigation a[href]:hover,.navigation a[href]:focus-visible { text-decoration:underline; text-decoration-color:var(--orange); text-underline-offset:4px; }
.navigation a[aria-disabled="true"] { cursor:default; }
.divider { width:1px; height:22px; background:var(--orange); }
.linkedin { display:inline-flex; width:30px; height:30px; color:#0a66c2 !important; }
.linkedin svg { width:100%; height:100%; }
.linkedin span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.menu-toggle { display:none; }
.content { position:absolute; z-index:2; top:18%; left:5.5%; width:min(64%,1000px); }
.headline,.headline img,.description,.description img { display:block; width:100%; height:auto; }
.description { width:84%; margin-top:1.3vh; }
.poem { position:absolute; z-index:2; left:5.5%; top:50%; width:min(34vw,500px); min-height:150px; padding-left:20px; border-left:5px solid var(--blue); color:var(--navy); }
.poem blockquote { display:flex; flex-direction:column; gap:.15em; margin:0; font:italic clamp(17px,2vw,29px)/1.22 Georgia,"Times New Roman",serif; }
.poem footer { display:flex; gap:12px; margin-top:8px; font:clamp(11px,1.1vw,16px)/1.2 Georgia,"Times New Roman",serif; }
.poem cite { font-style:italic; }
/* iPad landscape: fill the whole 4:3 viewport and keep the copy in a single safe column. */
@media (min-width:701px) and (max-width:1100px) and (orientation:landscape) {
 .landing { width:100vw; min-height:100vh; min-height:100svh; }
 .scenery img { position:absolute; top:auto; right:0; bottom:0; width:auto; max-width:78%; height:68%; object-fit:contain; object-position:right bottom; -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.08) 10%,rgba(0,0,0,.5) 24%,#000 42%),linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.12) 8%,rgba(0,0,0,.6) 19%,#000 32%); -webkit-mask-composite:source-in; mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.08) 10%,rgba(0,0,0,.5) 24%,#000 42%),linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.12) 8%,rgba(0,0,0,.6) 19%,#000 32%); mask-composite:intersect; }
 .header { top:4%; left:4%; right:4%; align-items:center; }
 .brand { width:clamp(213px,27.6vw,305px); }
 .brand img { clip-path:polygon(0 0,100% 0,100% 70%,30% 70%,30% 100%,0 100%); }
 .navigation { display:none; right:0; top:48px; flex-direction:column; align-items:stretch; gap:0; min-width:165px; padding:8px 14px; border:1px solid rgba(14,35,52,.12); border-radius:8px; background:rgba(255,255,255,.98); box-shadow:0 8px 26px rgba(14,35,52,.18); font-size:15px; }
 .navigation.navigation--open { display:flex; }
 .navigation a { padding:12px 2px; }
 .divider { width:100%; height:1px; background:rgba(14,35,52,.18); }
 .linkedin { width:auto; height:auto; align-items:center; gap:8px; }
 .linkedin svg { width:26px; height:26px; flex:0 0 26px; }
 .linkedin span { position:static; width:auto; height:auto; overflow:visible; clip-path:none; }
 .menu-toggle { order:3; display:flex; flex:0 0 38px; flex-direction:column; justify-content:center; gap:5px; width:38px; height:38px; padding:7px; border:0; background:transparent; }
 .menu-toggle span { display:block; width:100%; height:3px; border-radius:2px; background:var(--blue); }
 .menu-toggle:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
 .navigation--tablet-hidden { display:none; }
 .content { top:max(112px,23%); left:5.5%; width:80%; }
 .description { width:84%; margin-top:0; }
 .poem { top:auto; bottom:13%; left:5.5%; width:min(40%,410px); min-height:0; }
 .poem blockquote { font-size:clamp(17px,2vw,25px); }
}
@media (min-width:1101px) and (max-width:1500px) and (orientation:landscape) {
 .scenery img { position:absolute; top:auto; right:0; bottom:0; width:auto; max-width:100%; height:calc(100% - 84px); object-fit:contain; object-position:right bottom; -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.05) 5%,#000 25%); mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.05) 5%,#000 25%); }
 .header { top:4.2vh; left:5.6vw; right:5.6vw; }
 .brand { width:clamp(240px,25vw,340px); }
 .brand img { clip-path:polygon(0 0,100% 0,100% 70%,30% 70%,30% 100%,0 100%); }
 .content { top:max(140px,26%); left:6.6%; width:60%; }
 .description { width:90%; margin-top:0; }
 .poem { top:auto; bottom:12%; left:6.6%; width:min(23vw,310px); min-height:0; }
 .poem blockquote { font-size:clamp(17px,1.7vw,24px); }
 .navigation { right:0; top:0; padding-top:0; }
}
@media (min-width:601px) and (max-width:900px) and (orientation:portrait) {
 .landing { min-height:100vh; min-height:100svh; }
 .scenery img { position:absolute; top:auto; right:0; bottom:0; width:100%; max-width:100%; height:auto; object-fit:contain; object-position:center bottom; -webkit-mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.3) 8%,#000 24%); mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.3) 8%,#000 24%); }
 .header { top:3.2vh; left:5.5vw; right:5.3vw; }
 .brand { width:clamp(286px,50.6vw,411.4px); }
 .brand img { clip-path:polygon(0 0,100% 0,100% 70%,30% 70%,30% 100%,0 100%); }
 .menu-toggle { position:absolute; top:0; right:0; display:flex; flex-direction:column; justify-content:center; gap:5px; width:42px; height:42px; padding:8px; border:0; background:transparent; cursor:pointer; }
 .menu-toggle span { display:block; width:100%; height:3px; border-radius:2px; background:var(--blue); }
 .menu-toggle:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
 .navigation { display:none; position:absolute; top:48px; right:0; flex-direction:column; align-items:stretch; gap:0; min-width:155px; padding:8px 14px; border:1px solid rgba(14,35,52,.12); border-radius:8px; background:rgba(255,255,255,.97); box-shadow:0 8px 26px rgba(14,35,52,.18); font-size:15px; }
 .navigation.navigation--open { display:flex; }
 .navigation a { padding:12px 2px; }
 .divider { width:100%; height:1px; background:rgba(14,35,52,.18); }
 .linkedin { width:auto; height:auto; align-items:center; gap:8px; }
 .linkedin svg { width:25px; height:25px; flex:0 0 25px; }
 .linkedin span { position:static; width:auto; height:auto; overflow:visible; clip-path:none; }
 .content { top:calc(27.6% + clamp(41.184px,7.2864vw,59.2416px)); left:7.5%; width:85%; transform:translateY(-50%); }
 .description { width:100%; margin-top:0; }
 .poem { top:52%; left:7.5%; width:56%; min-height:0; }
 .poem blockquote { font-size:clamp(18px,3vw,25px); }
}
@media (max-width:600px) and (orientation:portrait) {
 .landing { min-height:100vh; min-height:100svh; }
 .scenery img { position:absolute; top:auto; right:0; bottom:0; width:100%; height:auto; object-fit:contain; object-position:center bottom; -webkit-mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.3) 8%,#000 25%); mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.3) 8%,#000 25%); }
 .header { top:max(22px,env(safe-area-inset-top)); left:4.6vw; right:5vw; }
 .brand { width:clamp(190px,58vw,235px); }
 .brand img { clip-path:polygon(0 0,100% 0,100% 70%,30% 70%,30% 100%,0 100%); }
 .menu-toggle { position:absolute; top:0; right:0; display:flex; flex-direction:column; justify-content:center; gap:5px; width:42px; height:42px; padding:8px; border:0; background:transparent; cursor:pointer; }
 .menu-toggle span { display:block; width:100%; height:3px; border-radius:2px; background:var(--blue); }
 .menu-toggle:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
 .navigation { display:none; position:absolute; top:48px; right:0; flex-direction:column; align-items:stretch; gap:0; min-width:150px; padding:8px 14px; border:1px solid rgba(14,35,52,.12); border-radius:8px; background:rgba(255,255,255,.97); box-shadow:0 8px 26px rgba(14,35,52,.18); font-size:14px; }
 .navigation.navigation--open { display:flex; }
 .navigation a { padding:11px 2px; }
 .divider { width:100%; height:1px; background:rgba(14,35,52,.18); }
 .linkedin { width:auto; height:auto; align-items:center; gap:8px; }
 .linkedin svg { width:25px; height:25px; flex:0 0 25px; }
 .linkedin span { position:static; width:auto; height:auto; overflow:visible; clip-path:none; }
 .content { top:calc(29% + max(11px,env(safe-area-inset-top)/2) + clamp(27.36px,8.352vw,33.84px)); left:8%; width:74%; transform:translateY(-50%); }
 .headline { width:60%; }
 .description { width:98%; margin-top:.8vh; }
 .poem { top:58%; left:8.2%; width:78%; min-height:0; padding-left:12px; border-left-width:3px; }
 .poem blockquote { font-size:clamp(13px,3.7vw,17px); }
 .poem footer { gap:8px; font-size:10px; }
}
@media (max-width:950px) and (max-height:500px) and (orientation:landscape) {
 .landing { min-height:100svh; }
 .scenery img { position:absolute; top:12%; right:0; bottom:auto; width:100%; max-width:100%; height:100%; object-fit:cover; object-position:center bottom; -webkit-mask-image:linear-gradient(to bottom,transparent 0%,transparent 34%,rgba(0,0,0,.08) 42%,rgba(0,0,0,.55) 53%,#000 64%); mask-image:linear-gradient(to bottom,transparent 0%,transparent 34%,rgba(0,0,0,.08) 42%,rgba(0,0,0,.55) 53%,#000 64%); }
 .header { top:max(12px,5vh); left:4.5vw; right:4.2vw; }
 .brand { width:clamp(180px,26vw,225px); }
 .brand img { clip-path:polygon(0 0,100% 0,100% 70%,30% 70%,30% 100%,0 100%); }
 .menu-toggle { position:absolute; top:0; right:0; display:flex; flex-direction:column; justify-content:center; gap:5px; width:42px; height:42px; padding:8px; border:0; background:transparent; cursor:pointer; }
 .menu-toggle span { display:block; width:100%; height:3px; border-radius:2px; background:var(--blue); }
 .navigation { display:none; position:absolute; top:48px; right:0; flex-direction:column; align-items:stretch; gap:0; min-width:150px; padding:8px 14px; border-radius:8px; background:rgba(255,255,255,.97); font-size:14px; }
 .navigation.navigation--open { display:flex; }
 .navigation a { padding:10px 2px; }
 .divider { width:100%; height:1px; background:rgba(14,35,52,.18); }
 .linkedin { width:auto; height:auto; align-items:center; gap:8px; }
 .linkedin svg { width:25px; height:25px; flex:0 0 25px; }
 .linkedin span { position:static; width:auto; height:auto; overflow:visible; clip-path:none; }
 .content { top:calc(25% + clamp(25.92px,3.744vw,32.4px)); left:12%; width:76%; transform:translateY(-50%); }
 .description,.poem { display:none; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; } }



