/* The Aquarium: a public room concept for the future Hotel Sufardi. */
.aq-page { --aq-ink:#102d32; --aq-teal:#184349; --aq-ivory:#f3ecdd; --aq-gold:#d7b77d; --aq-coral:#cf8274; --aq-muted:#b6c9c5; --aq-line:#d7b77d4d; margin:0; background:var(--aq-ink); color:var(--aq-ivory); font:16px/1.7 Arial,Helvetica,sans-serif; }
.aq-page *, .aq-door * { box-sizing:border-box; }
.aq-page a { color:inherit; text-underline-offset:.25em; text-decoration-thickness:1px; }
.aq-page a:hover { color:var(--aq-gold); }
.aq-page a:focus-visible, .aq-door a:focus-visible { outline:3px solid #df9f7c; outline-offset:5px; }
.aq-page img { display:block; max-width:100%; height:auto; }
.aq-page figure, .aq-page h1, .aq-page h2, .aq-page h3, .aq-page h4 { margin:0; }
.aq-page h1, .aq-page h2, .aq-page h3, .aq-page h4 { font-family:Georgia,'Times New Roman',serif; font-weight:400; }
.aq-page em { color:var(--aq-gold); }
.aq-skip { position:fixed; z-index:20; left:20px; top:-90px; padding:12px 18px; background:var(--aq-ivory); color:var(--aq-ink) !important; }
.aq-skip:focus { top:12px; }
.aq-header { max-width:1600px; margin:auto; padding:28px 5.5%; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:25px; border-bottom:1px solid var(--aq-line); }
.aq-brand { display:flex; align-items:center; gap:16px; text-decoration:none; font-size:12px; letter-spacing:2px; line-height:1.4; }
.aq-brand small { display:block; color:var(--aq-muted); font-size:9px; letter-spacing:1px; margin-top:5px; }
.aq-monogram { display:block; border:1px solid var(--aq-gold); color:var(--aq-gold); padding:8px; font:28px/1.1 Georgia,serif; letter-spacing:-2px; }
.aq-header nav { display:flex; flex-wrap:wrap; align-items:center; gap:25px; font-size:12px; }
.aq-header nav a { display:inline-flex; align-items:center; min-height:44px; text-decoration:none; border-bottom:1px solid transparent; }
.aq-header nav a:hover { border-color:var(--aq-gold); }
.aq-arrival { max-width:1600px; margin:auto; padding:65px 5.5% 0; }
.aq-introduction { display:grid; grid-template-columns:1.4fr 1fr; column-gap:50px; align-items:end; margin-bottom:38px; }
.aq-kicker { margin:0 0 16px; color:var(--aq-gold); font-size:10px; line-height:1.7; letter-spacing:2px; }
.aq-introduction .aq-kicker { grid-column:1/-1; }
.aq-introduction h1 { grid-column:1; grid-row:2/4; font-size:clamp(60px,6.6vw,106px); line-height:1.07; letter-spacing:-3px; }
.aq-lead { margin:0; font:24px/1.4 Georgia,serif; }
.aq-intro-note { margin:16px 0 0; color:var(--aq-muted); font-size:13px; line-height:1.9; max-width:480px; }
.aq-room-picture { border:1px solid var(--aq-line); background:#173d41; }
.aq-room-picture img { width:100%; }
.aq-page figcaption { padding:15px 21px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 25px; font-size:10px; line-height:1.7; letter-spacing:.4px; color:var(--aq-muted); }
.aq-threshold { display:flex; align-items:center; justify-content:space-between; gap:30px; border-bottom:1px solid var(--aq-line); padding:28px 0 35px; }
.aq-threshold p { font:23px/1.3 Georgia,serif; margin:0; }
.aq-threshold a { display:inline-flex; align-items:center; justify-content:space-between; min-width:145px; gap:40px; padding:16px 0; font-size:12px; text-decoration:none; }
.aq-threshold a span { font-size:23px; }
.aq-section { max-width:1450px; margin:auto; padding:85px 5.5% 0; scroll-margin-top:25px; }
.aq-section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:45px; margin-bottom:38px; }
.aq-section-heading h2, .aq-management h2 { font-size:clamp(40px,4.2vw,68px); line-height:1.07; letter-spacing:-1.5px; }
.aq-section-heading>p { margin:0 0 4px; max-width:355px; color:var(--aq-muted); font-size:13px; line-height:1.9; }
.aq-atlas-picture { max-width:980px; margin:0 auto !important; background:var(--aq-ivory); border:1px solid var(--aq-gold); }
.aq-atlas-picture img { width:100%; }
.aq-atlas-picture figcaption { color:#455c59; border-top:1px solid #b9a57c66; }
.aq-atlas-picture figcaption a:hover { color:#934d3e; }
.aq-atlas-note { margin:22px 0 0; color:var(--aq-muted); max-width:850px; font-size:12px; }
.aq-water-nav { display:flex; flex-wrap:wrap; gap:12px; margin:30px 0 55px; }
.aq-water-nav a { min-height:45px; padding:11px 20px; border:1px solid var(--aq-line); text-decoration:none; font-size:12px; }
.aq-water-nav a:hover { background:var(--aq-teal); }
.aq-water { scroll-margin-top:25px; margin-top:60px; }
.aq-water-heading { display:flex; align-items:center; gap:22px; padding:0 0 22px; border-bottom:1px solid var(--aq-line); margin-bottom:25px; }
.aq-water-number { font:38px/1 Georgia,serif; color:var(--aq-coral); }
.aq-water-heading h3 { font-size:35px; line-height:1.2; }
.aq-water-heading p { color:var(--aq-muted); font-size:12px; margin:7px 0 0; }
.aq-fish-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.aq-fish { background:#15383e; padding:30px; border:1px solid #c4c7ab2d; }
.aq-fish-index { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; font-size:9px; letter-spacing:1.5px; color:var(--aq-gold); margin:0 0 21px !important; }
.aq-fish-index span { color:#cdb3a1; }
.aq-fish h4 { font-size:clamp(26px,2.5vw,37px); line-height:1.2; overflow-wrap:anywhere; }
.aq-fish h4 i { color:var(--aq-ivory); }
.aq-fish .aq-common-name { color:var(--aq-gold); font-size:12px; margin:10px 0 18px; }
.aq-fish>p { font-size:13px; line-height:1.9; color:#d0d9d1; }
.aq-fish dl { border-top:1px solid #c4c7ab2d; padding-top:17px; margin:21px 0 0; font-size:12px; }
.aq-fish dl>div { display:grid; grid-template-columns:105px minmax(0,1fr); gap:15px; margin:10px 0; }
.aq-fish dt { color:#abbfb9; }
.aq-fish dd { margin:0; }
.aq-fish .aq-reference { display:flex; flex-direction:column; gap:8px; margin:20px 0 0; font-size:10px; line-height:1.8; }
.aq-fish .aq-reference a { color:#d9c69e; }
.aq-fish-grid--single { grid-template-columns:minmax(0,1fr); }
.aq-fish-grid--single .aq-fish { display:grid; grid-template-columns:1fr 1fr; column-gap:45px; }
.aq-fish-grid--single .aq-fish .aq-fish-index { grid-column:1/-1; }
.aq-fish-grid--single .aq-fish h4, .aq-fish-grid--single .aq-fish .aq-common-name, .aq-fish-grid--single .aq-fish>p:not(.aq-reference):not(.aq-fish-index) { grid-column:1; }
.aq-fish-grid--single .aq-fish dl { grid-column:2; grid-row:2/5; margin:0; align-self:start; }
.aq-fish-grid--single .aq-fish .aq-reference { grid-column:2; }
.aq-management { position:relative; padding-top:0; margin-top:90px; padding-bottom:65px; }
.aq-management>img { width:100%; max-height:200px; object-fit:contain; object-position:center bottom; }
.aq-management>div { border:1px solid var(--aq-line); padding:45px; background:#163b3d; }
.aq-management h2 { margin-bottom:25px; }
.aq-management p:not(.aq-kicker) { color:var(--aq-muted); font-size:13px; max-width:790px; line-height:1.9; }
.aq-link { display:inline-flex; gap:45px; align-items:center; min-height:48px; padding:10px 0; margin-top:12px; border-bottom:1px solid var(--aq-gold); text-decoration:none; font-size:12px; }
.aq-footer { max-width:1450px; margin:auto; border-top:1px solid var(--aq-line); padding:30px 5.5% 40px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:25px; font-size:11px; }
.aq-footer p { font-size:10px; color:var(--aq-muted); }
.aq-footer p span { font-size:9px; }
/* A picture-led entrance shared by the homepage and the room-guardian directory. */
.aq-door { display:grid; grid-template-columns:1fr 1.25fr; gap:45px; align-items:center; max-width:1406px; width:89%; margin:60px auto; padding:38px; border:1px solid #d7b77d6b; background:#14383d; color:#f3ecdd; font:14px/1.85 Arial,Helvetica,sans-serif; }
.aq-door .aq-door-kicker { margin:0 0 15px; color:#d7b77d; font-size:9px; line-height:1.7; letter-spacing:1.8px; }
.aq-door h2 { font:400 clamp(36px,4.6vw,67px)/1.07 Georgia,serif; color:#f3ecdd; margin:0 0 20px; letter-spacing:-1.5px; }
.aq-door h2 em { color:#d7b77d; }
.aq-door p { margin:0 0 18px; color:#b6c9c5; font-size:12px; }
.aq-door a { color:#e2c997; }
.aq-door .aq-door-link { display:inline-flex; align-items:center; gap:35px; min-height:45px; padding:9px 0; border-bottom:1px solid #d7b77d77; text-decoration:none; font-size:12px; }
.aq-door figure { margin:0; }
.aq-door img { display:block; width:100%; height:auto; }
.aq-door figcaption { margin-top:12px; font-size:9px; color:#b6c9c5; }
@media(max-width:800px) { .aq-introduction { grid-template-columns:1fr; gap:0; } .aq-introduction h1 { grid-row:auto; margin-bottom:23px; } .aq-lead { font-size:21px; } .aq-intro-note { max-width:630px; } .aq-section-heading { display:block; } .aq-section-heading>p { max-width:600px; margin-top:25px; } .aq-door { gap:30px; padding:30px; } .aq-door h2 { font-size:47px; } }
@media(max-width:600px) { .aq-header { padding:20px 6%; gap:15px; } .aq-header nav { gap:18px; width:100%; font-size:11px; } .aq-arrival { padding:42px 6% 0; } .aq-introduction h1 { font-size:clamp(42px,12vw,68px); letter-spacing:-1.9px; } .aq-kicker { font-size:8px; letter-spacing:1.5px; } .aq-room-picture figcaption { font-size:9px; padding:13px; } .aq-threshold { gap:20px; } .aq-threshold p { font-size:20px; } .aq-threshold a { min-width:108px; gap:14px; font-size:11px; } .aq-section { padding:57px 6% 0; } .aq-section-heading h2, .aq-management h2 { font-size:43px; } .aq-section-heading>p { font-size:12px; } .aq-page figcaption { padding:14px; font-size:9px; } .aq-fish-grid { grid-template-columns:1fr; } .aq-fish { padding:25px 22px; } .aq-fish h4 { font-size:30px; } .aq-fish dl>div { grid-template-columns:90px minmax(0,1fr); gap:12px; } .aq-fish-grid--single .aq-fish { display:block; } .aq-fish-grid--single .aq-fish dl { margin-top:20px; } .aq-water-heading h3 { font-size:31px; } .aq-water-nav { gap:9px; margin-bottom:35px; } .aq-water-nav a { padding:10px 13px; font-size:10px; } .aq-management { margin-top:30px; padding-bottom:45px; } .aq-management>img { max-height:120px; } .aq-management>div { padding:28px 22px; } .aq-footer { padding:25px 6% 35px; } .aq-door { width:88%; grid-template-columns:1fr; margin:40px auto; gap:25px; padding:26px 22px; } .aq-door h2 { font-size:46px; } }
@media(prefers-reduced-motion:no-preference) { .aq-page { scroll-behavior:smooth; } }