/*
Theme Name: Ocean Sunset Portfolio
Description: A bilingual Bangla and English photography portfolio with an Ocean Sunset design, editable content, demo import, and a 10× image viewer.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
Author: Ocean Sunset Portfolio
Text Domain: ocean-sunset-portfolio
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

/* WordPress integration and theme-controlled palette. */
:root {
  --osp-night:#071a2a;
  --osp-horizon:#165268;
  --osp-mist:#b6d8d5;
  --osp-card-border-radius:var(--radius);
}
.site-head.compact { background:var(--cream);background:color-mix(in srgb,var(--cream) 94%,transparent) }
.brand-icon,.button.primary { color:white;background:linear-gradient(145deg,var(--plum),var(--raspberry)) }
.brand-icon { color:var(--gold) }
.hero { background:radial-gradient(ellipse at 89% 5%,color-mix(in srgb,var(--coral) 37%,transparent),transparent 53%),linear-gradient(142deg,var(--osp-night) 8%,var(--plum) 59%,var(--osp-horizon)) }
.hero-copy h2 { text-wrap:balance }
.hero-actions .button.primary,.button.warm {
  color:var(--plum);
  background:linear-gradient(110deg,var(--gold),color-mix(in srgb,var(--gold) 58%,var(--coral)));
}
.hero-kicker::before { background:var(--coral) }
.shoreline-sand { color:var(--cream) }
.shoreline-contact { color:var(--plum) }
.gallery { background:radial-gradient(ellipse at 100% 0,color-mix(in srgb,var(--raspberry) 45%,transparent),transparent 61%),linear-gradient(145deg,var(--osp-night),var(--plum) 78%,var(--osp-horizon)) }
.gallery .filter[aria-pressed=true] { background:var(--gold);color:var(--plum) }
.contact { background:radial-gradient(ellipse at 13% 36%,color-mix(in srgb,var(--raspberry) 66%,var(--plum)),transparent 71%),linear-gradient(155deg,var(--plum),var(--osp-night)) }
.footer { background:color-mix(in srgb,var(--plum) 45%,var(--osp-night)) }
.archive { background:color-mix(in srgb,var(--cream) 89%,var(--coral)) }
.about { background:linear-gradient(110deg,color-mix(in srgb,var(--cream) 91%,var(--raspberry)),var(--cream)) }
.collection.tone-coast { background:color-mix(in srgb,var(--paper) 80%,var(--gold)) }
.collection.tone-nature { background:color-mix(in srgb,var(--paper) 88%,var(--raspberry)) }
.collection.tone-water { background:color-mix(in srgb,var(--paper) 94%,var(--plum)) }
.card,.collection,.archive-cover,.about-mark { border-radius:var(--osp-card-border-radius) }
.collection .visual,.notes .visual { border-radius:max(0px,calc(var(--osp-card-border-radius) - 1px)) max(0px,calc(var(--osp-card-border-radius) - 1px)) 0 0 }
.gallery-card { border-radius:var(--osp-card-border-radius);background:color-mix(in srgb,var(--plum) 60%,var(--osp-night)) }
.gallery-card .visual,.image-button { border-radius:max(0px,calc(var(--osp-card-border-radius) - 1px)) max(0px,calc(var(--osp-card-border-radius) - 1px)) 0 0 }
.slider-progress span { background:linear-gradient(90deg,var(--raspberry),var(--coral),var(--gold)) }
.dot:is(:hover,:focus-visible)::before,.dot[aria-current=true]::before { background:var(--gold) }
.zoom-tools input { accent-color:var(--gold) }
.feature-photo,.image-button { position:relative;display:block;text-decoration:none;cursor:zoom-in }
.photo-expand { position:absolute;right:9px;bottom:9px;display:grid;place-items:center;width:36px;height:36px;background:#092d3fe8;border:1px solid #ffedc876;border-radius:50%;color:#ffe5b7 }
.photo-expand .icon { width:18px;height:18px }
:is(.feature-photo,.image-button):is(:hover,:focus-visible) .photo-expand { color:var(--plum);background:var(--gold) }
.gallery-search { display:grid;gap:4px;color:#eaf4f0;min-width:min(100%,220px);font-weight:700;margin-bottom:20px }
.gallery-search input { background:#163e4f;border:1px solid #9bcac477;border-radius:10px;padding:7px 10px;min-height:44px;width:100%;min-width:0 }
.gallery-empty { color:#fff2da;padding:14px 0 }
.osp-logo { width:auto;max-width:min(27vw,124px);height:45px;object-fit:contain }
.osp-desktop { display:none }
.osp-desktop ul,.drawer nav ul,.no-js-drawer ul { list-style:none;padding:0;margin:0 }
.drawer nav ul ul,.footer ul ul { padding-inline-start:16px }
.no-js-drawer li { display:inline-block;padding:5px }
.osp-desktop summary { list-style:none;cursor:pointer }
.osp-desktop summary::-webkit-details-marker { display:none }
.osp-desktop .mega { margin-inline:auto }
.osp-desktop .mega-grid { grid-template-columns:repeat(auto-fit,minmax(152px,1fr));max-height:65vh;overflow:auto }
.osp-desktop .mega a.featured { background:linear-gradient(145deg,var(--plum),var(--raspberry)) }
.archive-list:only-child,.about-copy:only-child,.contact-intro:only-child { grid-column:1/-1 }
.osp-no-image .hero-copy { grid-column:1/-1 }
.standard-content { padding-block:clamp(38px,6vw,86px);min-height:50vh }
.standard-content article { max-width:840px;margin-bottom:40px }
.standard-content h1,.standard-content h2 { margin-bottom:14px }
.standard-content img { width:auto;max-width:100%;height:auto }
.standard-content .wp-block-gallery img { width:100% }
.standard-content input { max-width:100%;padding:8px }
.standard-content p { margin-block:10px }
@media(min-width:920px) {
  .osp-desktop { height:100%;display:block;min-width:0 }
  .osp-desktop>ul { height:100%;display:flex;align-items:center;gap:clamp(13px,2.25vw,38px) }
  .osp-desktop>ul>li,.portfolio-menu { height:100%;display:flex;align-items:center }
  .osp-desktop>ul>li>a,.portfolio-menu>summary { display:flex;align-items:center;gap:4px;min-height:44px;white-space:nowrap;text-decoration:none;font-weight:700;position:relative }
  .portfolio-menu>summary { height:100% }
  .portfolio-menu>summary .icon { width:16px;height:16px }
  .osp-desktop>ul>li>a::after,.portfolio-menu>summary::after { content:"";position:absolute;left:0;right:0;bottom:4px;height:2px;background:linear-gradient(95deg,var(--raspberry),var(--gold));transform:scaleX(0);transform-origin:left;transition:transform 180ms var(--easing) }
  .portfolio-menu>summary::after { bottom:calc(50% - 19px) }
  .osp-desktop>ul>li>a:is(:hover,:focus-visible)::after,.portfolio-menu[open]>summary::after,.portfolio-menu>summary:focus-visible::after { transform:scaleX(1) }
  .osp-desktop>ul>li:has(>ul) { position:relative }
  .osp-desktop>ul>li:has(>ul)>ul { display:none;position:absolute;top:100%;left:0;min-width:180px;max-height:60vh;overflow:auto;border:var(--line);border-radius:12px;background:var(--cream);box-shadow:var(--shadow);padding:8px 12px }
  .osp-desktop>ul>li:has(>ul):is(:hover,:focus-within)>ul { display:grid;gap:3px }
  .osp-desktop>ul>li>ul a { display:block;padding-block:7px }
  .osp-desktop>ul>li>ul ul { padding-left:12px }
  .gallery-tools { display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:16px }
  .admin-bar .site-head { top:32px }
}
@media(max-width:919px) {
  .admin-bar .site-head { top:32px }
}
@media(max-width:782px) {
  .admin-bar .site-head { top:46px }
}
@media(max-width:600px) {
  .admin-bar .site-head { top:0 }
}
.about-copy p,.contact-intro p,.hero-copy p,.notes .card p,.archive-item p { white-space:pre-line }
.drawer nav .portfolio-menu>summary { padding:5px 0 }
.drawer .portfolio-menu .mega { position:static;box-shadow:none;border-radius:0;background:transparent }
.drawer .portfolio-menu .mega-grid { width:100%;grid-template-columns:1fr;padding:8px 0;gap:6px }
.drawer .portfolio-menu .mega a { min-height:44px;padding:8px 10px;display:flex;flex-wrap:wrap;gap:5px 8px }
.drawer .portfolio-menu .mega a>span:last-child:not(:first-child) { width:100%;font-weight:500 }

#tide-fill stop:first-child { stop-color:var(--raspberry) }
#tide-fill stop:last-child { stop-color:var(--plum) }
#sun-fill stop:first-child { stop-color:var(--gold) }
#sun-fill stop:last-child { stop-color:var(--coral) }