:root{
      --paper:#f6f5f1; --white:#fff; --ink:#1b1a17; --muted:#6b675c; --faint:#5f5b52;
      --line:rgba(27,26,23,.10); --line2:rgba(27,26,23,.17);
      --gold:#eace55; --gold-deep:#78600f; --gold-soft:#fbf6e2;
      --orange:#e8a233; --orange-deep:#b96f00; --orange-soft:#fcf1dd;
      --shadow:0 18px 50px rgba(27,26,23,.08);
      --shadow-sm:0 8px 24px rgba(27,26,23,.06);
      --radius:24px; --radius-sm:16px; --max:1180px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",Arial,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased}
    a{text-decoration:none;color:inherit}
    img{max-width:100%}
    .container{width:min(var(--max),92%);margin:auto}
    .section{padding:58px 0}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 12px 7px 9px;border-radius:999px;background:var(--gold-soft);color:var(--gold-deep);font-size:12px;font-weight:700;letter-spacing:.2px}
    .eyebrow i{display:block;width:7px;height:7px;border-radius:50%;background:var(--gold-deep);box-shadow:0 0 0 5px rgba(234,206,85,.18)}
    h1,h2,h3,h4{font-family:"Sora",Arial,sans-serif;letter-spacing:-.025em;line-height:1.12}
    h2{font-size:clamp(30px,4vw,46px);margin:12px 0}
    p{color:var(--muted)}
    .section-head{max-width:700px;margin-bottom:26px}
    .section-head.center{text-align:center;margin-left:auto;margin-right:auto}
    .section-head p{font-size:16px;margin:0}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 20px;border-radius:999px;background:var(--ink);color:#fff;font-weight:700;font-size:14px;border:1px solid transparent;transition:.2s}
    .btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
    .btn.gold{background:linear-gradient(135deg,#f3de85,#eace55,#c9a227);color:var(--ink)}
    .btn.outline{background:transparent;color:var(--ink);border-color:var(--line2)}
    .btn.whatsapp{background:#0b6b3d;color:#fff}
    .topbar{font-size:12px;text-align:center;background:var(--ink);color:#fff;padding:7px 12px}
    .topbar b{color:var(--gold)}
    nav{position:sticky;top:0;z-index:100;background:rgba(246,245,241,.90);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
    .nav-row{height:72px;display:flex;align-items:center;justify-content:space-between;gap:22px}
    .logo img{height:39px;width:auto;display:block}
    .nav-links{display:flex;align-items:center;gap:24px;font-size:13px;font-weight:700;color:var(--muted)}
    .nav-links a:hover{color:var(--gold-deep)}
    .nav-actions{display:flex;gap:9px;align-items:center}
    .nav-actions .btn{padding:10px 16px;font-size:12.5px}
    .menu-btn{display:none;border:1px solid var(--line2);background:#fff;border-radius:12px;padding:9px 11px;font-size:18px}
    .hero{position:relative;overflow:hidden;padding:68px 0 50px}
    .hero:before{content:"";position:absolute;width:500px;height:500px;border:1px solid rgba(234,206,85,.32);border-radius:50%;right:-170px;top:-120px;box-shadow:0 0 0 80px rgba(234,206,85,.035),0 0 0 160px rgba(234,206,85,.02)}
    .hero-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:48px;align-items:center;position:relative}
    .hero h1{font-size:clamp(42px,6vw,72px);margin:22px 0 16px;max-width:12ch}
    .hero h1 em{font-style:normal;background:linear-gradient(120deg,#7c6316,#eace55,#7c6316);-webkit-background-clip:text;background-clip:text;color:transparent}
    .hero-copy{font-size:18px;max-width:62ch}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
    .hero-note{display:flex;gap:10px;align-items:center;margin-top:18px;color:var(--faint);font-size:12px}
    .hero-note span{font-size:18px}
    .hero-panel{background:#fff;border:1px solid var(--line);border-radius:28px;padding:12px;box-shadow:var(--shadow)}
    .panel-inner{padding:22px}
    .panel-kicker{font-size:12px;color:var(--gold-deep);font-weight:800;text-transform:uppercase;letter-spacing:.8px}
    .panel-inner h3{font-size:25px;margin:8px 0 20px}
    .focus{display:flex;gap:14px;align-items:flex-start;padding:15px;border:1px solid var(--line);border-radius:16px;margin-top:9px}
    .focus-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:var(--gold-soft);font-size:19px;flex:none}
    .focus b{font-size:14px}.focus small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
    .trust-strip{padding:18px 0 0}
    .trust{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--shadow-sm)}
    .trust div{padding:20px;border-right:1px solid var(--line)}
    .trust div:last-child{border:0}.trust b{display:block;font-family:"Sora";font-size:14px}.trust span{font-size:12px;color:var(--faint)}
    .about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:start}
    .about-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow-sm)}
    .about-card h3{font-size:24px;margin-top:0}
    .about-card p{font-size:15px}
    .values{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;margin-top:20px}
    .value{padding:18px;border:1px solid var(--line);border-radius:16px;background:var(--paper)}
    .value b{font-size:14px}.value p{font-size:12px;margin:4px 0 0}
    .services{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .service-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}
    .service-card{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:25px;transition:.2s}
    .service-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm)}
    .service-no{font-family:"Sora";font-size:12px;color:var(--gold-deep);font-weight:800}
    .service-card h3{font-size:21px;margin:8px 0}
    .service-card p{font-size:13.5px;margin:0 0 15px}
    .service-card ul{margin:0;padding-left:18px;color:var(--muted);font-size:13px}
    .service-card li{margin:5px 0}
    .badge{display:inline-block;padding:5px 9px;border-radius:999px;background:var(--gold-soft);color:var(--gold-deep);font-size:10.5px;font-weight:800;margin-top:16px}
    .work-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}
    .work{min-height:185px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
    .work:after{content:"O²";position:absolute;right:-8px;bottom:-24px;font:800 90px "Sora";color:rgba(234,206,85,.12)}
    .work small{color:var(--gold-deep);font-weight:800;text-transform:uppercase;letter-spacing:.7px}
    .work h3{font-size:23px;margin:8px 0 4px;position:relative;z-index:1}
    .work p{font-size:12.5px;margin:0;position:relative;z-index:1}
    .team{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;max-width:760px;margin:auto}
    .person{background:#fff;border:1px solid var(--line);border-radius:20px;padding:25px;display:flex;gap:17px;align-items:center}
    .avatar{width:58px;height:58px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(135deg,#f3de85,#e8a233);font:800 19px "Sora";flex:none}
    .person h3{font-size:18px;margin:0 0 3px}.person p{font-size:12.5px;margin:0}
    .pricing{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .plans{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
    .plan{border:1px solid var(--line);border-radius:24px;padding:27px;display:flex;flex-direction:column;position:relative}
    .plan.popular{border:2px solid var(--gold);box-shadow:0 18px 55px rgba(234,206,85,.23)}
    .ribbon{position:absolute;top:-13px;left:23px;background:linear-gradient(135deg,#f3de85,#eace55);padding:6px 12px;border-radius:999px;font-size:10px;font-weight:800}
    .plan small{color:var(--faint);font-weight:800;text-transform:uppercase;letter-spacing:.7px}
    .plan h3{font-size:22px;margin:8px 0 7px}.plan .desc{font-size:13px;min-height:50px;margin:0}
    .price{font:800 34px "Sora";margin-top:17px}.price span{font:500 12px "DM Sans";color:var(--faint)}
    .plan hr{border:0;border-top:1px solid var(--line);width:100%;margin:19px 0}
    .plan ul{list-style:none;padding:0;margin:0;color:var(--muted);font-size:13px}.plan li{padding:8px 0;border-bottom:1px dashed var(--line)}
    .plan li:before{content:"✓";color:var(--gold-deep);font-weight:900;margin-right:8px}.plan .btn{margin-top:22px;width:100%}
    .add-ons{margin-top:26px;display:grid;grid-template-columns:1fr 1fr;gap:15px}
    .addon-box{border:1px solid var(--line);border-radius:20px;padding:23px;background:var(--paper)}
    .addon-box h3{font-size:19px;margin-top:0}.addon{display:flex;justify-content:space-between;gap:15px;padding:10px 0;border-bottom:1px dashed var(--line);font-size:13px}.addon:last-child{border:0}.addon b{white-space:nowrap;color:var(--gold-deep)}
    .process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
    .step{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px}
    .step-num{font:800 12px "Sora";color:var(--gold-deep)}.step h3{font-size:17px;margin:8px 0}.step p{font-size:12.5px;margin:0}
    .faq{max-width:850px;margin:auto}
    details{background:#fff;border:1px solid var(--line);border-radius:16px;padding:17px 19px;margin:9px 0}
    summary{cursor:pointer;font-weight:700;font-size:14px} details p{font-size:13px;margin:10px 0 0}
    .contact-wrap{background:linear-gradient(135deg,#f3de85,#eace55,#e8a233);border-radius:28px;padding:42px;display:grid;grid-template-columns:1.2fr .8fr;gap:35px;align-items:center;overflow:hidden}
    .contact-wrap h2{margin-top:0}.contact-wrap p{color:rgba(27,26,23,.72)}
    .contact-card{background:#fff;border-radius:20px;padding:23px;box-shadow:0 15px 35px rgba(27,26,23,.12)}
    .contact-row{padding:12px 0;border-bottom:1px solid var(--line);font-size:13px}.contact-row:last-child{border:0}.contact-row span{display:block;color:var(--faint);font-size:11px}.contact-row a{font-weight:700}
    footer{background:var(--ink);color:#fff;padding:42px 0 20px}
    .footer-main{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:35px}
    .footer-logo img{height:29px;filter:brightness(0) invert(1);opacity:.96}.footer-brand p{font-size:12px;color:rgba(255,255,255,.62);max-width:300px;margin:12px 0 0}
    .footer-links{display:flex;flex-direction:column;gap:7px}.footer-links h3{font-size:13px;margin:0 0 7px;color:#fff}.footer-links a{font-size:12px;color:rgba(255,255,255,.65)}.footer-links a:hover{color:#fff}
    .footer-bottom{margin-top:28px;padding-top:15px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:11px;color:rgba(255,255,255,.42)}
    .social{display:flex;gap:8px}.social a{padding:8px 11px;border:1px solid rgba(255,255,255,.18);border-radius:999px;font-size:11px}
    @media(max-width:900px){
      .nav-links,.nav-actions .btn{display:none}.menu-btn{display:block}
      .nav-links.open{display:flex;position:absolute;left:4%;right:4%;top:70px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;box-shadow:var(--shadow);flex-direction:column;align-items:flex-start}
      .hero-grid,.about-grid,.contact-wrap{grid-template-columns:1fr}.hero h1{max-width:16ch}
      .plans{grid-template-columns:1fr}.plan.popular{order:-1}
      .work-grid{grid-template-columns:repeat(2,1fr)}.process-grid{grid-template-columns:repeat(2,1fr)}
      .trust{grid-template-columns:repeat(2,1fr)}.trust div:nth-child(2){border-right:0}.trust div:nth-child(-n+2){border-bottom:1px solid var(--line)}
    }
    @media(max-width:620px){
      .section{padding:58px 0}.hero{padding:62px 0 45px}.hero h1{font-size:42px}
      .service-grid,.work-grid,.team,.values,.add-ons,.process-grid{grid-template-columns:1fr}
      .trust{grid-template-columns:1fr}.trust div{border-right:0!important;border-bottom:1px solid var(--line)}.trust div:last-child{border-bottom:0}
      .contact-wrap{padding:27px 21px}.logo img{height:31px}
      .topbar{font-size:10.5px}
    }
  
/* Multi-page enhancement: original Orbix theme preserved */
.page-transition{animation:orbixPageIn .45s ease both}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}
.reveal.visible{opacity:1;transform:none}
.nav-links a.active{color:var(--gold-deep)}
@keyframes orbixPageIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.page-transition,.reveal{animation:none!important;transition:none!important;opacity:1!important;transform:none!important}}

/* Shared accessibility and maintainability refinements */

:focus-visible{outline:3px solid var(--gold-deep);outline-offset:3px;border-radius:6px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--gold-deep);outline-offset:3px}
.logo{display:inline-flex;align-items:center;min-width:130px;min-height:39px}
.logo-missing::after{content:"Orbix Online";font:800 18px "Sora",Arial,sans-serif;letter-spacing:-.03em;color:var(--ink)}
.footer-logo{display:inline-flex;align-items:center;min-width:110px;min-height:29px}
.footer-logo.logo-missing::after{color:#fff;font-size:16px}
.nav-links.open{visibility:visible}


/* Contact page content adapted from V2, using the original Orbix theme */
.contact-hero{position:relative;overflow:hidden;padding:78px 0 58px}
.contact-hero:before{content:"";position:absolute;width:500px;height:500px;border:1px solid rgba(234,206,85,.32);border-radius:50%;right:-170px;top:-150px;box-shadow:0 0 0 80px rgba(234,206,85,.035),0 0 0 160px rgba(234,206,85,.02)}
.contact-hero-inner{position:relative;z-index:1;max-width:820px}
.contact-hero h1{font-size:clamp(44px,6vw,72px);margin:20px 0 14px;max-width:14ch}
.contact-hero h1 em{font-style:normal;background:linear-gradient(120deg,#7c6316,#eace55,#7c6316);-webkit-background-clip:text;background-clip:text;color:transparent}
.contact-hero p{font-size:18px;max-width:650px;margin:0}
.contact-layout{display:grid;grid-template-columns:.88fr 1.12fr;gap:24px;align-items:start}
.contact-info-card,.enquiry-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px;box-shadow:var(--shadow-sm)}
.contact-info-card h2{margin-top:0;font-size:32px}
.contact-info-card>p{font-size:14px}
.contact-detail{display:flex;gap:14px;align-items:flex-start;padding:17px 0;border-bottom:1px solid var(--line)}
.contact-detail:last-child{border-bottom:0}
.contact-detail-icon{width:42px;height:42px;border-radius:13px;background:var(--gold-soft);color:var(--gold-deep);display:grid;place-items:center;font-weight:800;flex:none}
.contact-detail b{display:block;font-size:14px}
.contact-detail span,.contact-detail a{display:block;color:var(--muted);font-size:13px;margin-top:2px}
.contact-detail a:hover{color:var(--gold-deep)}
.enquiry-card h3{font-size:24px;margin:8px 0 20px}
.enquiry-card .eyebrow{margin-bottom:2px}
.enquiry-field{margin-bottom:15px}
.enquiry-field label{display:block;font-size:12px;font-weight:700;color:var(--muted);margin-bottom:7px}
.enquiry-field input,.enquiry-field textarea,.enquiry-field select{width:100%;padding:13px 14px;border:1px solid var(--line2);border-radius:13px;background:var(--paper);color:var(--ink);font:inherit;outline:none;transition:.2s}
.enquiry-field textarea{min-height:125px;resize:vertical}
.enquiry-field input:focus,.enquiry-field textarea:focus,.enquiry-field select:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(234,206,85,.14)}
.enquiry-card .btn{width:100%;margin-top:4px}
.form-note{font-size:11px!important;color:var(--faint)!important;margin:11px 0 0;text-align:center}
.contact-bottom{margin-top:18px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.contact-bottom-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;text-align:center;box-shadow:var(--shadow-sm)}
.contact-bottom-card b{display:block;font-size:13px;margin-bottom:3px}
.contact-bottom-card a{font-size:12px;color:var(--muted)}
.contact-bottom-card a:hover{color:var(--gold-deep)}
@media(max-width:900px){.contact-layout{grid-template-columns:1fr}}
@media(max-width:620px){.contact-hero{padding:62px 0 45px}.contact-hero h1{font-size:42px}.contact-info-card,.enquiry-card{padding:22px}.contact-bottom{grid-template-columns:1fr}}

/* Client logo slider */
.client-showcase{overflow:hidden}
.client-slider{position:relative;overflow:hidden;margin-top:28px;padding:8px 0}
.client-slider:before,.client-slider:after{content:"";position:absolute;top:0;bottom:0;width:90px;z-index:2;pointer-events:none}
.client-slider:before{left:0;background:linear-gradient(90deg,var(--paper),rgba(246,245,241,0))}
.client-slider:after{right:0;background:linear-gradient(270deg,var(--paper),rgba(246,245,241,0))}
.client-track{display:flex;width:max-content;animation:orbixClientScroll 28s linear infinite}
.client-slider:hover .client-track,.client-slider:focus-within .client-track{animation-play-state:paused}
.client-slide{width:230px;height:125px;margin:0 10px;background:#fff;border:1px solid var(--line);border-radius:20px;display:grid;place-items:center;padding:18px;box-shadow:var(--shadow-sm);flex:none}
.client-slide img{display:block;width:100%;height:100%;object-fit:contain}
@keyframes orbixClientScroll{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 5px))}}
.portfolio-grid{align-items:stretch}
.portfolio-card{display:flex;flex-direction:column;padding:0;overflow:hidden}
.portfolio-logo-wrap{height:190px;background:#fff;display:grid;place-items:center;padding:22px;border-bottom:1px solid var(--line)}
.portfolio-logo-wrap img{width:100%;height:100%;object-fit:contain}
.portfolio-meta{padding:22px 22px 0}
.portfolio-meta small{color:var(--gold-deep);font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.portfolio-meta h3{margin:7px 0 8px}
.portfolio-meta p{margin:0}
.portfolio-drive{margin:20px 22px 22px;margin-top:auto;text-align:center}
.portfolio-drive.disabled{opacity:.55;cursor:not-allowed;pointer-events:none}
@media(max-width:620px){.client-slide{width:210px;height:115px}.client-slider:before,.client-slider:after{width:45px}.portfolio-logo-wrap{height:175px}}
@media(prefers-reduced-motion:reduce){.client-track{animation:none}.client-slide:nth-child(n+6){display:none}}

/* Approved UX refinements */
.floating-contact:hover{transform:translateY(-3px);box-shadow:0 16px 35px rgba(27,26,23,.28)}.floating-contact span{color:var(--gold)}
.optional-services{background:var(--paper)}.optional-services .section-head{margin-bottom:30px}.optional-services-grid{align-items:stretch}.optional-services .addon-box{background:#fff;box-shadow:var(--shadow-sm);padding:22px}.optional-services .addon{padding:9px 0}.optional-services .addon span{font-size:13px}.optional-services .addon b{font-size:13px}
.social-icon-link{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:var(--ink);transition:.2s}.social-icon-link:hover{transform:translateY(-3px)}.social-icon-link b{margin:0}.social-icon-link span:not(.social-icon){color:var(--muted);font-size:12px}.social-icon{width:38px;height:38px;border-radius:12px;background:var(--ink);color:#fff;display:grid;place-items:center;margin-bottom:2px}.social-icon svg{width:19px;height:19px;fill:currentColor}
@media(max-width:900px){.footer-main{grid-template-columns:1.4fr 1fr 1fr}}
@media(max-width:620px){.footer-main{grid-template-columns:1fr 1fr;gap:25px}.footer-brand{grid-column:1/-1}.footer-bottom{flex-direction:column}.optional-services-grid{grid-template-columns:1fr}.optional-services .addon{align-items:flex-start}.optional-services .addon b{white-space:normal;text-align:right}.work-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.floating-contact,.social-icon-link{transition:none!important}}

/* Final spacing + stable, uniform client logo presentation */
.client-showcase{padding-top:50px;padding-bottom:50px;overflow:hidden}
.client-slider{width:100%;overflow:hidden;margin-top:24px;padding:6px 0 10px}
.client-track{display:flex;width:max-content;gap:14px;animation:clientMarquee 28s linear infinite}
.client-slide{width:220px;height:122px;background:#fff;border:1px solid var(--line);border-radius:18px;display:flex;align-items:center;justify-content:center;padding:12px;box-shadow:var(--shadow-sm);flex:0 0 220px;overflow:hidden}
.client-slide img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.client-slider:hover .client-track{animation-play-state:paused}
@keyframes clientMarquee{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 7px))}}
/* Portfolio — rebuilt for consistent alignment and responsive cards */
.portfolio-page{padding-top:52px;padding-bottom:48px}
.portfolio-intro{max-width:760px;margin:0 auto 28px}
.portfolio-grid-new{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.portfolio-card-new{background:#fff;border:1px solid var(--line);border-radius:24px;padding:18px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;min-width:0;transition:transform .2s,box-shadow .2s}
.portfolio-card-new:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.portfolio-logo-frame{height:178px;border:1px solid var(--line);border-radius:18px;background:#fff;display:flex;align-items:center;justify-content:center;padding:16px;overflow:hidden}
.portfolio-logo-frame img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}
.portfolio-card-content{padding:19px 4px 3px;display:flex;flex-direction:column;flex:1}
.portfolio-category{font-size:10px;font-weight:800;letter-spacing:.9px;text-transform:uppercase;color:var(--gold-deep);margin-bottom:7px}
.portfolio-card-new h2,.portfolio-card-new h3{font-size:24px;margin:0 0 7px}
.portfolio-card-new p{font-size:13px;line-height:1.55;margin:0 0 14px;max-width:52ch}
.portfolio-services{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px}
.portfolio-services span{font-size:10.5px;font-weight:700;padding:6px 9px;border-radius:999px;background:var(--gold-soft);color:var(--gold-deep);border:1px solid rgba(120,96,15,.08)}
.portfolio-card-new .portfolio-action{margin-top:auto;display:flex;justify-content:flex-start}
.portfolio-action .btn{font-size:12px;padding:10px 14px}
.portfolio-action .disabled{opacity:.55;cursor:not-allowed;pointer-events:none}
.portfolio-note{margin-top:22px;text-align:center;font-size:11px;color:var(--faint)}
/* Optional services: responsive semantic cards instead of a fixed screenshot */
.optional-services{padding-top:54px;padding-bottom:54px}
.optional-services .section-head{margin-bottom:24px}
.optional-services-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:16px}
.optional-services .addon-box{min-width:0}
.optional-services .addon{min-height:43px;align-items:center}
.optional-services .addon span{min-width:0}
.optional-services .addon b{white-space:nowrap;text-align:right}
/* Tighten the vertical gaps between sections without removing breathing room */
main>.section + .section{padding-top:48px}
@media(max-width:900px){.portfolio-grid-new{grid-template-columns:1fr}.portfolio-logo-frame{height:165px}.optional-services-grid{grid-template-columns:1fr}}
@media(max-width:620px){
 .section{padding:48px 0} main>.section + .section{padding-top:38px} .hero{padding:54px 0 40px}
 .client-showcase{padding-top:38px;padding-bottom:40px}.client-slide{width:184px;height:104px;flex-basis:184px;border-radius:16px;padding:10px}.client-track{gap:10px;animation-duration:24s}
 .portfolio-page{padding-top:40px;padding-bottom:38px}.portfolio-card-new{padding:14px;border-radius:20px}.portfolio-logo-frame{height:145px;border-radius:15px;padding:12px}.portfolio-card-content{padding:16px 2px 2px}.portfolio-card-new h2,.portfolio-card-new h3{font-size:21px}
 .optional-services{padding-top:42px;padding-bottom:42px}.optional-services .addon{gap:10px;align-items:flex-start}.optional-services .addon b{white-space:normal;max-width:42%;font-size:12px}
}
@media(prefers-reduced-motion:reduce){.client-track{animation:none!important}.portfolio-card-new{transition:none!important}}

/* Final motion + spacing refinement: preserve Orbix visual language. */
:root{--section-space:44px;--motion-fast:180ms;--motion-base:360ms;--motion-slow:600ms;--ease-orbix:cubic-bezier(.22,.8,.25,1)}
.section{padding:var(--section-space) 0}
.hero{padding:54px 0 40px}
.section-head{margin-bottom:20px}
.client-showcase{padding-top:38px;padding-bottom:38px}
.client-slider{margin-top:18px;padding:5px 0 8px}
.client-slide{width:220px;height:118px;padding:10px;transition:transform var(--motion-base) var(--ease-orbix),box-shadow var(--motion-base) var(--ease-orbix)}
.client-slide:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.client-slide img{width:100%;height:100%;object-fit:contain;object-position:center}
.service-grid,.plans,.add-ons,.process-grid,.team,.portfolio-grid-new{gap:13px}
.service-card,.plan,.about-card,.step,.work,.person,.addon-box,.contact-info-card,.enquiry-card,.portfolio-card-new{transition:transform var(--motion-base) var(--ease-orbix),box-shadow var(--motion-base) var(--ease-orbix),border-color var(--motion-base) ease}
.service-card:hover,.work:hover,.person:hover,.step:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm)}
.btn{transition:transform var(--motion-fast) var(--ease-orbix),box-shadow var(--motion-fast) ease,background-color var(--motion-fast) ease}
.btn:hover{transform:translateY(-2px)}
.nav-links a{transition:color var(--motion-fast) ease}
.page-transition{animation:orbixPageIn .42s var(--ease-orbix) both}
.reveal{opacity:0;transform:translate3d(0,18px,0);transition:opacity .58s var(--ease-orbix),transform .58s var(--ease-orbix);will-change:opacity,transform}
.reveal.visible{opacity:1;transform:translate3d(0,0,0)}
.reveal:nth-child(2){transition-delay:60ms}.reveal:nth-child(3){transition-delay:100ms}.reveal:nth-child(4){transition-delay:140ms}.reveal:nth-child(5){transition-delay:180ms}

/* Remove page-number labels from the homepage directory cards. */
#services .service-no,.section .service-grid .service-no{display:none}

/* Compact homepage directory cards after removing the numeric labels. */
.service-grid .service-card h3{margin-top:0}

/* Portfolio: clean editorial project layout with stable logo areas. */
.portfolio-hero{padding-top:52px;padding-bottom:30px}
.portfolio-hero-copy{max-width:820px;margin:0 auto;text-align:center}
.portfolio-hero-copy h1{font-size:clamp(40px,6vw,68px);max-width:14ch;margin:18px auto 14px}
.portfolio-hero-copy p{font-size:17px;max-width:680px;margin:0 auto}
.portfolio-list{padding-top:16px;padding-bottom:42px}
.portfolio-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.portfolio-project{background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;display:flex;flex-direction:column;min-width:0;box-shadow:var(--shadow-sm);transition:transform var(--motion-base) var(--ease-orbix),box-shadow var(--motion-base) var(--ease-orbix)}
.portfolio-project:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.portfolio-project-logo{height:190px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:center;padding:18px;overflow:hidden}
.portfolio-project-logo img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.portfolio-project-info{padding:22px 23px 23px;display:flex;flex-direction:column;flex:1}
.portfolio-category{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:7px}
.portfolio-project h2{font-size:24px;margin:0 0 8px;line-height:1.18}
.portfolio-project p{font-size:13px;margin:0 0 15px;line-height:1.55;max-width:58ch}
.portfolio-services{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:20px}
.portfolio-services span{font-size:10.5px;font-weight:700;padding:6px 9px;border-radius:999px;background:var(--gold-soft);color:var(--gold-deep);border:1px solid rgba(120,96,15,.08)}
.portfolio-drive-btn{display:inline-flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding:11px 13px;border:1px solid var(--line2);border-radius:999px;font-size:12px;font-weight:800;color:var(--ink);transition:transform var(--motion-fast) var(--ease-orbix),background-color var(--motion-fast) ease,border-color var(--motion-fast) ease}
.portfolio-drive-btn:hover{transform:translateY(-2px);background:var(--gold-soft);border-color:rgba(120,96,15,.22)}
.portfolio-drive-btn span{color:var(--gold-deep)}
.portfolio-note{text-align:center;color:var(--faint);font-size:11px;margin:18px 0 0}

/* Contact enquiry now opens WhatsApp. */
.enquiry-card .btn{cursor:pointer}

/* Smaller vertical rhythm on compact screens without changing the design. */
@media(max-width:900px){.section{padding:40px 0}.hero{padding:48px 0 34px}.portfolio-cards{grid-template-columns:1fr}.portfolio-project-logo{height:175px}.portfolio-hero{padding-top:44px;padding-bottom:24px}}
@media(max-width:620px){.section{padding:34px 0}.hero{padding:42px 0 30px}.client-showcase{padding-top:30px;padding-bottom:30px}.client-slide{width:210px;height:112px}.portfolio-hero-copy h1{font-size:40px}.portfolio-hero-copy p{font-size:15px}.portfolio-project-info{padding:19px}.portfolio-project-logo{height:160px}}

/* Respect devices that prefer less motion. */
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.page-transition,.reveal{animation:none!important;transition:none!important;transform:none!important;opacity:1!important}.btn,.service-card,.work,.person,.step,.portfolio-project,.portfolio-drive-btn,.client-slide,.floating-contact,.social-icon-link{transition:none!important}}

/* Floating WhatsApp contact button */
.floating-contact{position:fixed;right:22px;bottom:22px;width:58px;height:58px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#111;border:1px solid rgba(27,26,23,.12);box-shadow:0 12px 30px rgba(27,26,23,.16);z-index:1000;transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease,color .22s ease}
.floating-contact:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(27,26,23,.2);background:#111;color:#fff}
.floating-contact:focus-visible{outline:3px solid var(--gold);outline-offset:4px}
.floating-wa-icon{width:27px;height:27px;display:block}
@media(max-width:620px){.floating-contact{right:16px;bottom:16px;width:54px;height:54px}.floating-wa-icon{width:25px;height:25px}}
@media(prefers-reduced-motion:reduce){.floating-contact{transition:none}.floating-contact:hover{transform:none}}

/* Professional navigation/content icon system */
.service-grid-icons .service-card{position:relative}
.service-icon,.value-icon,.eyebrow-inline-icon,.blog-card-icon{display:grid;place-items:center}
.service-icon{width:46px;height:46px;border-radius:14px;background:var(--gold-soft);border:1px solid rgba(120,96,15,.08);margin-bottom:13px}
.service-icon svg,.value-icon svg,.eyebrow-inline-icon svg,.blog-card-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.value-icon{width:36px;height:36px;border-radius:11px;background:#fff;border:1px solid var(--line);color:var(--gold-deep);margin-bottom:10px}
.eyebrow-inline-icon{width:18px;height:18px;margin-left:-2px}.eyebrow-inline-icon svg{width:14px;height:14px}
.services-home{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.optional-services-home{background:var(--paper)}
.package-bottom{padding-top:42px;padding-bottom:42px}
.package-bottom .add-ons{margin-top:0}
.package-faq{padding-top:42px;padding-bottom:70px}
.email-action{cursor:pointer}

/* Blog */
.blog-hero{padding:66px 0 30px}
.blog-hero-copy{text-align:center;max-width:820px;margin:auto}
.blog-hero-copy h1{font-size:clamp(42px,6vw,68px);max-width:15ch;margin:20px auto 14px}
.blog-hero-copy p{font-size:17px;max-width:680px;margin:0 auto}
.blog-list{padding-top:20px}
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.blog-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;min-height:310px;transition:transform var(--motion-base) var(--ease-orbix),box-shadow var(--motion-base) var(--ease-orbix)}
.blog-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.blog-card-icon{width:48px;height:48px;border-radius:14px;background:var(--gold-soft);color:var(--gold-deep);margin-bottom:16px}
.blog-card-icon svg{width:24px;height:24px}
.blog-meta{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:7px}
.blog-card h2{font-size:22px;margin:0 0 10px}.blog-card p{font-size:13px;line-height:1.55;margin:0 0 18px}.text-link{margin-top:auto;font-size:12px;font-weight:800;color:var(--gold-deep)}
@media(max-width:900px){.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.blog-hero{padding:48px 0 20px}.blog-hero-copy h1{font-size:40px}.blog-hero-copy p{font-size:15px}.blog-grid{grid-template-columns:1fr}.blog-card{min-height:0}.service-icon{width:42px;height:42px}}

/* SEO blog article presentation */
.article-wrap{max-width:900px}.article-head{max-width:820px;margin:0 auto 36px}.article-head h1{font-size:clamp(40px,6vw,64px);margin:20px 0 14px}.article-lead{font-size:18px;max-width:760px}.article-body{max-width:780px;margin:0 auto}.article-body h2{font-size:clamp(24px,3vw,32px);margin:34px 0 10px}.article-body p{font-size:16px;margin:0 0 18px}.blog-meta{font-size:12px;color:var(--faint);font-weight:700}.blog-seo-note{font-size:14px;color:var(--muted);max-width:760px;margin:12px auto 0}.floating-contact{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:#fff;position:fixed;right:22px;bottom:22px;z-index:200;box-shadow:0 12px 28px rgba(27,26,23,.24);font:800 12px "Sora",Arial,sans-serif;border:2px solid rgba(234,206,85,.65)}
@media(max-width:620px){.article-head h1{font-size:40px}.article-body p{font-size:15px}.floating-contact{right:16px;bottom:16px;width:54px;height:54px}}

/* V3 refinement: service navigation, logo sizing and redesigned contact form */
.brand-kicker{display:inline-flex;align-items:center;padding:7px 11px;border-radius:999px;background:var(--gold-soft);color:var(--gold-deep);font-size:12px;font-weight:800;letter-spacing:.2px;margin-bottom:2px}
.quick-nav{padding:12px 0 52px;background:var(--paper)}
.quick-nav-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.quick-nav-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:17px 16px;color:var(--ink);box-shadow:var(--shadow-sm);transition:transform var(--motion-fast) var(--ease-orbix),box-shadow var(--motion-fast) ease,border-color var(--motion-fast) ease}
.quick-nav-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:rgba(234,206,85,.75)}
.quick-nav-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:var(--gold-soft);color:var(--gold-deep);flex:none}
.quick-nav-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.quick-nav-card b{display:block;font-size:13px}.quick-nav-card small{display:block;margin-top:3px;color:var(--muted);font-size:11px}.quick-nav-card strong{font-size:18px;color:var(--gold-deep)}
.logo img{height:42px;width:auto;max-width:180px}.footer-logo{width:210px;max-width:100%}.footer-logo img{height:auto;width:210px;max-width:100%;object-fit:contain;filter:brightness(0) invert(1);}
.contact-section{padding-top:34px}.contact-grid-pro{display:grid;grid-template-columns:1.45fr .95fr;gap:26px;align-items:start}.contact-form-pro{padding:40px;border-radius:28px}.contact-form-pro h2{font-size:38px;margin:8px 0}.form-intro{margin:0 0 25px;font-size:14px;max-width:65ch}.form-grid-two{display:grid;grid-template-columns:1fr 1fr;gap:15px}.contact-form-pro .enquiry-field{margin-bottom:17px}.contact-form-pro label{color:var(--ink)}.contact-form-pro label span{color:var(--gold-deep)}.contact-form-pro label small{color:var(--faint);font-weight:500}.contact-form-pro input,.contact-form-pro select,.contact-form-pro textarea{background:#fcfbf8}.contact-form-pro textarea{min-height:135px}.form-actions-pro{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}.form-actions-pro .btn{width:100%;min-height:48px}.form-actions-pro .btn svg{width:18px;height:18px;fill:currentColor;stroke:currentColor;stroke-width:0}.form-actions-pro .btn.gold svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.contact-side-pro{display:grid;gap:14px}.direct-card,.promise-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px;box-shadow:var(--shadow-sm)}.direct-card{border-color:var(--gold)}.direct-card h2{font-size:23px;margin:7px 0}.direct-card p{font-size:13px;margin-bottom:18px}.direct-row{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:center;border:1px solid var(--line);border-radius:16px;padding:13px 14px;margin-top:10px;color:var(--ink);transition:transform var(--motion-fast) ease,box-shadow var(--motion-fast) ease,border-color var(--motion-fast) ease}.direct-row:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm);border-color:var(--line2)}.channel-icon{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:#fff;border:1px solid var(--line)}.channel-icon svg{width:19px;height:19px;fill:currentColor;stroke:currentColor}.wa-row .channel-icon{background:#22c96b;color:#fff;border-color:#22c96b}.email-row .channel-icon{color:#b18a14}.ig-row .channel-icon{background:linear-gradient(135deg,#7b2cff,#ff3f7d,#ff9f1c);color:#fff;border:0;font-size:21px}.direct-row small{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--gold-deep);font-weight:800}.direct-row b{display:block;font-size:13px;margin-top:2px}.promise-card h3{font-size:18px;margin:7px 0 11px}.promise-card ol{margin:0;padding-left:20px;color:var(--muted);font-size:12.5px}.promise-card li{padding:5px 0 5px 2px}.promise-card li::marker{color:var(--gold-deep);font-weight:800}
@media(max-width:900px){.quick-nav-grid{grid-template-columns:repeat(2,1fr)}.contact-grid-pro{grid-template-columns:1fr}.contact-side-pro{grid-template-columns:1fr 1fr}.direct-card{grid-column:1/-1}}
@media(max-width:620px){.quick-nav{padding-bottom:36px}.quick-nav-grid{grid-template-columns:1fr}.logo img{height:38px;max-width:175px}.footer-logo{width:175px}.footer-logo img{width:175px}.contact-form-pro{padding:24px}.contact-form-pro h2{font-size:30px}.form-grid-two,.form-actions-pro,.contact-side-pro{grid-template-columns:1fr}.direct-card{grid-column:auto}}

.client-slide img.medchikitsa-logo{width:86%;height:86%;object-fit:contain}

/* V4 contact polish */
.phone-input-wrap{display:grid;grid-template-columns:74px minmax(0,1fr);gap:8px;align-items:stretch}
.phone-prefix{display:grid;place-items:center;border:1px solid var(--line2);border-radius:13px;background:#fff;color:var(--ink);font-weight:800;font-size:14px}
.phone-input-wrap input{min-width:0}
.field-help{display:block;margin-top:6px;font-size:11px;color:var(--faint)}
.phone-input-wrap:focus-within .phone-prefix{border-color:var(--gold);box-shadow:0 0 0 4px rgba(234,206,85,.14)}

/* Strict monochrome channel identity */
.channel-icon{background:#fff!important;color:#111!important;border:1px solid rgba(27,26,23,.16)!important}
.channel-icon .brand-svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.channel-icon .whatsapp-svg{fill:currentColor;stroke:none}
.channel-icon .instagram-svg circle:last-child{fill:currentColor}
.direct-row:hover .channel-icon{background:#111!important;color:#fff!important;border-color:#111!important}

/* Monochrome enquiry actions */
.form-actions-pro .contact-submit{background:#111;color:#fff;border:1px solid #111;box-shadow:none}
.form-actions-pro .contact-submit:hover{background:#fff;color:#111;border-color:#111;box-shadow:var(--shadow-sm)}
.form-actions-pro .contact-submit .brand-svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.form-actions-pro .contact-submit .whatsapp-svg{fill:currentColor;stroke:none}

/* Mobile-only contact sticker */
.floating-contact{display:none!important}
@media(max-width:620px){
  .floating-contact{display:inline-flex!important;align-items:center;justify-content:center;gap:9px;width:auto;min-width:132px;height:46px;padding:0 17px;right:16px;bottom:16px;border-radius:16px;background:var(--gold);color:#111;border:1px solid rgba(27,26,23,.16);box-shadow:0 14px 28px rgba(27,26,23,.18);font:800 12px "Sora",Arial,sans-serif;letter-spacing:.01em}
  .floating-contact:before{content:"";position:absolute;right:10px;bottom:-7px;width:14px;height:14px;background:var(--gold);border-right:1px solid rgba(27,26,23,.12);border-bottom:1px solid rgba(27,26,23,.12);transform:rotate(45deg)}
  .floating-contact span,.floating-contact .floating-wa-icon{position:relative;z-index:1}
  .floating-wa-icon{width:21px;height:21px}
  .floating-contact:hover{background:var(--gold);color:#111;transform:translateY(-2px)}
}

/* Compliance + accessibility improvements */
:focus-visible{outline:3px solid #78600f;outline-offset:3px}
a,button,input,select,textarea{touch-action:manipulation}
button:disabled{cursor:not-allowed;opacity:.65}
.consent-field{margin-top:4px}
.consent-label{display:flex!important;align-items:flex-start;gap:10px;line-height:1.5}
.consent-label input{width:18px!important;height:18px!important;min-width:18px!important;margin-top:3px;accent-color:#1b1a17}
.consent-label a{text-decoration:underline}
.field-help{color:#5f5b52!important}
.footer-links a{color:rgba(255,255,255,.82)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}